新增tab对象简化页签操作

RuoYi

2021-11-19 d1eacc1d1c7ba17735ba5c0a59db9700ebabecc0

新增tab对象简化页签操作

 ruoyi-ui/src/layout/components/TagsView/index.vue

@@ -152,31 +152,24 @@
      })

    },

    refreshSelectedTag(view) {

      this.$store.dispatch('tagsView/delCachedView', view).then(() => {

        const { fullPath } = view

        this.$nextTick(() => {

          this.$router.replace({

            path: '/redirect' + fullPath

          })

        })

      })

      this.$tab.refreshPage(view);

    },

    closeSelectedTag(view) {

      this.$store.dispatch('tagsView/delView', view).then(({ visitedViews }) => {

      this.$tab.closePage(view).then(({ visitedViews }) => {

        if (this.isActive(view)) {

          this.toLastView(visitedViews, view)

        }

      })

    },

    closeRightTags() {

      this.$store.dispatch('tagsView/delRightTags', this.selectedTag).then(visitedViews => {

      this.$tab.closeRightPage(this.selectedTag).then(visitedViews => {

        if (!visitedViews.find(i => i.fullPath === this.$route.fullPath)) {

          this.toLastView(visitedViews)

        }

      })

    },

    closeLeftTags() {

      this.$store.dispatch('tagsView/delLeftTags', this.selectedTag).then(visitedViews => {

      this.$tab.closeLeftPage(this.selectedTag).then(visitedViews => {

        if (!visitedViews.find(i => i.fullPath === this.$route.fullPath)) {

          this.toLastView(visitedViews)

        }

@@ -184,12 +177,12 @@
    },

    closeOthersTags() {

      this.$router.push(this.selectedTag).catch(()=>{});

      this.$store.dispatch('tagsView/delOthersViews', this.selectedTag).then(() => {

      this.$tab.closeOtherPage(this.selectedTag).then(() => {

        this.moveToCurrentTag()

      })

    },

    closeAllTags(view) {

      this.$store.dispatch('tagsView/delAllViews').then(({ visitedViews }) => {

      this.$tab.closeAllPage().then(({ visitedViews }) => {

        if (this.affixTags.some(tag => tag.path === this.$route.path)) {

          return

        }


 ruoyi-ui/src/plugins/index.js

@@ -1,3 +1,4 @@
import tab from './tab'

import auth from './auth'

import cache from './cache'

import modal from './modal'

@@ -5,6 +6,8 @@


export default {

  install(Vue) {

    // 页签操作

    Vue.prototype.$tab = tab

    // 认证对象

    Vue.prototype.$auth = auth

    // 缓存对象


 ruoyi-ui/src/plugins/tab.js

对比新文件
@@ -0,0 +1,68 @@
import store from '@/store'

import router from '@/router';



export default {

  // 刷新当前tab页签

  refreshPage(obj) {

    const { path, matched } = router.currentRoute;

    if (obj === undefined) {

      matched.forEach((m) => {

        if (m.components && m.components.default && m.components.default.name) {

          if (!['Layout', 'ParentView'].includes(m.components.default.name)) {

            obj = { name: m.components.default.name, path: path };

          }

        }

      });

    }

    return store.dispatch('tagsView/delCachedView', obj).then(() => {

      const { path } = obj

      router.replace({

        path: '/redirect' + path

      })

    })





  },

  // 关闭当前tab页签，打开新页签

  closeOpenPage(obj) {

    store.dispatch("tagsView/delView", router.currentRoute);

    if (obj !== undefined) {

      return router.push(obj);

    }

  },

  // 关闭指定tab页签

  closePage(obj) {

    if (obj === undefined) {

      return store.dispatch('tagsView/delView', router.currentRoute).then(({ lastPath }) => {

        return router.push(lastPath || '/');

      });

    }

    return store.dispatch('tagsView/delView', obj);

  },

  // 关闭所有tab页签

  closeAllPage() {

    return store.dispatch('tagsView/delAllViews');

  },

  // 关闭左侧tab页签

  closeLeftPage(obj) {

    return store.dispatch('tagsView/delLeftTags', obj || router.currentRoute);

  },

  // 关闭右侧tab页签

  closeRightPage(obj) {

    return store.dispatch('tagsView/delRightTags', obj || router.currentRoute);

  },

  // 关闭其他tab页签

  closeOtherPage(obj) {

    return store.dispatch('tagsView/delOthersViews', obj || router.currentRoute);

  },

  // 添加tab页签

  addPage(title, url) {

    var obj = { path: url, meta: { title: title } }

    store.dispatch('tagsView/addView', obj);

    return router.push(url);

  },

  // 修改tab页签

  updatePage(obj) {

    return store.dispatch('tagsView/updateVisitedView', obj);

  }

}


 ruoyi-ui/src/store/modules/tagsView.js

@@ -14,7 +14,7 @@
  },

  ADD_CACHED_VIEW: (state, view) => {

    if (state.cachedViews.includes(view.name)) return

    if (!view.meta.noCache) {

    if (view.meta && !view.meta.noCache) {

      state.cachedViews.push(view.name)

    }

  },


 ruoyi-ui/src/views/monitor/job/log.vue

@@ -245,8 +245,8 @@
    },
    // 返回按钮
    handleClose() {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.push({ path: "/monitor/job" });
      const obj = { path: "/monitor/job" };
      this.$tab.closeOpenPage(obj);
    },
    /** 搜索按钮操作 */
    handleQuery() {

 ruoyi-ui/src/views/system/dict/data.vue

@@ -79,6 +79,15 @@
          v-hasPermi="['system:dict:export']"

        >导出</el-button>

      </el-col>

      <el-col :span="1.5">

        <el-button

          type="warning"

          plain

          icon="el-icon-close"

          size="mini"

          @click="handleClose"

        >关闭</el-button>

      </el-col>

      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>

    </el-row>



@@ -316,6 +325,11 @@
      this.queryParams.pageNum = 1;

      this.getList();

    },

    // 返回按钮

    handleClose() {

      const obj = { path: "/system/dict" };

      this.$tab.closeOpenPage(obj);

    },

    /** 重置按钮操作 */

    resetQuery() {

      this.resetForm("queryForm");


 ruoyi-ui/src/views/system/role/authUser.vue

@@ -153,8 +153,8 @@
    },

    // 返回按钮

    handleClose() {

      this.$store.dispatch("tagsView/delView", this.$route);

      this.$router.push({ path: "/system/role" });

      const obj = { path: "/system/role" };

      this.$tab.closeOpenPage(obj);

    },

    /** 搜索按钮操作 */

    handleQuery() {


 ruoyi-ui/src/views/system/user/authRole.vue

@@ -109,8 +109,8 @@
    },

    /** 关闭按钮 */

    close() {

      this.$store.dispatch("tagsView/delView", this.$route);

      this.$router.push({ path: "/system/user" });

      const obj = { path: "/system/user" };

      this.$tab.closeOpenPage(obj);

    },

  },

};


 ruoyi-ui/src/views/system/user/profile/resetPwd.vue

@@ -64,8 +64,7 @@
      });

    },

    close() {

      this.$store.dispatch("tagsView/delView", this.$route);

      this.$router.push({ path: "/index" });

      this.$tab.closePage();

    }

  }

};


 ruoyi-ui/src/views/system/user/profile/userInfo.vue

@@ -68,8 +68,7 @@
      });

    },

    close() {

      this.$store.dispatch("tagsView/delView", this.$route);

      this.$router.push({ path: "/index" });

      this.$tab.closePage();

    }

  }

};


 ruoyi-ui/src/views/tool/gen/editTable.vue

@@ -211,8 +211,8 @@
    },
    /** 关闭按钮 */
    close() {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.push({ path: "/tool/gen", query: { t: Date.now(), pageNum: this.$route.query.pageNum } })
      const obj = { path: "/tool/gen", query: { t: Date.now(), pageNum: this.$route.query.pageNum } };
      this.$tab.closeOpenPage(obj);
    }
  },
  mounted() {