nas/qb-web
1
0
Fork 0
mirror of https://github.com/CzBiX/qb-web.git synced 2026-05-05 00:02:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

Tweak settings UI

Browse Source
This commit is contained in:
CzBiX
2022-10-07 16:42:30 +08:00
parent 9c2d613084
commit f28cfa5c62
3 changed files with 77 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/dialogs/settingsDialog/DownloadSettings.vue
View File

@@ -46,6 +46,7 @@
>
<preference-row i18n-key="auto_tmm_enabled">
<v-select
dense
:items="torrentMode"
:value="preferences.auto_tmm_enabled ? torrentMode[0] : torrentMode[1]"
@change="changeSettings('auto_tmm_enabled', $event == torrentMode[0])"
@@ -53,6 +54,7 @@
</preference-row>
<preference-row i18n-key="torrent_changed_tmm_enabled">
<v-select
dense
:items="torrentAction"
:value="preferences.category_changed_tmm_enabled ? torrentAction[1] : torrentAction[0]"
@change="changeSettings('torrent_changed_tmm_enabled', $event == torrentAction[1])"
@@ -60,6 +62,7 @@
</preference-row>
<preference-row i18n-key="save_path_changed_tmm_enabled">
<v-select
dense
:items="torrentAction"
:value="preferences.category_changed_tmm_enabled ? torrentAction[1] : torrentAction[0]"
@change="changeSettings('save_path_changed_tmm_enabled', $event == torrentAction[1])"
@@ -67,6 +70,7 @@
</preference-row>
<preference-row i18n-key="category_changed_tmm_enabled">
<v-select
dense
:items="torrentAction"
:value="preferences.category_changed_tmm_enabled ? torrentAction[1] : torrentAction[0]"
@change="changeSettings('category_changed_tmm_enabled', $event == torrentAction[1])"
@@ -74,6 +78,7 @@
</preference-row>
<preference-row i18n-key="save_path">
<v-text-field
dense
:value="preferences.save_path"
@change="changeSettings('save_path', $event)"
lazy
@@ -82,6 +87,7 @@
<preference-row i18n-key="temp_path">
<template v-slot:header>
<v-checkbox
dense
:value="preferences.temp_path_enabled"
@change="changeSettings('temp_path_enabled', $event)"
/>
@@ -91,6 +97,7 @@
:value="preferences.temp_path"
@change="changeSettings('temp_path', $event)"
lazy
dense
/>
</preference-row>
<preference-row

19
src/components/dialogs/settingsDialog/PreferenceRow.vue
View File

@@ -3,18 +3,19 @@
align="center"
dense
>
<v-col cols="3">
<v-subheader v-text="$t('preferences.' + this.$props.i18nKey)" />
</v-col>
<v-col cols="4">
<slot />
</v-col>
<v-col
cols="auto"
v-if="$slots.header"
class="header"
>
<slot name="header" />
</v-col>
<v-col>
<span v-text="$t('preferences.' + this.$props.i18nKey)" />
</v-col>
<v-col>
<slot />
</v-col>
</v-row>
</template>
@@ -28,3 +29,9 @@ export default class PreferenceRow extends Vue {
readonly i18nKey?: string
}
</script>
<style lang="scss" scoped>
.header {
height: 48px;
}
</style>

113
src/components/dialogs/settingsDialog/SettingsDialog.vue
View File

@@ -1,61 +1,59 @@
<template>
<div>
<v-dialog
:value="value"
@input="$emit('input', $event)"
scrollable
persistent
max-width="720px"
>
<v-card>
<v-card-title class="headline">
<v-icon class="mr-2">mdi-cog</v-icon>
<span v-text="$t('settings')" />
<v-spacer />
<v-btn
icon
@click="closeDialog"
<v-dialog
:value="value"
@input="$emit('input', $event)"
scrollable
persistent
max-width="720px"
>
<v-card>
<v-card-title class="headline">
<v-icon class="mr-2">mdi-cog</v-icon>
<span v-text="$t('settings')" />
<v-spacer />
<v-btn
icon
@click="closeDialog"
>
<v-icon>mdi-close</v-icon>
</v-btn>
</v-card-title>
<v-card-text>
<v-tabs v-model="tab">
<v-tab
v-for="item of tabList"
:key="item"
>
<v-icon>mdi-close</v-icon>
</v-btn>
</v-card-title>
<v-card-text>
<v-tabs v-model="tab">
<v-tab
v-for="item of tabList"
:key="item"
>
{{ $t('preferences.' + item) }}
</v-tab>
</v-tabs>
<v-fade-transition>
<v-alert
dense
text
type="success"
v-show="preferenceUpdated"
>
{{ $t('preferences.change_applied') }}
</v-alert>
</v-fade-transition>
<v-tabs-items v-model="tab">
<v-tab-item key="downloads">
<download-settings />
</v-tab-item>
<v-tab-item key="speed">
<speed-settings />
</v-tab-item>
<v-tab-item key="rss">
<rss-settings />
</v-tab-item>
<v-tab-item key="webui">
<web-u-i-settings />
</v-tab-item>
</v-tabs-items>
</v-card-text>
</v-card>
</v-dialog>
</div>
{{ $t('preferences.' + item) }}
</v-tab>
</v-tabs>
<v-fade-transition>
<v-alert
dense
text
type="success"
v-show="preferenceUpdated"
>
{{ $t('preferences.change_applied') }}
</v-alert>
</v-fade-transition>
<v-tabs-items v-model="tab">
<v-tab-item key="downloads">
<download-settings />
</v-tab-item>
<v-tab-item key="speed">
<speed-settings />
</v-tab-item>
<v-tab-item key="rss">
<rss-settings />
</v-tab-item>
<v-tab-item key="webui">
<web-u-i-settings />
</v-tab-item>
</v-tabs-items>
</v-card-text>
</v-card>
</v-dialog>
</template>
<script lang="ts">
@@ -114,4 +112,7 @@ export default class SettingsDialog extends Vue {
@import "~@/assets/styles.scss";
@include dialog-title;
::v-deep .v-card__text {
}
</style>