轻提示铺开到全部页面;内核状态悬停变重启;GEO 支持单文件下载
侧栏动作排撤掉重启图标,内核状态(圆点加版本号)本身变成按钮:悬停 换层显示「重启内核」,不在线时只当状态看。行高压成 1 修掉圆点和等宽 字体不居中的问题。 四个页面的一次性反馈(保存、删除、更新订阅、断开连接、测延迟结论) 全部改走 toast,commit() 改返回成败给「失败不关对话框」用;持续状态 (连接页轮询失败、请求页日志流失败)留在页内,会自动消失的提示装不下 需要一直可见的信息。toast 加 info 类别给中性结论用。 GEO 每行的更新改成单独下载那一个文件:内核只有全量更新的口子,单文件 只能服务端自己下(POST /api/geo/sync),代价是只有形状校验(MaxMind 末尾标记、geodata 首字节,shared/geo.ts 带测试)且内核重启后才换用新 文件;「更新全部」文字按钮保留内核的全量口子,有完整校验和热加载。 上传两行的按钮改「选择或拖放文件」,投放区拖入高亮,恢复策略挪到 恢复行下方。
This commit is contained in:
+56
-8
@@ -4,12 +4,20 @@
|
||||
* 内核不提供这个信息,但文件就躺在它的工作目录里,和 Patchbay 服务端
|
||||
* 在同一台机器上,直接 stat 就是。
|
||||
*/
|
||||
import { readdir, stat } from 'node:fs/promises'
|
||||
import { readdir, rename, stat, writeFile } from 'node:fs/promises'
|
||||
import { join } from 'node:path'
|
||||
import { DEFAULT_GEOX_URLS, GEO_FILES } from '../shared/geo.ts'
|
||||
import { DEFAULT_GEOX_URLS, GEO_FILES, looksLikeGeodata, looksLikeMmdb } from '../shared/geo.ts'
|
||||
import type { GeoFileStatus } from '../shared/geo.ts'
|
||||
import type { Env } from './env.ts'
|
||||
|
||||
/** 配置里写了就用配置的,否则退回内核默认。 */
|
||||
function urlFor(geoxUrl: Record<string, unknown>, configKey: string): string {
|
||||
const configured = geoxUrl[configKey]
|
||||
return typeof configured === 'string' && configured !== ''
|
||||
? configured
|
||||
: (DEFAULT_GEOX_URLS[configKey] ?? '')
|
||||
}
|
||||
|
||||
export async function geoStatus(
|
||||
env: Env,
|
||||
geoxUrl: Record<string, unknown>,
|
||||
@@ -28,12 +36,52 @@ export async function geoStatus(
|
||||
updatedAt = info.mtime.toISOString()
|
||||
}
|
||||
}
|
||||
const configured = geoxUrl[configKey]
|
||||
const url =
|
||||
typeof configured === 'string' && configured !== ''
|
||||
? configured
|
||||
: (DEFAULT_GEOX_URLS[configKey] ?? '')
|
||||
return { key, configKey, url, size, updatedAt }
|
||||
return { key, configKey, url: urlFor(geoxUrl, configKey), size, updatedAt }
|
||||
}),
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* 下载单个 GEO 文件写进内核工作目录。
|
||||
*
|
||||
* 内核的更新接口是全量的(POST /configs/geo,按 enable 标记更新它用到的类型),
|
||||
* 单文件只能 Patchbay 自己下。代价是拿不到内核那套完整校验,只能做形状检查
|
||||
* (shared/geo.ts),也不触发热加载——内核用 mmap 缓存着旧数据,重启后才换新。
|
||||
*/
|
||||
export async function syncGeoFile(
|
||||
env: Env,
|
||||
configKey: string,
|
||||
geoxUrl: Record<string, unknown>,
|
||||
): Promise<{ ok: true } | { ok: false; message: string }> {
|
||||
const spec = GEO_FILES.find((g) => g.configKey === configKey)
|
||||
if (!spec) return { ok: false, message: `未知的 GEO 类型:${configKey}` }
|
||||
const url = urlFor(geoxUrl, configKey)
|
||||
|
||||
let bytes: Uint8Array
|
||||
try {
|
||||
const res = await fetch(url, { signal: AbortSignal.timeout(300_000), redirect: 'follow' })
|
||||
if (!res.ok) return { ok: false, message: `下载失败:HTTP ${String(res.status)}` }
|
||||
bytes = new Uint8Array(await res.arrayBuffer())
|
||||
} catch (error) {
|
||||
return { ok: false, message: `下载失败:${String(error)}` }
|
||||
}
|
||||
|
||||
const shapeOk =
|
||||
configKey === 'mmdb' || configKey === 'asn' ? looksLikeMmdb(bytes) : looksLikeGeodata(bytes)
|
||||
if (!shapeOk) {
|
||||
return { ok: false, message: `下载到的内容不像 ${spec.key} 文件,已丢弃,本地文件没有动。` }
|
||||
}
|
||||
|
||||
// 沿用目录里现有的大小写写法,内核就是这样找文件的
|
||||
const entries = await readdir(env.mihomoHome).catch(() => [] as string[])
|
||||
const actual = entries.find((name) => name.toLowerCase() === spec.file.toLowerCase()) ?? spec.file
|
||||
const finalPath = join(env.mihomoHome, actual)
|
||||
const tempPath = `${finalPath}.patchbay-tmp`
|
||||
try {
|
||||
await writeFile(tempPath, bytes)
|
||||
await rename(tempPath, finalPath)
|
||||
} catch (error) {
|
||||
return { ok: false, message: `写入失败:${String(error)}` }
|
||||
}
|
||||
return { ok: true }
|
||||
}
|
||||
|
||||
+11
-1
@@ -22,7 +22,7 @@ import {
|
||||
restoreBackup,
|
||||
undoConfig,
|
||||
} from './config-store.ts'
|
||||
import { geoStatus } from './geo.ts'
|
||||
import { geoStatus, syncGeoFile } from './geo.ts'
|
||||
import { hostInfo, probeExit } from './host.ts'
|
||||
import {
|
||||
kernelVersion,
|
||||
@@ -306,6 +306,16 @@ function makeRoute(env: Env, token: string) {
|
||||
return json({ files: await geoStatus(env, geox) })
|
||||
}
|
||||
|
||||
// 单个 GEO 文件的下载。服务端自己下(内核只有全量更新的口子),重启后生效
|
||||
if (path === '/api/geo/sync' && req.method === 'POST') {
|
||||
const body = (await req.json()) as { key?: string }
|
||||
if (typeof body.key !== 'string') return json({ message: '请求缺少 key 字段' }, 400)
|
||||
const snapshot = await readConfig(env)
|
||||
const geox = (snapshot.data['geox-url'] ?? {}) as Record<string, unknown>
|
||||
const result = await syncGeoFile(env, body.key, geox)
|
||||
return result.ok ? json({ ok: true }) : json({ message: result.message }, 502)
|
||||
}
|
||||
|
||||
// 更新 GEO 数据库。运行时动作;同步接口,透传层给了长超时
|
||||
if (path === '/api/kernel/geo' && req.method === 'POST') {
|
||||
const upstream = await updateGeoDatabases(env)
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
import { describe, expect, test } from 'bun:test'
|
||||
import { looksLikeGeodata, looksLikeMmdb } from './geo.ts'
|
||||
|
||||
describe('GEO 文件的形状检查', () => {
|
||||
test('末尾带 MaxMind 标记的通过,纯垃圾不通过', () => {
|
||||
const marker = new Uint8Array([
|
||||
0xab,
|
||||
0xcd,
|
||||
0xef,
|
||||
...Array.from('MaxMind.com', (c) => c.charCodeAt(0)),
|
||||
])
|
||||
const good = new Uint8Array(4096)
|
||||
good.set(marker, 4000)
|
||||
expect(looksLikeMmdb(good)).toBe(true)
|
||||
expect(looksLikeMmdb(new Uint8Array(4096))).toBe(false)
|
||||
})
|
||||
|
||||
test('标记只认末尾 128KB,太靠前算无效', () => {
|
||||
const marker = new Uint8Array([
|
||||
0xab,
|
||||
0xcd,
|
||||
0xef,
|
||||
...Array.from('MaxMind.com', (c) => c.charCodeAt(0)),
|
||||
])
|
||||
const bytes = new Uint8Array(300 * 1024)
|
||||
bytes.set(marker, 100)
|
||||
expect(looksLikeMmdb(bytes)).toBe(false)
|
||||
})
|
||||
|
||||
test('geodata 认首字节 0x0a,HTML 错误页和小文件被挡下', () => {
|
||||
const good = new Uint8Array(2048)
|
||||
good[0] = 0x0a
|
||||
expect(looksLikeGeodata(good)).toBe(true)
|
||||
|
||||
const html = new Uint8Array(2048)
|
||||
html[0] = '<'.charCodeAt(0)
|
||||
expect(looksLikeGeodata(html)).toBe(false)
|
||||
|
||||
const tiny = new Uint8Array(10)
|
||||
tiny[0] = 0x0a
|
||||
expect(looksLikeGeodata(tiny)).toBe(false)
|
||||
})
|
||||
})
|
||||
@@ -28,6 +28,33 @@ export const GEO_FILES = [
|
||||
{ key: 'GEOSITE', configKey: 'geosite', file: 'GeoSite.dat' },
|
||||
] as const
|
||||
|
||||
/**
|
||||
* 下载内容的形状检查,挡住 HTML 错误页、截断的下载这类明显的坏文件。
|
||||
* Patchbay 自己下载单个 GEO 文件时用(内核的更新接口是全量的,单文件
|
||||
* 下载只能自己来,也就拿不到内核那套完整校验)。
|
||||
*/
|
||||
|
||||
/** MaxMind 格式:元数据标记按规范出现在文件末尾 128KB 内。MMDB 和 ASN 都是这个格式。 */
|
||||
export function looksLikeMmdb(bytes: Uint8Array): boolean {
|
||||
const marker = [0xab, 0xcd, 0xef, ...Array.from('MaxMind.com', (c) => c.charCodeAt(0))]
|
||||
const from = Math.max(0, bytes.length - 128 * 1024)
|
||||
outer: for (let i = from; i <= bytes.length - marker.length; i++) {
|
||||
for (let j = 0; j < marker.length; j++) {
|
||||
if (bytes[i + j] !== marker[j]) continue outer
|
||||
}
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
/**
|
||||
* geoip.dat / geosite.dat:GeoIPList 和 GeoSiteList 都是「repeated 消息字段 1」,
|
||||
* 首字节必然是 0x0a。弱校验,但足够挡住以 '<' 开头的错误页和空文件。
|
||||
*/
|
||||
export function looksLikeGeodata(bytes: Uint8Array): boolean {
|
||||
return bytes.length > 1024 && bytes[0] === 0x0a
|
||||
}
|
||||
|
||||
/** 内核的默认下载地址(config.go:578-583)。配置里没写 geox-url 时就是这些。 */
|
||||
export const DEFAULT_GEOX_URLS: Record<string, string> = {
|
||||
mmdb: 'https://github.com/MetaCubeX/meta-rules-dat/releases/download/latest/geoip.metadb',
|
||||
|
||||
+69
-12
@@ -271,22 +271,23 @@ const current = computed(() => NAV.find((n) => n.key === active.value))
|
||||
>
|
||||
<IconReload />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="side-foot">
|
||||
<!-- 平时是内核状态,悬停变成重启入口。内核不在线时只当状态看 -->
|
||||
<button
|
||||
type="button"
|
||||
class="act"
|
||||
class="kernel-btn"
|
||||
:title="kernel.online ? '重启内核' : '内核未连接'"
|
||||
:disabled="!kernel.online"
|
||||
@click="askRestart = true"
|
||||
>
|
||||
<IconRestart />
|
||||
<span class="k-idle">
|
||||
<span :class="['dot', kernel.online ? 'dot-ok' : 'dot-off']" aria-hidden="true"></span>
|
||||
<span class="kernel-text mono">{{ kernel.online ? kernel.version : 'offline' }}</span>
|
||||
</span>
|
||||
<span class="k-hot" aria-hidden="true"><IconRestart class="k-ico" /> 重启内核</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="side-foot">
|
||||
<div class="kernel" :title="kernel.online ? kernel.version : '内核未连接'">
|
||||
<span :class="['dot', kernel.online ? 'dot-ok' : 'dot-off']" aria-hidden="true"></span>
|
||||
<span class="kernel-text mono">{{ kernel.online ? kernel.version : 'offline' }}</span>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
class="densify"
|
||||
@@ -466,13 +467,13 @@ const current = computed(() => NAV.find((n) => n.key === active.value))
|
||||
/* 收拢时淡出的文字。比外层宽度的 0.3s 快,字先消失、再收边,不露半截字 */
|
||||
.brand-name,
|
||||
.nav-label,
|
||||
.kernel {
|
||||
.kernel-btn {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.is-compact .brand-name,
|
||||
.is-compact .nav-label,
|
||||
.is-compact .kernel {
|
||||
.is-compact .kernel-btn {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@@ -579,13 +580,69 @@ const current = computed(() => NAV.find((n) => n.key === active.value))
|
||||
padding: 0 44px 0 var(--s-2);
|
||||
}
|
||||
|
||||
.kernel {
|
||||
/* 内核状态兼重启按钮:两层叠在同一格里,悬停换层 */
|
||||
.kernel-btn {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
height: 26px;
|
||||
padding: 0 var(--s-2);
|
||||
border: none;
|
||||
border-radius: var(--r-sm);
|
||||
background: none;
|
||||
cursor: pointer;
|
||||
text-align: left;
|
||||
}
|
||||
.kernel-btn:disabled {
|
||||
cursor: default;
|
||||
}
|
||||
.kernel-btn:hover:not(:disabled) {
|
||||
background: var(--c-surface-sunken);
|
||||
}
|
||||
|
||||
.k-idle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--s-2);
|
||||
min-width: 0;
|
||||
color: var(--c-text-faint);
|
||||
font-size: var(--t-xs);
|
||||
/* 等宽字体的行框上下不对称,压成 1 让点和文字真正居中 */
|
||||
line-height: 1;
|
||||
transition: opacity 0.15s ease;
|
||||
}
|
||||
|
||||
.k-hot {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--s-2);
|
||||
padding: 0 var(--s-2);
|
||||
color: var(--c-text-soft);
|
||||
font-size: var(--t-xs);
|
||||
line-height: 1;
|
||||
white-space: nowrap;
|
||||
opacity: 0;
|
||||
transition: opacity 0.15s ease;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.kernel-btn:hover:not(:disabled) .k-idle,
|
||||
.kernel-btn:focus-visible:not(:disabled) .k-idle {
|
||||
opacity: 0;
|
||||
}
|
||||
.kernel-btn:hover:not(:disabled) .k-hot,
|
||||
.kernel-btn:focus-visible:not(:disabled) .k-hot {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.k-ico {
|
||||
flex: none;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.dot {
|
||||
|
||||
@@ -208,6 +208,13 @@ export const api = {
|
||||
/** 四类 GEO 文件的本地状态:大小、更新时间、生效中的下载地址。 */
|
||||
geoStatus: () => request<{ files: GeoFileStatus[] }>('GET', '/api/geo'),
|
||||
|
||||
/**
|
||||
* 让服务端下载单个 GEO 文件(内核的更新接口是全量的,单文件只能自己下)。
|
||||
* 内核缓存着旧数据,重启后才换用新文件。
|
||||
*/
|
||||
syncGeoFile: (configKey: string) =>
|
||||
request<{ ok: true }>('POST', '/api/geo/sync', { key: configKey }),
|
||||
|
||||
/**
|
||||
* 打开一个持续吐数据的流式接口(/traffic、/memory),每秒一行 JSON。
|
||||
*
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
import { dismiss, toasts } from '../toast'
|
||||
import IconOk from '~icons/ri/checkbox-circle-line'
|
||||
import IconErr from '~icons/ri/error-warning-line'
|
||||
import IconInfo from '~icons/ri/information-line'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -18,6 +19,7 @@ import IconErr from '~icons/ri/error-warning-line'
|
||||
@click="dismiss(t.id)"
|
||||
>
|
||||
<IconErr v-if="t.kind === 'error'" class="tico" />
|
||||
<IconInfo v-else-if="t.kind === 'info'" class="tico is-info" />
|
||||
<IconOk v-else class="tico" />
|
||||
<div class="tbody">
|
||||
<strong class="tmsg">{{ t.message }}</strong>
|
||||
@@ -74,6 +76,10 @@ import IconErr from '~icons/ri/error-warning-line'
|
||||
color: var(--c-danger);
|
||||
}
|
||||
|
||||
.tico.is-info {
|
||||
color: var(--c-text-soft);
|
||||
}
|
||||
|
||||
.tbody {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
+4
-2
@@ -8,9 +8,11 @@
|
||||
import { ref } from 'vue'
|
||||
import { ApiError } from './api'
|
||||
|
||||
export type ToastKind = 'ok' | 'error' | 'info'
|
||||
|
||||
export interface Toast {
|
||||
id: number
|
||||
kind: 'ok' | 'error'
|
||||
kind: ToastKind
|
||||
message: string
|
||||
hint: string
|
||||
}
|
||||
@@ -19,7 +21,7 @@ export const toasts = ref<Toast[]>([])
|
||||
|
||||
let nextId = 1
|
||||
|
||||
export function toast(message: string, opts?: { kind?: 'ok' | 'error'; hint?: string }): void {
|
||||
export function toast(message: string, opts?: { kind?: ToastKind; hint?: string }): void {
|
||||
const item: Toast = {
|
||||
id: nextId++,
|
||||
kind: opts?.kind ?? 'ok',
|
||||
|
||||
+19
-86
@@ -22,6 +22,7 @@ import type { Subscription } from '@shared/providers.ts'
|
||||
import { providerCachePath } from '@shared/inbound-groups.ts'
|
||||
import type { ConfigObject } from '../../vendor/config-editor/index.ts'
|
||||
import { ApiError, api } from '../api'
|
||||
import { toast, toastError } from '../toast'
|
||||
import type { ProviderInfo } from '../api'
|
||||
import { kernel, providerLines, reloadRuntime } from '../runtime'
|
||||
import ConfirmDialog from '../components/ConfirmDialog.vue'
|
||||
@@ -30,7 +31,6 @@ import SubscriptionDetail from './SubscriptionDetail.vue'
|
||||
import SubscriptionForm from './SubscriptionForm.vue'
|
||||
import IconAdd from '~icons/ri/add-line'
|
||||
import IconRefresh from '~icons/ri/refresh-line'
|
||||
import IconClose from '~icons/ri/close-line'
|
||||
|
||||
const props = defineProps<{ data: ConfigObject; revision: string }>()
|
||||
|
||||
@@ -41,9 +41,6 @@ const subscriptions = computed(() => listSubscriptions(props.data))
|
||||
|
||||
const selectedName = ref<string | null>(null)
|
||||
const saving = ref(false)
|
||||
const failure = ref<{ message: string; hint: string } | null>(null)
|
||||
/** 成功的结果,绿色 */
|
||||
const done = ref('')
|
||||
const formOpen = ref(false)
|
||||
const formEditing = ref<Subscription | null>(null)
|
||||
/** 待确认删除的那个订阅。非 null 时确认对话框打开着 */
|
||||
@@ -112,24 +109,21 @@ const rows = computed(() =>
|
||||
|
||||
const clone = () => JSON.parse(JSON.stringify(props.data)) as ConfigObject
|
||||
|
||||
/** 所有改配置文件的动作都从这里走。 */
|
||||
async function commit(raw: ConfigObject, success: string) {
|
||||
/** 所有改配置文件的动作都从这里走。反馈走右上角轻提示,返回值告知成败。 */
|
||||
async function commit(raw: ConfigObject, success: string): Promise<boolean> {
|
||||
// 先把生成的东西按当前规则重建一遍,再清掉没人再引用的。订阅副本的来源被改地址时
|
||||
// 靠这一步保持和原订阅一致,删订阅前已由 subscriptionReferences 挡住有引用的情形。
|
||||
const next = pruneGenerated(syncGenerated(raw, collectInbounds(raw)))
|
||||
saving.value = true
|
||||
failure.value = null
|
||||
done.value = ''
|
||||
try {
|
||||
const result = await api.applyConfig(next, props.revision)
|
||||
// 没重载有两种情况(内容没有变化、内核不在线只写了文件),都要如实说,不能只报成功
|
||||
done.value = result.reloaded ? success : `${success}(${result.reloadMessage})`
|
||||
toast(result.reloaded ? success : `${success}(${result.reloadMessage})`)
|
||||
emit('saved')
|
||||
return true
|
||||
} catch (error) {
|
||||
failure.value =
|
||||
error instanceof ApiError
|
||||
? { message: error.message, hint: error.hint }
|
||||
: { message: String(error), hint: '' }
|
||||
toastError(error)
|
||||
return false
|
||||
} finally {
|
||||
saving.value = false
|
||||
}
|
||||
@@ -160,10 +154,7 @@ async function submitForm(draft: {
|
||||
try {
|
||||
await api.uploadProviderFile(providerCachePath(draft.name), draft.file.content)
|
||||
} catch (error) {
|
||||
failure.value =
|
||||
error instanceof ApiError
|
||||
? { message: error.message, hint: error.hint }
|
||||
: { message: String(error), hint: '' }
|
||||
toastError(error)
|
||||
return
|
||||
}
|
||||
}
|
||||
@@ -173,9 +164,9 @@ async function submitForm(draft: {
|
||||
: draft.file
|
||||
? addFileSubscription(clone(), draft.name)
|
||||
: addSubscription(clone(), draft.name, draft.url, draft.interval)
|
||||
await commit(next, editing ? '已保存' : `已新增 ${draft.name}`)
|
||||
const ok = await commit(next, editing ? '已保存' : `已新增 ${draft.name}`)
|
||||
// 失败时不能关对话框——关了再打开就是空表单,填的名称、地址、间隔全没了
|
||||
if (failure.value) return
|
||||
if (!ok) return
|
||||
formOpen.value = false
|
||||
if (!editing) selectedName.value = draft.name
|
||||
}
|
||||
@@ -186,7 +177,7 @@ function askRemove() {
|
||||
// 被引用的订阅不能删:那些组的 use: 一空,指向它们的入站就无路可走
|
||||
const refs = subscriptionReferences(props.data, target.name)
|
||||
if (refs.length > 0) {
|
||||
failure.value = { message: `无法删除 ${target.name}:${refs.join('、')} 在引用它`, hint: '' }
|
||||
toast(`无法删除 ${target.name}:${refs.join('、')} 在引用它`, { kind: 'error' })
|
||||
return
|
||||
}
|
||||
removing.value = target
|
||||
@@ -205,17 +196,15 @@ async function refresh() {
|
||||
const target = selected.value
|
||||
if (!target || refreshing.value !== null) return
|
||||
refreshing.value = target.name
|
||||
failure.value = null
|
||||
done.value = ''
|
||||
try {
|
||||
await api.refreshProvider(target.name)
|
||||
await Promise.all([reloadRuntime(), reloadProviders()])
|
||||
done.value = `已更新 ${target.name}`
|
||||
toast(`已更新 ${target.name}`)
|
||||
} catch (error) {
|
||||
failure.value = {
|
||||
message: error instanceof ApiError ? error.message : String(error),
|
||||
toast(error instanceof ApiError ? error.message : String(error), {
|
||||
kind: 'error',
|
||||
hint: '该操作仅修改内核运行状态,配置文件未被修改。',
|
||||
}
|
||||
})
|
||||
} finally {
|
||||
refreshing.value = null
|
||||
}
|
||||
@@ -227,19 +216,17 @@ const refreshingAll = ref(false)
|
||||
async function refreshAll() {
|
||||
if (refreshingAll.value || !kernel.value.online || subscriptions.value.length === 0) return
|
||||
refreshingAll.value = true
|
||||
failure.value = null
|
||||
done.value = ''
|
||||
const names = subscriptions.value.map((s) => s.name)
|
||||
const results = await Promise.allSettled(names.map((n) => api.refreshProvider(n)))
|
||||
await Promise.all([reloadRuntime(), reloadProviders()])
|
||||
const failed = names.filter((_, i) => results[i]?.status === 'rejected')
|
||||
if (failed.length > 0) {
|
||||
failure.value = {
|
||||
message: `${failed.join('、')} 更新失败`,
|
||||
toast(`${failed.join('、')} 更新失败`, {
|
||||
kind: 'error',
|
||||
hint: '其余订阅已更新。该操作仅修改内核运行状态,配置文件未被修改。',
|
||||
}
|
||||
})
|
||||
} else {
|
||||
done.value = `已更新全部 ${names.length} 个订阅`
|
||||
toast(`已更新全部 ${names.length} 个订阅`)
|
||||
}
|
||||
refreshingAll.value = false
|
||||
}
|
||||
@@ -276,17 +263,6 @@ async function refreshAll() {
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-if="failure" class="failure">
|
||||
<div class="failure-text">
|
||||
<strong>{{ failure.message }}</strong>
|
||||
<span v-if="failure.hint">{{ failure.hint }}</span>
|
||||
</div>
|
||||
<button type="button" class="failure-x" title="关闭提示" @click="failure = null">
|
||||
<IconClose />
|
||||
</button>
|
||||
</div>
|
||||
<p v-else-if="done" class="done">{{ done }}</p>
|
||||
|
||||
<div class="split">
|
||||
<ProviderList v-model:selected="selectedName" :rows="rows" />
|
||||
|
||||
@@ -380,49 +356,6 @@ async function refreshAll() {
|
||||
gap: var(--s-2);
|
||||
}
|
||||
|
||||
.failure {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--s-3);
|
||||
border: 1px solid color-mix(in srgb, var(--c-danger) 35%, var(--c-border));
|
||||
border-radius: var(--r-md);
|
||||
background: var(--c-danger-soft);
|
||||
padding: var(--s-3) var(--s-4);
|
||||
margin-bottom: var(--s-4);
|
||||
font-size: var(--t-sm);
|
||||
}
|
||||
|
||||
.failure-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--s-1);
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.failure-x {
|
||||
flex: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: none;
|
||||
border-radius: var(--r-sm);
|
||||
background: none;
|
||||
color: var(--c-danger);
|
||||
cursor: pointer;
|
||||
}
|
||||
.failure-x:hover {
|
||||
background: color-mix(in srgb, var(--c-danger) 12%, transparent);
|
||||
}
|
||||
|
||||
.done {
|
||||
color: var(--c-ok);
|
||||
font-size: var(--t-sm);
|
||||
margin-bottom: var(--s-4);
|
||||
}
|
||||
|
||||
/* 左列表右详情。窄时改成上下,详情不再吸顶 */
|
||||
.split {
|
||||
display: grid;
|
||||
|
||||
@@ -20,16 +20,17 @@ import {
|
||||
import type { ConnectionSnapshot, SortKey } from '@shared/connections.ts'
|
||||
import { formatBytes } from '@shared/format.ts'
|
||||
import { ApiError, api } from '../api'
|
||||
import { toast, toastError } from '../toast'
|
||||
import { kernel } from '../runtime'
|
||||
import ConfirmDialog from '../components/ConfirmDialog.vue'
|
||||
import IconClose from '~icons/ri/close-line'
|
||||
|
||||
const snapshot = ref<ConnectionSnapshot | null>(null)
|
||||
/** 断开动作的失败。只被下一次动作覆盖,轮询不碰它 */
|
||||
const failure = ref('')
|
||||
/** 轮询取数的失败。轮询自己成功时清掉 */
|
||||
/**
|
||||
* 轮询取数的失败,成功时自己清掉。这是持续状态所以留在页内;
|
||||
* 断开动作的失败是一次性事件,走右上角轻提示。
|
||||
*/
|
||||
const pollFailure = ref('')
|
||||
const shownFailure = computed(() => failure.value || pollFailure.value)
|
||||
/** 表格里的持续时间按这一刻算。跟着轮询节拍走,不单独开秒表 */
|
||||
const now = ref(Date.now())
|
||||
const query = ref('')
|
||||
@@ -94,12 +95,11 @@ const totalSize = computed(() => virtualizer.value.getTotalSize())
|
||||
async function closeOne(id: string) {
|
||||
if (closing.value.includes(id) || closingAll.value) return
|
||||
closing.value = [...closing.value, id]
|
||||
failure.value = ''
|
||||
try {
|
||||
await api.closeConnection(id)
|
||||
await refresh()
|
||||
} catch (error) {
|
||||
failure.value = error instanceof ApiError ? error.message : String(error)
|
||||
toastError(error)
|
||||
} finally {
|
||||
closing.value = closing.value.filter((item) => item !== id)
|
||||
}
|
||||
@@ -109,12 +109,12 @@ async function closeAllConfirmed() {
|
||||
askAll.value = false
|
||||
if (closingAll.value) return
|
||||
closingAll.value = true
|
||||
failure.value = ''
|
||||
try {
|
||||
await api.closeAllConnections()
|
||||
await refresh()
|
||||
toast('已断开所有连接')
|
||||
} catch (error) {
|
||||
failure.value = error instanceof ApiError ? error.message : String(error)
|
||||
toastError(error)
|
||||
} finally {
|
||||
closingAll.value = false
|
||||
}
|
||||
@@ -152,14 +152,9 @@ async function closeAllConfirmed() {
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-if="shownFailure" class="failure">
|
||||
<strong class="failure-text">{{ shownFailure }}</strong>
|
||||
<button
|
||||
type="button"
|
||||
class="failure-x"
|
||||
title="关闭提示"
|
||||
@click="((failure = ''), (pollFailure = ''))"
|
||||
>
|
||||
<div v-if="pollFailure" class="failure">
|
||||
<strong class="failure-text">{{ pollFailure }}</strong>
|
||||
<button type="button" class="failure-x" title="关闭提示" @click="pollFailure = ''">
|
||||
<IconClose />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
+16
-90
@@ -24,6 +24,7 @@ import {
|
||||
import type { OutboundSetup } from '@shared/inbound-groups.ts'
|
||||
import type { ConfigObject } from '../../vendor/config-editor/index.ts'
|
||||
import { ApiError, api } from '../api'
|
||||
import { toast, toastError } from '../toast'
|
||||
import type { ListenerFields } from '../api'
|
||||
import type { GroupView } from '../runtime'
|
||||
import { optimisticSelect, providerLines, reloadRuntime, runtime } from '../runtime'
|
||||
@@ -33,7 +34,6 @@ import InboundList from '../components/InboundList.vue'
|
||||
import InboundDetail from './InboundDetail.vue'
|
||||
import InboundForm from './InboundForm.vue'
|
||||
import IconAdd from '~icons/ri/add-line'
|
||||
import IconClose from '~icons/ri/close-line'
|
||||
|
||||
const props = defineProps<{
|
||||
data: ConfigObject
|
||||
@@ -56,20 +56,14 @@ const defaultSetup = (): OutboundSetup => ({
|
||||
|
||||
const selectedId = ref<string | null>(null)
|
||||
const saving = ref(false)
|
||||
const failure = ref<{ message: string; hint: string } | null>(null)
|
||||
/** 成功的结果,绿色 */
|
||||
const done = ref('')
|
||||
/** 中性的告知,比如某条线路测不通——那是关于线路的结论,不是操作失败 */
|
||||
const notice = ref('')
|
||||
const fields = ref<ListenerFields | null>(null)
|
||||
const formOpen = ref(false)
|
||||
const formEditing = ref<Inbound | null>(null)
|
||||
|
||||
const { testing, test } = useDelayTest(
|
||||
() => void reloadRuntime(),
|
||||
(message) => {
|
||||
notice.value = message
|
||||
},
|
||||
// 「某条线路测不通」是关于线路的结论,不是操作失败,走中性的轻提示
|
||||
(message) => toast(message, { kind: 'info' }),
|
||||
)
|
||||
|
||||
onMounted(async () => {
|
||||
@@ -130,25 +124,21 @@ const chainView = computed<GroupView | null>(() => {
|
||||
|
||||
const clone = () => JSON.parse(JSON.stringify(props.data)) as ConfigObject
|
||||
|
||||
/** 所有改配置文件的动作都从这里走。 */
|
||||
async function commit(raw: ConfigObject, success: string) {
|
||||
/** 所有改配置文件的动作都从这里走。反馈走右上角轻提示,返回值告知成败。 */
|
||||
async function commit(raw: ConfigObject, success: string): Promise<boolean> {
|
||||
// 先把生成的东西按当前规则重建一遍,再清掉没人再引用的。不清理的话,改几次文件里就
|
||||
// 攒下一堆用户从没主动建过的东西,而没人用的订阅副本还会按 interval 继续联网。
|
||||
const next = pruneGenerated(syncGenerated(raw, collectInbounds(raw)))
|
||||
saving.value = true
|
||||
failure.value = null
|
||||
done.value = ''
|
||||
notice.value = ''
|
||||
try {
|
||||
const result = await api.applyConfig(next, props.revision)
|
||||
// 没重载有两种情况(内容没有变化、内核不在线只写了文件),都要如实说,不能只报成功
|
||||
done.value = result.reloaded ? success : `${success}(${result.reloadMessage})`
|
||||
toast(result.reloaded ? success : `${success}(${result.reloadMessage})`)
|
||||
emit('saved')
|
||||
return true
|
||||
} catch (error) {
|
||||
failure.value =
|
||||
error instanceof ApiError
|
||||
? { message: error.message, hint: error.hint }
|
||||
: { message: String(error), hint: '' }
|
||||
toastError(error)
|
||||
return false
|
||||
} finally {
|
||||
saving.value = false
|
||||
}
|
||||
@@ -158,8 +148,8 @@ async function commit(raw: ConfigObject, success: string) {
|
||||
async function saveSetup(next: OutboundSetup, picks: { proxy: string | null; chain: string | null }) {
|
||||
const target = selected.value
|
||||
if (!target || saving.value) return
|
||||
await commit(applySetup(clone(), target.name, next), `${target.name} 的代理配置已保存`)
|
||||
if (failure.value) return
|
||||
const ok = await commit(applySetup(clone(), target.name, next), `${target.name} 的代理配置已保存`)
|
||||
if (!ok) return
|
||||
// 草稿态里预选的线路在保存成功、组按新配置就位之后逐个选上。这是运行时动作,
|
||||
// 失败不影响已保存的配置:组停在内核的默认选中上,刷新后显示的就是真实状态。
|
||||
const picked: Array<[string, string | null]> = [
|
||||
@@ -207,9 +197,9 @@ async function submitForm(entry: ConfigObject) {
|
||||
const name = String(entry.name)
|
||||
const withGroup = editingIndex === null ? applySetup(next, name, defaultSetup()) : next
|
||||
|
||||
await commit(withGroup, editingIndex === null ? `已新增 ${name}` : '已保存')
|
||||
const ok = await commit(withGroup, editingIndex === null ? `已新增 ${name}` : '已保存')
|
||||
// 失败时不能关对话框——关了再打开就是空表单,用户填的名称、端口、类型全没了
|
||||
if (failure.value) return
|
||||
if (!ok) return
|
||||
formOpen.value = false
|
||||
if (editingIndex === null) selectedId.value = `listener:${String(listeners.length - 1)}`
|
||||
}
|
||||
@@ -218,17 +208,14 @@ async function submitForm(entry: ConfigObject) {
|
||||
async function selectMember(group: string, member: string) {
|
||||
if (saving.value) return
|
||||
optimisticSelect(group, member)
|
||||
failure.value = null
|
||||
done.value = ''
|
||||
notice.value = ''
|
||||
try {
|
||||
await api.selectProxy(group, member)
|
||||
await reloadRuntime()
|
||||
} catch (error) {
|
||||
failure.value = {
|
||||
message: error instanceof ApiError ? error.message : String(error),
|
||||
toast(error instanceof ApiError ? error.message : String(error), {
|
||||
kind: 'error',
|
||||
hint: '该操作仅修改内核运行状态,配置文件未被修改。',
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@@ -282,18 +269,6 @@ async function removeConfirmed() {
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<div v-if="failure" class="failure">
|
||||
<div class="failure-text">
|
||||
<strong>{{ failure.message }}</strong>
|
||||
<span v-if="failure.hint">{{ failure.hint }}</span>
|
||||
</div>
|
||||
<button type="button" class="failure-x" title="关闭提示" @click="failure = null">
|
||||
<IconClose />
|
||||
</button>
|
||||
</div>
|
||||
<p v-else-if="done" class="done">{{ done }}</p>
|
||||
<p v-else-if="notice" class="notice">{{ notice }}</p>
|
||||
|
||||
<div class="split">
|
||||
<InboundList v-model:selected="selectedId" :inbounds="inbounds" />
|
||||
|
||||
@@ -389,55 +364,6 @@ async function removeConfirmed() {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.failure {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--s-3);
|
||||
border: 1px solid color-mix(in srgb, var(--c-danger) 35%, var(--c-border));
|
||||
border-radius: var(--r-md);
|
||||
background: var(--c-danger-soft);
|
||||
padding: var(--s-3) var(--s-4);
|
||||
margin-bottom: var(--s-4);
|
||||
font-size: var(--t-sm);
|
||||
}
|
||||
|
||||
.failure-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--s-1);
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.failure-x {
|
||||
flex: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: none;
|
||||
border-radius: var(--r-sm);
|
||||
background: none;
|
||||
color: var(--c-danger);
|
||||
cursor: pointer;
|
||||
}
|
||||
.failure-x:hover {
|
||||
background: color-mix(in srgb, var(--c-danger) 12%, transparent);
|
||||
}
|
||||
|
||||
.done {
|
||||
color: var(--c-ok);
|
||||
font-size: var(--t-sm);
|
||||
margin-bottom: var(--s-4);
|
||||
}
|
||||
|
||||
.notice {
|
||||
color: var(--c-text-soft);
|
||||
font-size: var(--t-sm);
|
||||
margin-bottom: var(--s-4);
|
||||
}
|
||||
|
||||
/* 左列表右详情。窄时改成上下,详情不再吸顶 */
|
||||
.split {
|
||||
display: grid;
|
||||
|
||||
+22
-82
@@ -26,6 +26,7 @@ import {
|
||||
import type { IniImportPlan, RuleIssue } from '@shared/rules.ts'
|
||||
import type { ConfigObject } from '../../vendor/config-editor/index.ts'
|
||||
import { ApiError, api } from '../api'
|
||||
import { toast, toastError } from '../toast'
|
||||
import type { RuleProviderInfo } from '../api'
|
||||
import { kernel } from '../runtime'
|
||||
import ConfirmDialog from '../components/ConfirmDialog.vue'
|
||||
@@ -39,7 +40,6 @@ import IconEdit from '~icons/ri/edit-line'
|
||||
import IconDelete from '~icons/ri/delete-bin-line'
|
||||
import IconRefresh from '~icons/ri/refresh-line'
|
||||
import IconLoad from '~icons/ri/loader-4-line'
|
||||
import IconClose from '~icons/ri/close-line'
|
||||
|
||||
const props = defineProps<{ data: ConfigObject; revision: string }>()
|
||||
|
||||
@@ -93,24 +93,19 @@ const issuesByIndex = computed(() => {
|
||||
const missingLan = computed(() => missingLanRules(rules.value))
|
||||
|
||||
const saving = ref(false)
|
||||
const failure = ref<{ message: string; hint: string } | null>(null)
|
||||
const done = ref('')
|
||||
|
||||
/** 所有改配置文件的动作都从这里走。 */
|
||||
async function commit(raw: ConfigObject, success: string) {
|
||||
/** 所有改配置文件的动作都从这里走。反馈走右上角轻提示,返回值告知成败。 */
|
||||
async function commit(raw: ConfigObject, success: string): Promise<boolean> {
|
||||
saving.value = true
|
||||
failure.value = null
|
||||
done.value = ''
|
||||
try {
|
||||
const result = await api.applyConfig(raw, props.revision)
|
||||
// 没重载有两种情况(内容没有变化、内核不在线只写了文件),都要如实说
|
||||
done.value = result.reloaded ? success : `${success}(${result.reloadMessage})`
|
||||
toast(result.reloaded ? success : `${success}(${result.reloadMessage})`)
|
||||
emit('saved')
|
||||
return true
|
||||
} catch (error) {
|
||||
failure.value =
|
||||
error instanceof ApiError
|
||||
? { message: error.message, hint: error.hint }
|
||||
: { message: String(error), hint: '' }
|
||||
toastError(error)
|
||||
return false
|
||||
} finally {
|
||||
saving.value = false
|
||||
}
|
||||
@@ -147,7 +142,7 @@ async function submitRule(ruleText: string) {
|
||||
editing === null
|
||||
? insertBeforeMatch([...seed, ...rules.value], [ruleText])
|
||||
: rules.value.map((rule, i) => (i === editing ? ruleText : rule))
|
||||
await commit(
|
||||
const ok = await commit(
|
||||
withRules(next),
|
||||
editing === null
|
||||
? seed.length > 0
|
||||
@@ -156,7 +151,7 @@ async function submitRule(ruleText: string) {
|
||||
: '已保存',
|
||||
)
|
||||
// 失败时不能关对话框——关了再打开就是空表单
|
||||
if (!failure.value) ruleFormOpen.value = false
|
||||
if (ok) ruleFormOpen.value = false
|
||||
}
|
||||
|
||||
async function move(index: number, delta: -1 | 1) {
|
||||
@@ -230,17 +225,17 @@ async function submitGroup(entry: {
|
||||
try {
|
||||
await api.uploadProviderFile(entry.declaration.path, entry.file.content)
|
||||
} catch (error) {
|
||||
failure.value = {
|
||||
message: error instanceof ApiError ? error.message : String(error),
|
||||
toast(error instanceof ApiError ? error.message : String(error), {
|
||||
kind: 'error',
|
||||
hint: '清单没有写入,配置文件也没有改动。',
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
}
|
||||
const next = clone()
|
||||
setRuleProviders(next, { ...ruleProvidersOf(next), [entry.name]: entry.declaration })
|
||||
await commit(next, `已新增规则组 ${entry.name}`)
|
||||
if (!failure.value) {
|
||||
const ok = await commit(next, `已新增规则组 ${entry.name}`)
|
||||
if (ok) {
|
||||
groupFormOpen.value = false
|
||||
void reloadProviderState()
|
||||
}
|
||||
@@ -251,11 +246,11 @@ async function submitImport(plan: IniImportPlan) {
|
||||
setRuleProviders(next, { ...ruleProvidersOf(next), ...plan.providers })
|
||||
setRules(next, [...insertBeforeMatch(rules.value, plan.rules), ...plan.finals])
|
||||
const added = plan.rules.length + plan.finals.length
|
||||
await commit(
|
||||
const ok = await commit(
|
||||
next,
|
||||
`已导入 ${Object.keys(plan.providers).length} 个规则组、${String(added)} 条规则`,
|
||||
)
|
||||
if (!failure.value) {
|
||||
if (ok) {
|
||||
importOpen.value = false
|
||||
void reloadProviderState()
|
||||
}
|
||||
@@ -293,8 +288,8 @@ async function removeProviderConfirmed() {
|
||||
const rest = ruleProvidersOf(next)
|
||||
delete rest[name]
|
||||
setRuleProviders(next, rest)
|
||||
await commit(next, `已删除规则组 ${name}`)
|
||||
if (!failure.value) void reloadProviderState()
|
||||
const ok = await commit(next, `已删除规则组 ${name}`)
|
||||
if (ok) void reloadProviderState()
|
||||
}
|
||||
|
||||
/** 正在等内核重新拉取的规则组名字。 */
|
||||
@@ -304,16 +299,15 @@ const updating = ref<string | null>(null)
|
||||
async function updateNow(name: string) {
|
||||
if (updating.value !== null || saving.value) return
|
||||
updating.value = name
|
||||
failure.value = null
|
||||
done.value = ''
|
||||
try {
|
||||
await api.updateRuleProvider(name)
|
||||
await reloadProviderState()
|
||||
toast(`已更新 ${name}`)
|
||||
} catch (error) {
|
||||
failure.value = {
|
||||
message: error instanceof ApiError ? error.message : String(error),
|
||||
toast(error instanceof ApiError ? error.message : String(error), {
|
||||
kind: 'error',
|
||||
hint: '该操作仅修改内核运行状态,配置文件未被修改。',
|
||||
}
|
||||
})
|
||||
} finally {
|
||||
updating.value = null
|
||||
}
|
||||
@@ -335,17 +329,6 @@ async function updateNow(name: string) {
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-if="failure" class="failure">
|
||||
<div class="failure-text">
|
||||
<strong>{{ failure.message }}</strong>
|
||||
<span v-if="failure.hint">{{ failure.hint }}</span>
|
||||
</div>
|
||||
<button type="button" class="failure-x" title="关闭提示" @click="failure = null">
|
||||
<IconClose />
|
||||
</button>
|
||||
</div>
|
||||
<p v-else-if="done" class="done">{{ done }}</p>
|
||||
|
||||
<section class="sec">
|
||||
<header class="sec-head">
|
||||
<h2>分流规则</h2>
|
||||
@@ -579,49 +562,6 @@ async function updateNow(name: string) {
|
||||
font-size: var(--t-sm);
|
||||
}
|
||||
|
||||
.failure {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: var(--s-3);
|
||||
border: 1px solid color-mix(in srgb, var(--c-danger) 35%, var(--c-border));
|
||||
border-radius: var(--r-md);
|
||||
background: var(--c-danger-soft);
|
||||
padding: var(--s-3) var(--s-4);
|
||||
margin-bottom: var(--s-4);
|
||||
font-size: var(--t-sm);
|
||||
}
|
||||
|
||||
.failure-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--s-1);
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.failure-x {
|
||||
flex: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: none;
|
||||
border-radius: var(--r-sm);
|
||||
background: none;
|
||||
color: var(--c-danger);
|
||||
cursor: pointer;
|
||||
}
|
||||
.failure-x:hover {
|
||||
background: color-mix(in srgb, var(--c-danger) 12%, transparent);
|
||||
}
|
||||
|
||||
.done {
|
||||
color: var(--c-ok);
|
||||
font-size: var(--t-sm);
|
||||
margin-bottom: var(--s-4);
|
||||
}
|
||||
|
||||
.sec + .sec {
|
||||
margin-top: var(--s-7);
|
||||
}
|
||||
|
||||
@@ -123,9 +123,12 @@ function geoMeta(g: GeoFileStatus): string {
|
||||
return `${formatBytes(g.size)} · ${formatAgo(new Date(g.updatedAt), new Date())}`
|
||||
}
|
||||
|
||||
/** GEO 更新是运行时动作,不写配置文件。内核只有全量更新的口子,四行共用一个忙态。 */
|
||||
/**
|
||||
* 更新全部:让内核自己更新(运行时动作,带内核的完整校验和热加载,
|
||||
* 但只更新配置实际用到的类型)。
|
||||
*/
|
||||
async function updateGeo() {
|
||||
if (geoBusy.value || !kernel.value.online) return
|
||||
if (geoBusy.value || geoSyncing.value !== null || !kernel.value.online) return
|
||||
geoBusy.value = true
|
||||
try {
|
||||
await api.updateGeo()
|
||||
@@ -138,6 +141,24 @@ async function updateGeo() {
|
||||
}
|
||||
}
|
||||
|
||||
/** 正在单独下载的那一行(configKey) */
|
||||
const geoSyncing = ref<string | null>(null)
|
||||
|
||||
/** 单独更新一个文件:服务端自己下载,内核重启后换用新文件。 */
|
||||
async function syncOne(g: GeoFileStatus) {
|
||||
if (geoBusy.value || geoSyncing.value !== null) return
|
||||
geoSyncing.value = g.configKey
|
||||
try {
|
||||
await api.syncGeoFile(g.configKey)
|
||||
toast(`${g.key} 已下载`, { hint: '内核还在用旧数据,重启内核后换用新文件。' })
|
||||
await loadGeo()
|
||||
} catch (error) {
|
||||
toastError(error)
|
||||
} finally {
|
||||
geoSyncing.value = null
|
||||
}
|
||||
}
|
||||
|
||||
/** 正在编辑下载地址的那一行(configKey),一次只开一行 */
|
||||
const geoEditing = ref<string | null>(null)
|
||||
const geoDraft = ref('')
|
||||
@@ -433,7 +454,18 @@ const backend = location.origin
|
||||
</section>
|
||||
|
||||
<section class="group">
|
||||
<h2 class="title">资源</h2>
|
||||
<div class="g-head">
|
||||
<h2 class="title">资源</h2>
|
||||
<button
|
||||
type="button"
|
||||
class="tbtn"
|
||||
:title="kernel.online ? '让内核更新它用到的全部 GEO 文件' : '内核未连接'"
|
||||
:disabled="geoBusy || geoSyncing !== null || !kernel.online"
|
||||
@click="updateGeo"
|
||||
>
|
||||
<IconSync :class="geoBusy && 'spin'" /> 更新全部
|
||||
</button>
|
||||
</div>
|
||||
<p v-if="geoFiles === null" class="faint">载入中</p>
|
||||
<p v-else-if="geoFiles.length === 0" class="faint">读不到 GEO 文件的状态。</p>
|
||||
<template v-else>
|
||||
@@ -455,11 +487,11 @@ const backend = location.origin
|
||||
<button
|
||||
type="button"
|
||||
class="ico"
|
||||
:title="kernel.online ? '更新(有变化的 GEO 文件会一并更新)' : '内核未连接'"
|
||||
:disabled="geoBusy || !kernel.online"
|
||||
@click="updateGeo"
|
||||
title="单独下载这一个文件(重启内核后生效)"
|
||||
:disabled="geoBusy || geoSyncing !== null"
|
||||
@click="syncOne(g)"
|
||||
>
|
||||
<IconSync :class="geoBusy && 'spin'" />
|
||||
<IconSync :class="geoSyncing === g.configKey && 'spin'" />
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
@@ -673,6 +705,42 @@ const backend = location.origin
|
||||
}
|
||||
|
||||
/* ── 资源 ────────────────────────────────────── */
|
||||
.g-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.g-head .title {
|
||||
margin-bottom: var(--s-3);
|
||||
}
|
||||
|
||||
/* 文字按钮:图标加一个词,不占按钮的份量 */
|
||||
.tbtn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: var(--s-2);
|
||||
padding: var(--s-1) var(--s-2);
|
||||
border: none;
|
||||
border-radius: var(--r-sm);
|
||||
background: none;
|
||||
color: var(--c-text-soft);
|
||||
font-size: var(--t-sm);
|
||||
cursor: pointer;
|
||||
}
|
||||
.tbtn:hover:not(:disabled) {
|
||||
background: var(--c-surface-sunken);
|
||||
color: var(--c-text);
|
||||
}
|
||||
.tbtn:disabled {
|
||||
color: var(--c-text-faint);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.tbtn svg {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.g-right {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
Reference in New Issue
Block a user