From f195c4d2808af498b9917f0cf690d213cfea5751 Mon Sep 17 00:00:00 2001 From: RainSun Date: Sun, 15 Mar 2020 11:27:56 +0800 Subject: [PATCH] add home state --- src/store/index.js | 13 +++++++++++ src/utils/language.js | 16 ++++++++++++++ src/views/Home/Home.vue | 48 ++++++++++++++++++++++++++++++++++++++--- 3 files changed, 74 insertions(+), 3 deletions(-) diff --git a/src/store/index.js b/src/store/index.js index 7237d29..3c07444 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -13,6 +13,8 @@ export default new Vuex.Store({ row_pwd: '', // 配置信息 settings: '', + // 主页状态 + home_state: '', }, mutations: { // 设置用户信息 @@ -31,6 +33,10 @@ export default new Vuex.Store({ SET_SETTINGS(state, settings) { state.settings = settings; }, + // 设置主页状态 + SET_HOMESTATE(state, home_state) { + state.home_state = home_state + }, }, actions: { // 设置用户信息 @@ -61,6 +67,13 @@ export default new Vuex.Store({ commit('SET_SETTINGS', arg[0]); localStorage.setItem("storeState", JSON.stringify(arg[1].$store.state)); }, + // 设置主页状态 + setHomeState({ + commit + }, arg) { + commit('SET_HOMESTATE', arg[0]); + localStorage.setItem("storeState", JSON.stringify(arg[1].$store.state)); + }, }, modules: {} }) diff --git a/src/utils/language.js b/src/utils/language.js index 82f5456..6ad4c63 100644 --- a/src/utils/language.js +++ b/src/utils/language.js @@ -294,6 +294,14 @@ export function lang() { CHS:{ title: '更新日志', timeline: [ + { + label: '切换页面之后保存主页状态', + tag:'bug修复', + content: [ + '正常情况下不保存主页状态进行页面跳转的时候会导致每次回到主页都是默认回顶的状态,已修复', + '2020-03-15' + ] + }, { label: '设置中的重置功能优化', tag:'功能更新', @@ -403,6 +411,14 @@ export function lang() { EN:{ title: 'Update Log', timeline: [ + { + label: 'Save homepage status after switching pages', + tag:'Bug fix', + content: [ + 'Normally, when you do n’t save the homepage state, the page jump will result in the default backing state every time you return to the homepage.', + '2020-03-15' + ] + }, { label: 'Optimization of reset function in settings', tag:'Feature update', diff --git a/src/views/Home/Home.vue b/src/views/Home/Home.vue index 97d0f47..779cd4b 100644 --- a/src/views/Home/Home.vue +++ b/src/views/Home/Home.vue @@ -135,14 +135,16 @@ export default { lang: '', // vcnsole模块 lastClickTime: 0, - count: 0 + count: 0, + // 滚动记录 + scrollHeight: 0, }; }, computed: { - ...mapState(['user_infos', 'row_data', 'row_pwd', 'settings']) + ...mapState(['user_infos', 'row_data', 'row_pwd', 'settings', 'home_state']) }, methods: { - ...mapActions(['setUserInfo', 'setRowData', 'setRowPwd', 'setSettings']), + ...mapActions(['setUserInfo', 'setRowData', 'setRowPwd', 'setSettings', 'setHomeState']), // 修改md-app的最小高度 changeFixed(clientHeight) { @@ -188,6 +190,19 @@ export default { this.show_list = data_list; // 抽离title this.separateTitle(data_list); + // 恢复原先状态 + if(this.home_state) { + this.search_start = this.home_state.search_start + this.search_content = this.home_state.search_content + this.$nextTick(()=>{ + this.$refs.list_placeholder.parentNode.parentNode.scrollTo({ + top: this.home_state.scrollHeight + }); + console.log('原状态恢复完成') + this.setHomeState(['', this]) + console.log('主页状态缓存删除完成') + }) + } } else { // 空密码本 this.show_list = []; @@ -261,6 +276,8 @@ export default { // 跳转到解锁界面 turnToUnlock(type) { + this.setHomeState(['', this]) + console.log('主页状态缓存删除完成') console.log(type); this.setRowPwd(['', this]); if (type == '密码超时') this.$router.push({ name: 'Unlock', params: { msg: this.lang.unlock_msg.expired } }); @@ -285,15 +302,33 @@ export default { this.turnToUnlock('点击新增未解锁拦截'); return; } + let home_state = { + search_start : this.search_start, + search_content: this.search_content, + scrollHeight: this.scrollHeight + } + this.setHomeState([home_state, this]) this.$router.push('/add'); }, turnToDetail(content) { + let home_state = { + search_start : this.search_start, + search_content: this.search_content, + scrollHeight: this.scrollHeight + } + this.setHomeState([home_state, this]) this.$router.push({ name: 'Detail', params: { code_content: content } }); }, // 跳转到某页面 turnToPage(url) { + let home_state = { + search_start : this.search_start, + search_content: this.search_content, + scrollHeight: this.scrollHeight + } + this.setHomeState([home_state, this]) this.$router.push(url); }, @@ -394,6 +429,11 @@ export default { this.toggleClass(vconDom, 'vconsole-show'); this.count = 0; } + }, + + // 记录滚动高度 + scroll(e) { + this.scrollHeight = this.$refs.list_placeholder.parentNode.parentNode.scrollTop } }, created() { @@ -409,6 +449,7 @@ export default { this.clientHeight = `${document.documentElement.clientHeight}`; setHtmlFontSize(); }.bind(this); + this.$refs.list_placeholder.parentNode.parentNode.addEventListener('scroll', this.scroll) }, watch: { // 如果 `clientHeight` 发生改变,这个函数就会运行 @@ -423,6 +464,7 @@ export default { } else { this.show_list = JSON.parse(JSON.stringify(this.cache_list)); this.cache_list = []; + this.search_content = '' console.log('搜索阵列关闭,缓存清空完成'); } },