<script setup lang="ts">
|
import { $t } from '@vben/locales';
|
|
import NumberFieldItem from '../number-field-item.vue';
|
import SwitchItem from '../switch-item.vue';
|
|
defineProps<{ disabled: boolean }>();
|
|
const sidebarEnable = defineModel<boolean>('sidebarEnable');
|
const sidebarWidth = defineModel<number>('sidebarWidth');
|
const sidebarCollapsedShowTitle = defineModel<boolean>(
|
'sidebarCollapsedShowTitle',
|
);
|
const sidebarCollapsed = defineModel<boolean>('sidebarCollapsed');
|
</script>
|
|
<template>
|
<SwitchItem v-model="sidebarEnable" :disabled="disabled">
|
{{ $t('preferences.sidebar.visible') }}
|
</SwitchItem>
|
<SwitchItem v-model="sidebarCollapsed" :disabled="!sidebarEnable || disabled">
|
{{ $t('preferences.sidebar.collapsed') }}
|
</SwitchItem>
|
<SwitchItem
|
v-model="sidebarCollapsedShowTitle"
|
:disabled="!sidebarEnable || disabled || !sidebarCollapsed"
|
>
|
{{ $t('preferences.sidebar.collapsedShowTitle') }}
|
</SwitchItem>
|
<NumberFieldItem
|
v-model="sidebarWidth"
|
:disabled="!sidebarEnable || disabled"
|
:max="320"
|
:min="160"
|
:step="10"
|
>
|
{{ $t('preferences.sidebar.width') }}
|
</NumberFieldItem>
|
</template>
|