diff --git a/src/assets/js/local-storage.js b/src/assets/js/local-storage.js new file mode 100644 index 0000000..71cf170 --- /dev/null +++ b/src/assets/js/local-storage.js @@ -0,0 +1,28 @@ +// 本地储存 + +import { useLocalStorage } from '@vueuse/core'; + +/** 本地储存 key 前缀 */ +const PREFIX = 'frost-navigation/'; + +/** NavView 模块 */ +export const storeNavView = { + + /** 导航链接侧边栏折叠状态 */ + isAsideCollapsed: useLocalStorage(PREFIX + 'nav-view/is-aside-collapsed', false), + + /** 导航链接当前选中分类 */ + currentCategory: useLocalStorage(PREFIX + 'nav-view/current-category', ''), + + /** 导航链接搜索类型 */ + searchType: useLocalStorage(PREFIX + 'nav-view/search-type', 'all'), + +}; + +/** SearchView 模块 */ +export const storeSearchView = { + + /** 当前使用的搜索引擎名称 */ + searchEngineName: useLocalStorage(PREFIX + 'search-view/search-engine-name', '必应'), + +}; diff --git a/src/assets/js/search-engine.js b/src/assets/js/search-engine.js index 694d4a1..11ae22f 100644 --- a/src/assets/js/search-engine.js +++ b/src/assets/js/search-engine.js @@ -5,12 +5,8 @@ import { } from 'vue'; import { - SKEY_SEARCH_ENGINE_NAME, -} from '@/config/storage'; - -import { - useLocalStorage, -} from '@vueuse/core'; + storeSearchView, +} from './local-storage'; import { $message, @@ -37,7 +33,7 @@ import icon_zhihu from '@/assets/website-icon/zhihu.svg'; /** 打开搜索结果页面 */ export function openSearchResult() { - let engine = searchEngineName.value; + let engine = storeSearchView.searchEngineName.value; let keyword = searchKeyword.value; let baseURL = ''; let useURL = ''; @@ -221,8 +217,5 @@ export const searchEngineList = [ }, ]; -/** 搜索引擎名称 */ -export const searchEngineName = useLocalStorage(SKEY_SEARCH_ENGINE_NAME, '必应'); - /** 搜索关键词 */ export const searchKeyword = ref(''); diff --git a/src/config/storage.js b/src/config/storage.js deleted file mode 100644 index e325177..0000000 --- a/src/config/storage.js +++ /dev/null @@ -1,16 +0,0 @@ -// 本地储存 key 信息 - -/** 储存 key 前缀 */ -const PREFIX = 'frost-navigation/'; - -/** 导航链接侧边栏折叠状态 */ -export const SKEY_NAV_LINK_ASIDE_COLLAPSED = PREFIX + 'nav-link-aside-collapsed'; - -/** 导航链接当前选中分类 */ -export const SKEY_NAV_LINK_CATEGORY = PREFIX + 'nav-link-category'; - -/** 导航链接搜索类型 */ -export const SKEY_NAV_LINK_SEARCH_TYPE = PREFIX + 'nav-link-search-type'; - -/** 当前使用的搜索引擎名称 */ -export const SKEY_SEARCH_ENGINE_NAME = PREFIX + 'search-engine-name'; diff --git a/src/views/NavView/NavView.vue b/src/views/NavView/NavView.vue index 6d29327..c9b4877 100644 --- a/src/views/NavView/NavView.vue +++ b/src/views/NavView/NavView.vue @@ -27,18 +27,18 @@ collapse-mode="width" show-trigger="arrow-circle" :bordered="true" - :collapsed="isCollapsed" + :collapsed="storeNavView.isAsideCollapsed.value" :collapsed-width="64" :native-scrollbar="false" :scrollbar-props="{ trigger: 'hover' }" :width="240" - @collapse="isCollapsed = true" - @expand="isCollapsed = false" + @collapse="storeNavView.isAsideCollapsed.value = true" + @expand="storeNavView.isAsideCollapsed.value = false" > @@ -144,10 +144,8 @@ import { } from '@/config/modules'; import { - SKEY_NAV_LINK_ASIDE_COLLAPSED, - SKEY_NAV_LINK_CATEGORY, - SKEY_NAV_LINK_SEARCH_TYPE, -} from '@/config/storage'; + storeNavView, +} from '@/assets/js/local-storage'; import { $dialog, $message, @@ -172,12 +170,6 @@ const detailDrawer = reactive({ }); -/** 分类列表是否折叠 */ -const isCollapsed = useLocalStorage( - SKEY_NAV_LINK_ASIDE_COLLAPSED, - false -); - /** 完整的链接列表 */ const navLinksAll = formatNavLinks(true); @@ -206,12 +198,6 @@ const navLinksTitle = shallowRef(''); /** 搜索关键词 */ const searchKeyword = shallowRef(''); -/** 搜索类型 */ -const searchType = useLocalStorage( - SKEY_NAV_LINK_SEARCH_TYPE, - 'all' -); - /** * @desc 搜索类型列表 * @type { import('naive-ui').SelectOption[] } @@ -235,7 +221,7 @@ function changeList(data = null) { if (data) { useData = data; } else { - storedKey = localStorage.getItem(SKEY_NAV_LINK_CATEGORY) + storedKey = storeNavView.currentCategory.value; } if (storedKey) { @@ -249,17 +235,15 @@ function changeList(data = null) { } if (useData) { - localStorage.setItem(SKEY_NAV_LINK_CATEGORY, useData.title); + storeNavView.currentCategory.value = useData.title; navLinksCurr.value = useData.children; navLinksTitle.value = useData.title; } else { - localStorage.setItem(SKEY_NAV_LINK_CATEGORY, ''); + storeNavView.currentCategory.value = ''; navLinksCurr.value = []; navLinksTitle.value = ''; } - - } /** @@ -344,7 +328,7 @@ function treeDataFilter(pattern = '', node = null) { pattern = pattern.toLowerCase(); } - let type = searchType.value; + let type = storeNavView.searchType.value; let desc = String(node.desc).toLowerCase(); let title = String(node.title).toLowerCase(); diff --git a/src/views/SearchView/SearchView.vue b/src/views/SearchView/SearchView.vue index 5f84649..8a72660 100644 --- a/src/views/SearchView/SearchView.vue +++ b/src/views/SearchView/SearchView.vue @@ -27,7 +27,7 @@
@@ -68,9 +68,14 @@ import { NInput, NRadio, NRadioGroup, } from 'naive-ui'; +import { + storeSearchView, +} from '@/assets/js/local-storage'; + import { openSearchResult, - searchEngineList, searchEngineName, searchKeyword, + searchEngineList, + searchKeyword, } from '@/assets/js/search-engine'; import {