refactor(project): simplified part of the package, code optimization
This commit is contained in:
@@ -37,7 +37,6 @@
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@vben-core/colorful": "workspace:*",
|
||||
"@vben-core/helpers": "workspace:*",
|
||||
"@vben-core/iconify": "workspace:*",
|
||||
"@vben-core/layout-ui": "workspace:*",
|
||||
@@ -48,12 +47,9 @@
|
||||
"@vben-core/stores": "workspace:*",
|
||||
"@vben-core/tabs-ui": "workspace:*",
|
||||
"@vben-core/toolkit": "workspace:*",
|
||||
"@vben-core/typings": "workspace:*",
|
||||
"@vueuse/core": "^10.11.0",
|
||||
"vue": "^3.4.31",
|
||||
"vue-router": "^4.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vben-core/typings": "workspace:*",
|
||||
"@vben/types": "workspace:*"
|
||||
}
|
||||
}
|
||||
|
@@ -126,6 +126,19 @@ function useTabs() {
|
||||
disabled || !isCurrentTab || tabs.length - affixTabs.length <= 1;
|
||||
|
||||
const menus: IContextMenuItem[] = [
|
||||
{
|
||||
handler: async () => {
|
||||
if (!contentIsMaximize.value) {
|
||||
await router.push(tab.fullPath);
|
||||
}
|
||||
updateContentScreen(!contentIsMaximize.value);
|
||||
},
|
||||
icon: contentIsMaximize.value ? IcRoundFitScreen : IcTwotoneFitScreen,
|
||||
key: contentIsMaximize.value ? 'restore-maximize' : 'maximize',
|
||||
text: contentIsMaximize.value
|
||||
? $t('preferences.tabbar.contextMenu.restoreMaximize')
|
||||
: $t('preferences.tabbar.contextMenu.maximize'),
|
||||
},
|
||||
{
|
||||
disabled: !isCurrentTab,
|
||||
handler: async () => {
|
||||
@@ -166,22 +179,10 @@ function useTabs() {
|
||||
},
|
||||
icon: IcRoundTableView,
|
||||
key: 'open-in-new-window',
|
||||
separator: true,
|
||||
text: $t('preferences.tabbar.contextMenu.openInNewWindow'),
|
||||
},
|
||||
{
|
||||
handler: async () => {
|
||||
if (!contentIsMaximize.value) {
|
||||
await router.push(tab.fullPath);
|
||||
}
|
||||
updateContentScreen(!contentIsMaximize.value);
|
||||
},
|
||||
icon: contentIsMaximize.value ? IcRoundFitScreen : IcTwotoneFitScreen,
|
||||
key: contentIsMaximize.value ? 'restore-maximize' : 'maximize',
|
||||
separator: true,
|
||||
text: contentIsMaximize.value
|
||||
? $t('preferences.tabbar.contextMenu.restoreMaximize')
|
||||
: $t('preferences.tabbar.contextMenu.maximize'),
|
||||
},
|
||||
|
||||
{
|
||||
disabled: closeLeftDisabled,
|
||||
handler: async () => {
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import type { BreadcrumbStyleType } from '@vben-core/preferences';
|
||||
import type { IBreadcrumb } from '@vben-core/shadcn-ui';
|
||||
import type { BreadcrumbStyleType } from '@vben-core/typings';
|
||||
|
||||
import { computed } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { BuiltinThemeType } from '@vben/types';
|
||||
import type { BuiltinThemeType } from '@vben-core/typings';
|
||||
|
||||
import { IcRoundColorLens } from '@vben-core/iconify';
|
||||
import {
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { MenuRecordRaw } from '@vben/types';
|
||||
import type { MenuRecordRaw } from '@vben-core/typings';
|
||||
|
||||
import { onMounted, onUnmounted, ref, watch } from 'vue';
|
||||
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { MenuRecordRaw } from '@vben/types';
|
||||
import type { MenuRecordRaw } from '@vben-core/typings';
|
||||
|
||||
import { nextTick, onMounted, ref, shallowRef, watch } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SupportedLanguagesType } from '@vben/types';
|
||||
import type { SupportedLanguagesType } from '@vben-core/typings';
|
||||
|
||||
import { IcBaselineLanguage } from '@vben-core/iconify';
|
||||
import { loadLocaleMessages } from '@vben-core/locales';
|
||||
|
@@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import type { AuthPageLayoutType } from '@vben-core/preferences';
|
||||
import type { VbenDropdownMenuItem } from '@vben-core/shadcn-ui';
|
||||
import type { AuthPageLayoutType } from '@vben-core/typings';
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { $t } from '@vben-core/locales';
|
||||
import { SUPPORT_LANGUAGES } from '@vben-core/preferences';
|
||||
@@ -14,7 +14,7 @@ defineOptions({
|
||||
const appLocale = defineModel<string>('appLocale');
|
||||
const appDynamicTitle = defineModel<boolean>('appDynamicTitle');
|
||||
|
||||
const localeItems: SelectListItem[] = SUPPORT_LANGUAGES.map((item) => ({
|
||||
const localeItems: SelectOption[] = SUPPORT_LANGUAGES.map((item) => ({
|
||||
label: item.text,
|
||||
value: item.key,
|
||||
}));
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { useSlots } from 'vue';
|
||||
|
||||
@@ -13,7 +13,7 @@ defineOptions({
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
disabled?: boolean;
|
||||
items?: SelectListItem[];
|
||||
items?: SelectOption[];
|
||||
placeholder?: string;
|
||||
}>(),
|
||||
{
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
@@ -20,7 +20,7 @@ const breadcrumbStyleType = defineModel<string>('breadcrumbStyleType');
|
||||
const breadcrumbShowHome = defineModel<boolean>('breadcrumbShowHome');
|
||||
const breadcrumbHideOnlyOne = defineModel<boolean>('breadcrumbHideOnlyOne');
|
||||
|
||||
const typeItems: SelectListItem[] = [
|
||||
const typeItems: SelectOption[] = [
|
||||
{ label: $t('preferences.normal'), value: 'normal' },
|
||||
{ label: $t('preferences.breadcrumb.background'), value: 'background' },
|
||||
];
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { LayoutHeaderModeType, SelectListItem } from '@vben/types';
|
||||
import type { LayoutHeaderModeType, SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { $t } from '@vben-core/locales';
|
||||
|
||||
@@ -15,7 +15,7 @@ defineProps<{ disabled: boolean }>();
|
||||
const headerEnable = defineModel<boolean>('headerEnable');
|
||||
const headerMode = defineModel<LayoutHeaderModeType>('headerMode');
|
||||
|
||||
const localeItems: SelectListItem[] = [
|
||||
const localeItems: SelectOption[] = [
|
||||
{
|
||||
label: $t('preferences.header.modeStatic'),
|
||||
value: 'static',
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { LayoutType } from '@vben/types';
|
||||
import type { LayoutType } from '@vben-core/typings';
|
||||
|
||||
import { type Component, computed } from 'vue';
|
||||
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { $t } from '@vben-core/locales';
|
||||
|
||||
@@ -16,7 +16,7 @@ const navigationStyleType = defineModel<string>('navigationStyleType');
|
||||
const navigationSplit = defineModel<boolean>('navigationSplit');
|
||||
const navigationAccordion = defineModel<boolean>('navigationAccordion');
|
||||
|
||||
const stylesItems: SelectListItem[] = [
|
||||
const stylesItems: SelectOption[] = [
|
||||
{ label: $t('preferences.rounded'), value: 'rounded' },
|
||||
{ label: $t('preferences.plain'), value: 'plain' },
|
||||
];
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { useSlots } from 'vue';
|
||||
|
||||
@@ -20,7 +20,7 @@ defineOptions({
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
disabled?: boolean;
|
||||
items?: SelectListItem[];
|
||||
items?: SelectOption[];
|
||||
placeholder?: string;
|
||||
}>(),
|
||||
{
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { useSlots } from 'vue';
|
||||
|
||||
@@ -20,7 +20,7 @@ defineOptions({
|
||||
withDefaults(
|
||||
defineProps<{
|
||||
disabled?: boolean;
|
||||
items?: SelectListItem[];
|
||||
items?: SelectOption[];
|
||||
placeholder?: string;
|
||||
}>(),
|
||||
{
|
||||
|
@@ -1,15 +1,15 @@
|
||||
<script setup lang="ts">
|
||||
import type { BuiltinThemeType } from '@vben/types';
|
||||
import type { BuiltinThemeType } from '@vben-core/typings';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
import { TinyColor, convertToHsl } from '@vben-core/colorful';
|
||||
import { MdiEditBoxOutline } from '@vben-core/iconify';
|
||||
import { $t } from '@vben-core/locales';
|
||||
import {
|
||||
BUILT_IN_THEME_PRESETS,
|
||||
type BuiltinThemePreset,
|
||||
} from '@vben-core/preferences';
|
||||
import { TinyColor, convertToHsl } from '@vben-core/toolkit';
|
||||
|
||||
defineOptions({
|
||||
name: 'PreferenceBuiltinTheme',
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { ThemeModeType } from '@vben-core/preferences';
|
||||
import type { ThemeModeType } from '@vben-core/typings';
|
||||
|
||||
import type { Component } from 'vue';
|
||||
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectListItem } from '@vben/types';
|
||||
import type { SelectOption } from '@vben-core/typings';
|
||||
|
||||
import { ToggleGroup, ToggleGroupItem } from '@vben-core/shadcn-ui';
|
||||
|
||||
@@ -7,7 +7,7 @@ defineOptions({
|
||||
name: 'PreferenceToggleItem',
|
||||
});
|
||||
|
||||
withDefaults(defineProps<{ disabled?: boolean; items: SelectListItem[] }>(), {
|
||||
withDefaults(defineProps<{ disabled?: boolean; items: SelectOption[] }>(), {
|
||||
disabled: false,
|
||||
items: () => [],
|
||||
});
|
||||
|
@@ -1,17 +1,15 @@
|
||||
<script setup lang="ts">
|
||||
import type { SegmentedItem } from '@vben-core/shadcn-ui';
|
||||
import type {
|
||||
BreadcrumbStyleType,
|
||||
BuiltinThemeType,
|
||||
ContentCompactType,
|
||||
LayoutHeaderModeType,
|
||||
LayoutType,
|
||||
NavigationStyleType,
|
||||
SupportedLanguagesType,
|
||||
ThemeModeType,
|
||||
} from '@vben/types';
|
||||
import type {
|
||||
BreadcrumbStyleType,
|
||||
NavigationStyleType,
|
||||
} from '@vben-core/preferences';
|
||||
import type { SegmentedItem } from '@vben-core/shadcn-ui';
|
||||
} from '@vben-core/typings';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
|
||||
|
@@ -1,6 +1,7 @@
|
||||
<script lang="ts" setup>
|
||||
import { computed } from 'vue';
|
||||
|
||||
import { loadLocaleMessages } from '@vben-core/locales';
|
||||
import { preferences, updatePreferences } from '@vben-core/preferences';
|
||||
import { capitalizeFirstLetter } from '@vben-core/toolkit';
|
||||
|
||||
@@ -29,8 +30,14 @@ const listen = computed(() => {
|
||||
for (const [key, value] of Object.entries(preferences)) {
|
||||
if (typeof value === 'object') {
|
||||
for (const subKey of Object.keys(value)) {
|
||||
result[`update:${key}${capitalizeFirstLetter(subKey)}`] = (val: any) =>
|
||||
result[`update:${key}${capitalizeFirstLetter(subKey)}`] = (
|
||||
val: any,
|
||||
) => {
|
||||
updatePreferences({ [key]: { [subKey]: val } });
|
||||
if (key === 'app' && subKey === 'locale') {
|
||||
loadLocaleMessages(val);
|
||||
}
|
||||
};
|
||||
}
|
||||
} else {
|
||||
result[key] = value;
|
||||
|
@@ -1,4 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import type { ThemeModeType } from '@vben-core/typings';
|
||||
|
||||
import {
|
||||
IcRoundMotionPhotosAuto,
|
||||
IcRoundWbSunny,
|
||||
@@ -6,7 +8,6 @@ import {
|
||||
} from '@vben-core/iconify';
|
||||
import { $t } from '@vben-core/locales';
|
||||
import {
|
||||
type ThemeModeType,
|
||||
preferences,
|
||||
updatePreferences,
|
||||
usePreferences,
|
||||
|
@@ -1,5 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import type { AnyFunction } from '@vben/types';
|
||||
import type { AnyFunction } from '@vben-core/typings';
|
||||
|
||||
import type { Component } from 'vue';
|
||||
import { computed, ref } from 'vue';
|
||||
|
Reference in New Issue
Block a user