refactor(TabFunction): 整理设置项，整合一下
This commit is contained in:
@@ -2,14 +2,65 @@
|
||||
import { QuestionCircleOutlined } from '@ant-design/icons-vue'
|
||||
import type { SettingsData } from '@/types/settings'
|
||||
|
||||
const { settings, historyRetentionOptions, handleSettingChange } = defineProps<{
|
||||
const { settings, historyRetentionOptions, updateSourceOptions, voiceTypeOptions, handleSettingChange, checkUpdate } = defineProps<{
|
||||
settings: SettingsData
|
||||
historyRetentionOptions: { label: string; value: number }[]
|
||||
updateSourceOptions: { label: string; value: string }[]
|
||||
voiceTypeOptions: { label: string; value: string }[]
|
||||
handleSettingChange: (category: keyof SettingsData, key: string, value: any) => Promise<void>
|
||||
checkUpdate: () => Promise<void>
|
||||
}>()
|
||||
</script>
|
||||
<template>
|
||||
<div class="tab-content">
|
||||
<!-- 启动设置 - 移到最上方 -->
|
||||
<div class="form-section">
|
||||
<div class="section-header">
|
||||
<h3>启动配置</h3>
|
||||
</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">开机自启</span>
|
||||
<a-tooltip title="在系统启动时自动启动应用">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Start.IfSelfStart"
|
||||
@change="(checked: any) => handleSettingChange('Start', 'IfSelfStart', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">启动后直接最小化</span>
|
||||
<a-tooltip title="启动后直接最小化">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Start.IfMinimizeDirectly"
|
||||
@change="(checked: any) => handleSettingChange('Start', 'IfMinimizeDirectly', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
|
||||
<!-- 原有的功能设置 -->
|
||||
<div class="form-section">
|
||||
<div class="section-header">
|
||||
<h3>功能设置</h3>
|
||||
@@ -147,5 +198,147 @@ const { settings, historyRetentionOptions, handleSettingChange } = defineProps<{
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
|
||||
<!-- 更新设置 - 移到最下方 -->
|
||||
<div class="form-section">
|
||||
<div class="section-header">
|
||||
<h3>更新配置</h3>
|
||||
<a-button type="primary" @click="checkUpdate" size="small" class="section-update-button">
|
||||
<template #icon>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor">
|
||||
<path d="M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z" />
|
||||
</svg>
|
||||
</template>
|
||||
检查更新
|
||||
</a-button>
|
||||
</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">自动检查更新</span>
|
||||
<a-tooltip title="启动时自动检测软件更新">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Update.IfAutoUpdate"
|
||||
@change="(checked: any) => handleSettingChange('Update', 'IfAutoUpdate', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">更新源</span>
|
||||
<a-tooltip title="选择下载软件更新的来源">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Update.Source"
|
||||
@change="(value: any) => handleSettingChange('Update', 'Source', value)"
|
||||
:options="updateSourceOptions"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">网络代理地址</span>
|
||||
<a-tooltip title="使用网络代理软件时，若出现网络连接问题，请尝试设置代理地址，此设置全局生效">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
v-model:value="settings.Update.ProxyAddress"
|
||||
@blur="handleSettingChange('Update', 'ProxyAddress', settings.Update.ProxyAddress)"
|
||||
placeholder="请输入网络代理地址"
|
||||
size="large"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">Mirror酱 CDK</span>
|
||||
<a-tooltip>
|
||||
<template #title>
|
||||
<div>
|
||||
Mirror酱CDK是使用Mirror源进行高速下载的凭证，可前往
|
||||
<a href="https://mirrorchyan.com/zh/get-start?source=auto-mas-setting" target="_blank" class="tooltip-link" @click.stop>Mirror酱官网</a>
|
||||
获取
|
||||
</div>
|
||||
</template>
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-input-password
|
||||
v-model:value="settings.Update.MirrorChyanCDK"
|
||||
@blur="handleSettingChange('Update','MirrorChyanCDK', settings.Update.MirrorChyanCDK)"
|
||||
:disabled="settings.Update.Source !== 'MirrorChyan'"
|
||||
placeholder="使用Mirror源时请输入Mirror酱CDK"
|
||||
:visibilityToggle="true"
|
||||
size="large"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
|
||||
<!-- 语音设置 - 移到最下方 -->
|
||||
<div class="form-section">
|
||||
<div class="section-header">
|
||||
<h3>语音配置</h3>
|
||||
</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">启用语音提示</span>
|
||||
<a-tooltip title="开启后将在特定时刻播放语音提示">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Voice.Enabled"
|
||||
@change="(checked: any) => handleSettingChange('Voice', 'Enabled', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">语音类型</span>
|
||||
<a-tooltip title="选择语音提示的详细程度">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Voice.Type"
|
||||
@change="(value: any) => handleSettingChange('Voice', 'Type', value)"
|
||||
:options="voiceTypeOptions"
|
||||
:disabled="!settings.Voice.Enabled"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,58 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { QuestionCircleOutlined } from '@ant-design/icons-vue'
|
||||
import type { SettingsData } from '@/types/settings'
|
||||
|
||||
const { settings, handleSettingChange } = defineProps<{
|
||||
settings: SettingsData
|
||||
handleSettingChange: (category: keyof SettingsData, key: string, value: any) => Promise<void>
|
||||
}>()
|
||||
</script>
|
||||
<template>
|
||||
<div class="tab-content">
|
||||
<div class="form-section">
|
||||
<div class="section-header">
|
||||
<h3>启动配置</h3>
|
||||
</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">开机自启</span>
|
||||
<a-tooltip title="在系统启动时自动启动应用">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Start.IfSelfStart"
|
||||
@change="(checked: any) => handleSettingChange('Start', 'IfSelfStart', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">启动后直接最小化</span>
|
||||
<a-tooltip title="启动后直接最小化">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Start.IfMinimizeDirectly"
|
||||
@change="(checked: any) => handleSettingChange('Start', 'IfMinimizeDirectly', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,108 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { QuestionCircleOutlined } from '@ant-design/icons-vue'
|
||||
import type { SettingsData } from '@/types/settings'
|
||||
|
||||
const { settings, updateSourceOptions, handleSettingChange, checkUpdate } = defineProps<{
|
||||
settings: SettingsData
|
||||
updateSourceOptions: { label: string; value: string }[]
|
||||
handleSettingChange: (category: keyof SettingsData, key: string, value: any) => Promise<void>
|
||||
checkUpdate: () => Promise<void>
|
||||
}>()
|
||||
</script>
|
||||
<template>
|
||||
<div class="tab-content">
|
||||
<div class="form-section">
|
||||
<div class="section-header">
|
||||
<h3>更新配置</h3>
|
||||
<a-button type="primary" @click="checkUpdate" size="medium" class="section-update-button">
|
||||
<template #icon>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor">
|
||||
<path d="M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z" />
|
||||
</svg>
|
||||
</template>
|
||||
检查更新
|
||||
</a-button>
|
||||
</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">自动检查更新</span>
|
||||
<a-tooltip title="启动时自动检测软件更新">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Update.IfAutoUpdate"
|
||||
@change="(checked: any) => handleSettingChange('Update', 'IfAutoUpdate', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">更新源</span>
|
||||
<a-tooltip title="选择下载软件更新的来源">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Update.Source"
|
||||
@change="(value: any) => handleSettingChange('Update', 'Source', value)"
|
||||
:options="updateSourceOptions"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">网络代理地址</span>
|
||||
<a-tooltip title="使用网络代理软件时，若出现网络连接问题，请尝试设置代理地址，此设置全局生效">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
v-model:value="settings.Update.ProxyAddress"
|
||||
@blur="handleSettingChange('Update', 'ProxyAddress', settings.Update.ProxyAddress)"
|
||||
placeholder="请输入网络代理地址"
|
||||
size="large"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">Mirror酱 CDK</span>
|
||||
<a-tooltip>
|
||||
<template #title>
|
||||
<div>
|
||||
Mirror酱CDK是使用Mirror源进行高速下载的凭证，可前往
|
||||
<a href="https://mirrorchyan.com/zh/get-start?source=auto-mas-setting" target="_blank" class="tooltip-link" @click.stop>Mirror酱官网</a>
|
||||
获取
|
||||
</div>
|
||||
</template>
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-input
|
||||
v-model:value="settings.Update.MirrorChyanCDK"
|
||||
@blur="handleSettingChange('Update','MirrorChyanCDK', settings.Update.MirrorChyanCDK)"
|
||||
:disabled="settings.Update.Source !== 'MirrorChyan'"
|
||||
placeholder="使用Mirror源时请输入Mirror酱CDK"
|
||||
size="large"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,58 +0,0 @@
|
||||
<script setup lang="ts">
|
||||
import { QuestionCircleOutlined } from '@ant-design/icons-vue'
|
||||
import type { SettingsData } from '@/types/settings'
|
||||
|
||||
const { settings, voiceTypeOptions, handleSettingChange } = defineProps<{
|
||||
settings: SettingsData
|
||||
voiceTypeOptions: { label: string; value: string }[]
|
||||
handleSettingChange: (category: keyof SettingsData, key: string, value: any) => Promise<void>
|
||||
}>()
|
||||
</script>
|
||||
<template>
|
||||
<div class="tab-content">
|
||||
<div class="form-section">
|
||||
<div class="section-header">
|
||||
<h3>语音配置</h3>
|
||||
</div>
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">启用音效</span>
|
||||
<a-tooltip title="是否启用音效功能">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Voice.Enabled"
|
||||
@change="(checked: any) => handleSettingChange('Voice', 'Enabled', checked)"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
>
|
||||
<a-select-option :value="true">是</a-select-option>
|
||||
<a-select-option :value="false">否</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</a-col>
|
||||
<a-col :span="12">
|
||||
<div class="form-item-vertical">
|
||||
<div class="form-label-wrapper">
|
||||
<span class="form-label">音效模式</span>
|
||||
<a-tooltip title="选择音效的播报模式">
|
||||
<QuestionCircleOutlined class="help-icon" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
<a-select
|
||||
v-model:value="settings.Voice.Type"
|
||||
@change="(value: any) => handleSettingChange('Voice', 'Type', value)"
|
||||
:options="voiceTypeOptions"
|
||||
:disabled="!settings.Voice.Enabled"
|
||||
size="large"
|
||||
style="width:100%"
|
||||
/>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -16,9 +16,6 @@ import { mirrorManager } from '@/utils/mirrorManager'
|
||||
import TabBasic from './TabBasic.vue'
|
||||
import TabFunction from './TabFunction.vue'
|
||||
import TabNotify from './TabNotify.vue'
|
||||
import TabUpdate from './TabUpdate.vue'
|
||||
import TabStart from './TabStart.vue'
|
||||
import TabVoice from './TabVoice.vue'
|
||||
import TabAdvanced from './TabAdvanced.vue'
|
||||
import TabOthers from './TabOthers.vue'
|
||||
|
||||
@@ -278,7 +275,10 @@ onMounted(() => {
|
||||
<TabFunction
|
||||
:settings="settings"
|
||||
:history-retention-options="historyRetentionOptions"
|
||||
:update-source-options="updateSourceOptions"
|
||||
:voice-type-options="voiceTypeOptions"
|
||||
:handle-setting-change="handleSettingChange"
|
||||
:check-update="checkUpdate"
|
||||
/>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="notify" tab="通知设置">
|
||||
@@ -290,20 +290,6 @@ onMounted(() => {
|
||||
:testing-notify="testingNotify"
|
||||
/>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="update" tab="更新设置">
|
||||
<TabUpdate
|
||||
:settings="settings"
|
||||
:update-source-options="updateSourceOptions"
|
||||
:handle-setting-change="handleSettingChange"
|
||||
:check-update="checkUpdate"
|
||||
/>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="start" tab="启动设置">
|
||||
<TabStart :settings="settings" :handle-setting-change="handleSettingChange" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="voice" tab="语音设置">
|
||||
<TabVoice :settings="settings" :voice-type-options="voiceTypeOptions" :handle-setting-change="handleSettingChange" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="advanced" tab="高级设置">
|
||||
<TabAdvanced
|
||||
:go-to-logs="goToLogs"
|
||||
|
||||
Reference in New Issue
Block a user