41 lines
1.8 KiB
Vue
41 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
import { Pencil, Trash2 } from "lucide-vue-next";
|
|
|
|
defineProps<{ ctx: any }>();
|
|
</script>
|
|
|
|
<template>
|
|
<section class="panel page-stack">
|
|
<div class="section-head">
|
|
<div>
|
|
<h2>客户端动态接口</h2>
|
|
<p class="muted">删除接口后会由服务端重新生成兼容媒体源 JSON 和更新 JSON。</p>
|
|
</div>
|
|
<span class="badge">{{ ctx.visibleEndpointCount }} 可见 / {{ ctx.healthyEndpointCount }} 健康</span>
|
|
</div>
|
|
<table>
|
|
<thead><tr><th>ID</th><th>分类</th><th>模式</th><th>健康</th><th>缓存</th><th>URL</th><th>操作</th></tr></thead>
|
|
<tbody>
|
|
<tr v-for="item in ctx.endpoints" :key="item.id || item.sourceId">
|
|
<td class="mono">{{ item.id || item.sourceId }}</td>
|
|
<td>{{ item.category || item.categoryId }}</td>
|
|
<td>{{ item.proxyMode }}</td>
|
|
<td>
|
|
<span :class="['badge', ctx.statusTone(ctx.endpointStatus(item))]">{{ ctx.labelStatus(ctx.endpointStatus(item)) }}</span>
|
|
<span v-if="ctx.endpointStatus(item) === 'redirected' || item.health?.meta?.redirected" class="badge warn">重定向接口</span>
|
|
</td>
|
|
<td>{{ item.cacheSeconds || 0 }}s</td>
|
|
<td class="hash">{{ item.resolvedUrl || item.urlTemplate || item.apiUrl }}</td>
|
|
<td>
|
|
<div class="button-row">
|
|
<button class="btn ghost compact" @click="ctx.copyEndpointToSource(item)"><Pencil :size="14" />编辑</button>
|
|
<button class="btn ghost compact danger" @click="ctx.deleteEndpoint(item)"><Trash2 :size="14" />删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr v-if="ctx.endpoints.length === 0"><td colspan="7">暂无客户端接口。</td></tr>
|
|
</tbody>
|
|
</table>
|
|
</section>
|
|
</template>
|