parent
7a27e8a0b9
commit
f6a628cf66
@ -0,0 +1,56 @@ |
||||
/** |
||||
* 多页签持久化混入 |
||||
* 初始化时读取本地存储中的数据 |
||||
* 页签变化时写入本地存储 |
||||
*/ |
||||
|
||||
import {getters as tagsViewGetters, mutations as tagsViewMutations} from "@/layout/store/tagsView" |
||||
import {debounce} from "@/util" |
||||
import {getTagsView, setTagsView} from "@/util/storage" |
||||
|
||||
export default { |
||||
computed: { |
||||
shouldPersistent() { |
||||
return tagsViewGetters.persistent |
||||
} |
||||
}, |
||||
|
||||
watch: { |
||||
shouldPersistent: { |
||||
immediate: true, |
||||
handler(v) { |
||||
//尝试清除之前的watch
|
||||
if (this.watchVisitedViewsCallback) { |
||||
this.watchVisitedViewsCallback() |
||||
this.watchVisitedViewsCallback = null |
||||
} |
||||
|
||||
//停用持久化时清空本地存储的页签数据
|
||||
if (!v) return setTagsView() |
||||
|
||||
//启用时先存储一次(仅在mounted后,否则此时页签数据不完整)
|
||||
this._isMounted && this.persistentTagsView(this.visitedViews) |
||||
|
||||
this.watchVisitedViewsCallback = this.$watch('visitedViews', this.persistentTagsView) |
||||
} |
||||
} |
||||
}, |
||||
|
||||
methods: { |
||||
persistentTagsView(v) { |
||||
//只提取部分属性
|
||||
setTagsView(v.map(({name, path, fullPath, meta}) => ({name, path, fullPath, meta}))) |
||||
} |
||||
}, |
||||
|
||||
beforeCreate() { |
||||
this.persistentTagsView = debounce(this.persistentTagsView) |
||||
}, |
||||
|
||||
mounted() { |
||||
if (!this.shouldPersistent) return |
||||
|
||||
const tags = getTagsView() |
||||
Array.isArray(tags) && tags.forEach(tagsViewMutations.addVisitedView) |
||||
} |
||||
} |
||||
@ -1,56 +1,117 @@ |
||||
import {storage} from "@/config" |
||||
import {isEmpty} from "@/util" |
||||
import {unzip, zip} from "@/util/secret" |
||||
|
||||
const sessionUserKey = 'GCC-SESS-USER' |
||||
const localPersonalSettingsKey = 'GCC-LOCAL-PERSONAL-SETTINGS' |
||||
const {keyPrefix, zip: defaultUseZip} = storage |
||||
|
||||
/** |
||||
* @desc 读取本地存储 |
||||
* @param key 键名,自动加上统一前缀 |
||||
* @param storage window.sessionStorage或window.localStorage |
||||
* @param useZip 是否启用了压缩 |
||||
* @returns {any|undefined} |
||||
*/ |
||||
export function get(key, storage = window.sessionStorage, useZip = defaultUseZip) { |
||||
let obj = storage.getItem(`${keyPrefix}${key}`) |
||||
if (isEmpty(obj)) return undefined |
||||
try { |
||||
obj = JSON.parse(useZip ? unzip(obj) : obj) |
||||
} |
||||
catch (e) { |
||||
console.error(`获取本地存储[${key}]失败`, e) |
||||
obj = undefined |
||||
} |
||||
return obj |
||||
} |
||||
|
||||
/** |
||||
* 写入本地存储 |
||||
* @param key 键名,自动加上统一前缀 |
||||
* @param obj 需要写入本地存储的js对象 |
||||
* @param storage window.sessionStorage或window.localStorage |
||||
* @param useZip 是否启用了压缩 |
||||
*/ |
||||
export function set(key, obj, storage = window.sessionStorage, useZip = defaultUseZip) { |
||||
const item = useZip ? zip(JSON.stringify(obj)) : JSON.stringify(obj) |
||||
storage.setItem(`${keyPrefix}${key}`, item) |
||||
} |
||||
|
||||
/** |
||||
* @desc 判断本地存储中是否存在指定键名 |
||||
* @param key 键名,自动加上统一前缀 |
||||
* @param storage window.sessionStorage或window.localStorage |
||||
* @returns {boolean} 存在则返回true |
||||
*/ |
||||
export function exist(key, storage = window.sessionStorage) { |
||||
return !isEmpty(storage.getItem(`${keyPrefix}${key}`)) |
||||
} |
||||
|
||||
/** |
||||
* @desc 根据指定键名,移除本地存储对应项 |
||||
* @param key 键名,自动加上统一前缀 |
||||
* @param storage window.sessionStorage或window.localStorage |
||||
*/ |
||||
export function remove(key, storage = window.sessionStorage) { |
||||
storage.removeItem(`${keyPrefix}${key}`) |
||||
} |
||||
|
||||
const sessionUserKey = 'SESS-USER' |
||||
const localPersonalSettingsKey = 'LOCAL-PERSONAL-SETTINGS' |
||||
const sessionTagsViewKey = 'SESS-TAGS-VIEW' |
||||
|
||||
export function isUserExist() { |
||||
return !isEmpty(sessionStorage.getItem(sessionUserKey)) |
||||
return exist(sessionUserKey) |
||||
} |
||||
|
||||
export function getUser() { |
||||
let obj = sessionStorage.getItem(sessionUserKey) |
||||
if (isEmpty(obj)) return {} |
||||
try { |
||||
obj = JSON.parse(unzip(obj)) |
||||
} |
||||
catch (e) { |
||||
console.error('用户数据异常!', e) |
||||
obj = {} |
||||
let user = get(sessionUserKey) |
||||
if (isEmpty(user)) { |
||||
user = {} |
||||
removeUser() |
||||
} |
||||
return obj |
||||
return user |
||||
} |
||||
|
||||
export function setUser(user) { |
||||
if (isEmpty(user)) return removeUser() |
||||
sessionStorage.setItem(sessionUserKey, zip(JSON.stringify(user))) |
||||
isEmpty(user) ? removeUser() : set(sessionUserKey, user) |
||||
} |
||||
|
||||
export function getLocalPersonalSettings() { |
||||
let obj = localStorage.getItem(localPersonalSettingsKey) |
||||
if (isEmpty(obj)) return {} |
||||
try { |
||||
obj = JSON.parse(obj) |
||||
} |
||||
catch (e) { |
||||
console.error('本地个性化设置数据解析失败!', e) |
||||
let settings = get(localPersonalSettingsKey, window.localStorage) |
||||
if (isEmpty(settings)) { |
||||
settings = {} |
||||
removeLocalPersonalSettings() |
||||
return {} |
||||
} |
||||
return obj |
||||
return settings |
||||
} |
||||
|
||||
export function setLocalPersonalSettings(settings) { |
||||
isEmpty(settings) ? |
||||
removeLocalPersonalSettings() : |
||||
localStorage.setItem(localPersonalSettingsKey, JSON.stringify(settings)) |
||||
isEmpty(settings) |
||||
? removeLocalPersonalSettings() |
||||
: set(localPersonalSettingsKey, settings, window.localStorage) |
||||
} |
||||
|
||||
export function getTagsView() { |
||||
let tagsView = get(sessionTagsViewKey) |
||||
if (isEmpty(tagsView)) { |
||||
tagsView = [] |
||||
removeTagsView() |
||||
} |
||||
return tagsView |
||||
} |
||||
|
||||
export function setTagsView(tagsView) { |
||||
isEmpty(tagsView) ? removeTagsView() : set(sessionTagsViewKey, tagsView) |
||||
} |
||||
|
||||
function removeUser() { |
||||
sessionStorage.removeItem(sessionUserKey) |
||||
remove(sessionUserKey) |
||||
} |
||||
|
||||
function removeLocalPersonalSettings() { |
||||
localStorage.removeItem(localPersonalSettingsKey) |
||||
remove(localPersonalSettingsKey, window.localStorage) |
||||
} |
||||
|
||||
function removeTagsView() { |
||||
remove(sessionTagsViewKey) |
||||
} |
||||
|
||||
Loading…
Reference in new issue