Skip to content

M
mes-ui
Commit 094fd58a authored by 仇晓婷's avatar 仇晓婷
Browse files
Options

多页签优化

parent 7b811b92
Show whitespace changes
Inline Side-by-side
Showing with 393 additions and 382 deletions
store/admin/page.js
View file @ 094fd58a
......@@ -9,8 +9,8 @@ import { getAllSiderMenu, includeArray } from '@/libs/system';
// 判定是否需要缓存
const isKeepAlive = data => get(data, 'meta.cache', false);
export const strict=false;
export const state=()=>({
export const strict = false;
export const state = () => ({
// 可以在多页 tab 模式下显示的页面
pool: [],
// 当前显示的多页面列表
......@@ -21,11 +21,11 @@ export const state=()=>({
keepAlive: []
})
export const actions={
export const actions = {
/**
* @description 从持久化数据载入分页列表
*/
openedLoad ({ state, commit, dispatch, rootState }) {
openedLoad({ state, commit, dispatch, rootState }) {
return new Promise(async resolve => {
// store 赋值
const value = await dispatch('admin/db/get', {
......@@ -79,7 +79,7 @@ export const actions={
/**
* 将 opened 属性赋值并持久化 在这之前请先确保已经更新了 state.opened
*/
opened2db ({ state, dispatch }) {
opened2db({ state, dispatch }) {
return new Promise(async resolve => {
// 设置数据
dispatch('admin/db/set', {
......@@ -96,7 +96,7 @@ export const actions={
* @description 更新页面列表上的某一项
* @param {Object} param { index, params, query, fullPath } 路由信息
*/
openedUpdate ({ state, commit, dispatch }, { index, params, query, fullPath, meta }) {
openedUpdate({ state, commit, dispatch }, { index, params, query, fullPath, meta }) {
return new Promise(async resolve => {
// 更新页面列表某一项
let page = state.opened[index];
......@@ -115,7 +115,7 @@ export const actions={
* @description 更新页面当前项
* @param {Object} param { params, query, fullPath } 路由信息
*/
currentUpdate ({ state, commit, dispatch }, { params, query, fullPath, meta }) {
currentUpdate({ state, commit, dispatch }, { params, query, fullPath, meta }) {
return new Promise(async resolve => {
setTimeout(async () => {
// 更新当前项
......@@ -137,7 +137,7 @@ export const actions={
* @description 新增一个 tag (打开一个页面)
* @param {Object} param new tag info
*/
add ({ state, commit, dispatch }, { tag, params, query, fullPath }) {
add({ state, commit, dispatch }, { tag, params, query, fullPath }) {
return new Promise(async resolve => {
// 设置新的 tag 在新打开一个以前没打开过的页面时使用
let newTag = tag;
......@@ -160,7 +160,7 @@ export const actions={
* @description 打开一个新的页面
* @param {Object} param 从路由钩子的 to 对象上获取 { name, params, query, fullPath } 路由信息
*/
open ({ state, commit, dispatch }, { name, params, query, fullPath }) {
open({ state, commit, dispatch }, { name, params, query, fullPath }) {
return new Promise(async resolve => {
// 已经打开的页面
let opened = state.opened;
......@@ -201,7 +201,7 @@ export const actions={
* @description 关闭一个 tag (关闭一个页面)
* @param {Object} param { tagName: 要关闭的标签名字 }
*/
close ({ state, commit, dispatch }, { tagName }) {
close({ state, commit, dispatch }, { tagName }) {
return new Promise(async resolve => {
// 下个新的页面
let newPage = state.opened[0];
......@@ -245,7 +245,7 @@ export const actions={
params,
query
};
$nuxt.$router.push(routerObj, () => {});
$nuxt.$router.push(routerObj, () => { });
}
// end
resolve();
......@@ -255,7 +255,8 @@ export const actions={
* @description 关闭当前标签左边的标签
* @param {Object} param { pageSelect: 当前选中的tagName }
*/
closeLeft ({ state, commit, dispatch }, { pageSelect } = {}) {
closeLeft({ state, commit, dispatch }, { pageSelect } = {}) {
return new Promise(async resolve => {
const pageAim = pageSelect || state.current;
let currentIndex = 0;
......@@ -267,6 +268,10 @@ export const actions={
if (currentIndex > 0) {
// 删除打开的页面 并在缓存设置中删除
state.opened.splice(1, currentIndex - 1).forEach(({ name }) => commit('keepAliveRemove', name));
}
if (state.opened.length == 2) {
state.opened.splice(0, 1);
}
state.current = pageAim;
if ($nuxt.$router.fullPath !== pageAim) {
......@@ -282,7 +287,7 @@ export const actions={
* @description 关闭当前标签右边的标签
* @param {Object} param { pageSelect: 当前选中的tagName }
*/
closeRight ({ state, commit, dispatch }, { pageSelect } = {}) {
closeRight({ state, commit, dispatch }, { pageSelect } = {}) {
return new Promise(async resolve => {
const pageAim = pageSelect || state.current;
let currentIndex = 0;
......@@ -308,7 +313,7 @@ export const actions={
* @description 关闭当前激活之外的 tag
* @param {Object} param { pageSelect: 当前选中的tagName }
*/
closeOther ({ state, commit, dispatch }, { pageSelect } = {}) {
closeOther({ state, commit, dispatch }, { pageSelect } = {}) {
return new Promise(async resolve => {
const pageAim = pageSelect || state.current;
let currentIndex = 0;
......@@ -324,6 +329,9 @@ export const actions={
state.opened.splice(currentIndex + 1).forEach(({ name }) => commit('keepAliveRemove', name));
state.opened.splice(1, currentIndex - 1).forEach(({ name }) => commit('keepAliveRemove', name));
}
if (state.opened.length == 2) {
state.opened.splice(0, 1);
}
// 设置新的页面
state.current = pageAim;
if ($nuxt.$router.fullPath !== pageAim) {
......@@ -339,31 +347,31 @@ export const actions={
* @description 关闭所有 tag
* @param {Object} state vuex state
*/
closeAll ({ state, commit, dispatch }) {
closeAll({ state, commit, dispatch }) {
return new Promise(async resolve => {
// 删除打开的页面 并在缓存设置中删除
state.opened.splice(1).forEach(({ name }) => commit('keepAliveRemove', name));
state.opened.splice(0).forEach(({ name }) => commit('keepAliveRemove', name));
// 持久化
await dispatch('opened2db');
// 关闭所有的标签页后需要判断一次现在是不是在首页
if ($nuxt.$router.name !== 'index') {
$nuxt.$router.push({
name: 'index'
}, () => {});
}
// if ($nuxt.$router.name !== 'index') {
// $nuxt.$router.push({
// name: 'index'
// }, () => { });
// }
// end
resolve();
});
}
}
export const mutations={
export const mutations = {
/**
* @class keepAlive
* @description 从已经打开的页面记录中更新需要缓存的页面记录
* @param {Object} state vuex state
*/
keepAliveRefresh (state) {
keepAliveRefresh(state) {
state.keepAlive = state.opened.filter(item => isKeepAlive(item)).map(e => e.name);
},
/**
......@@ -371,22 +379,25 @@ export const mutations={
* @param {Object} state vuex state
* @param {String} name name
*/
keepAliveRemove (state, name) {
const list = [ ...state.keepAlive ];
keepAliveRemove(state, name) {
const list = [...state.keepAlive];
const index = list.findIndex(item => item === name);
if (index !== -1) {
list.splice(index, 1);
state.keepAlive = list;
}
if (state.opened.length == 2) {
state.opened.splice(0, 1);
}
},
/**
* @description 增加一个页面的缓存设置
* @param {Object} state vuex state
* @param {String} name name
*/
keepAlivePush (state, name) {
const keep = [ ...state.keepAlive ];
keepAlivePush(state, name) {
const keep = [...state.keepAlive];
keep.push(name);
state.keepAlive = keep;
},
......@@ -394,7 +405,7 @@ export const mutations={
* @description 清空页面缓存设置
* @param {Object} state vuex state
*/
keepAliveClean (state) {
keepAliveClean(state) {
state.keepAlive = [];
},
/**
......@@ -403,7 +414,7 @@ export const mutations={
* @param {Object} state vuex state
* @param {String} fullPath new fullPath
*/
currentSet (state, fullPath) {
currentSet(state, fullPath) {
state.current = fullPath;
},
/**
......@@ -412,7 +423,7 @@ export const mutations={
* @param {Object} state vuex state
* @param {Array} routes routes
*/
init (state, routes) {
init(state, routes) {
const pool = [];
const push = function (routes) {
routes.forEach(route => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment