93 lines
2.6 KiB
Vue
93 lines
2.6 KiB
Vue
<script setup lang="ts">
|
||
import { onMounted, ref, watch } from 'vue';
|
||
import { NButton, NCard, NInput, NSpace, NTabPane, NTabs, useMessage } from 'naive-ui';
|
||
import { getAdminToken, setAdminToken } from '../api/client';
|
||
import { useSubscriptionsStore } from '../stores/subscriptions';
|
||
|
||
const store = useSubscriptionsStore();
|
||
const message = useMessage();
|
||
|
||
const sections = ref<Record<string, string>>({});
|
||
const adminToken = ref(getAdminToken());
|
||
const activeSection = ref('General');
|
||
|
||
onMounted(async () => {
|
||
await store.fetchAll();
|
||
});
|
||
|
||
watch(
|
||
() => store.settings,
|
||
(s) => {
|
||
if (!s) return;
|
||
sections.value = { ...s.surgeSections };
|
||
},
|
||
{ immediate: true }
|
||
);
|
||
|
||
async function saveSections() {
|
||
await store.saveSettings({ surgeSections: sections.value });
|
||
message.success('已保存');
|
||
}
|
||
|
||
function saveAdminToken() {
|
||
setAdminToken(adminToken.value.trim());
|
||
message.success(adminToken.value.trim() ? '已保存到本浏览器' : '已清除');
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<div>
|
||
<h1 class="display page-title">设置</h1>
|
||
|
||
<NCard title="管理鉴权" size="small" class="block">
|
||
<p class="hint">
|
||
服务端设置了 ADMIN_TOKEN 环境变量时，管理接口需要携带同样的 token。此处保存的值仅存在本浏览器 localStorage。
|
||
</p>
|
||
<NSpace>
|
||
<NInput v-model:value="adminToken" type="password" show-password-on="click" placeholder="ADMIN_TOKEN" class="mono" style="width: 320px" />
|
||
<NButton @click="saveAdminToken">保存</NButton>
|
||
</NSpace>
|
||
</NCard>
|
||
|
||
<NCard title="Surge 原文段落" size="small" class="block">
|
||
<p class="hint">
|
||
这些段落按原文透传进 Surge 配置（[General]、[MITM] 等），此处直接编辑文本。ShadowRocket／ClashMeta 不使用这些内容。
|
||
</p>
|
||
<NTabs v-model:value="activeSection" type="line" size="small">
|
||
<NTabPane v-for="(content, name) in sections" :key="name" :name="String(name)" :tab="String(name)">
|
||
<NInput
|
||
v-model:value="sections[String(name)]"
|
||
type="textarea"
|
||
:rows="16"
|
||
class="mono section-editor"
|
||
/>
|
||
</NTabPane>
|
||
</NTabs>
|
||
<NButton type="primary" style="margin-top: 12px" @click="saveSections">保存段落</NButton>
|
||
</NCard>
|
||
</div>
|
||
</template>
|
||
|
||
<style scoped>
|
||
.page-title {
|
||
font-size: 20px;
|
||
margin: 0 0 20px;
|
||
}
|
||
|
||
.block {
|
||
margin-bottom: 16px;
|
||
max-width: 860px;
|
||
}
|
||
|
||
.hint {
|
||
color: var(--muted);
|
||
font-size: 12px;
|
||
margin: 0 0 12px;
|
||
}
|
||
|
||
.section-editor :deep(textarea) {
|
||
font-family: var(--font-mono) !important;
|
||
font-size: 12px;
|
||
}
|
||
</style>
|