From a3c868db4d017961be2d394eadb7d428045d5adc Mon Sep 17 00:00:00 2001
From: lihang <lihang@vci-tech.com>
Date: 星期四, 13 七月 2023 11:13:16 +0800
Subject: [PATCH] 业务类型页面增加生命周期的处理
---
Source/UBCS-WEB/dist/src/page/index/tags.vue | 186 ++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 186 insertions(+), 0 deletions(-)
diff --git a/Source/UBCS-WEB/dist/src/page/index/tags.vue b/Source/UBCS-WEB/dist/src/page/index/tags.vue
new file mode 100644
index 0000000..ab14485
--- /dev/null
+++ b/Source/UBCS-WEB/dist/src/page/index/tags.vue
@@ -0,0 +1,186 @@
+<template>
+ <div class="avue-tags"
+ v-if="showTag">
+ <!-- tag鐩掑瓙 -->
+ <div v-if="contextmenuFlag"
+ class="avue-tags__contentmenu"
+ :style="{left:contentmenuX+'px',top:contentmenuY+'px'}">
+ <div class="item"
+ @click="clearCacheTags">{{$t('tagsView.clearCache')}}
+ </div>
+ <div class="item"
+ @click="closeOthersTags">{{$t('tagsView.closeOthers')}}
+ </div>
+ <div class="item"
+ @click="closeAllTags">{{$t('tagsView.closeAll')}}
+ </div>
+ </div>
+ <div class="avue-tags__box"
+ :class="{'avue-tags__box--close':!website.isFirstPage}">
+ <el-tabs v-model="active"
+ type="card"
+ @contextmenu.native="handleContextmenu"
+ :closable="tagLen!==1"
+ @tab-click="openTag"
+ @edit="menuTag">
+ <el-tab-pane :key="item.value"
+ v-for="item in tagList"
+ :label="generateTitle(item)"
+ :name="item.value">
+ </el-tab-pane>
+
+ </el-tabs>
+ <el-dropdown class="avue-tags__menu">
+ <el-button type="primary"
+ size="mini">
+ {{$t('tagsView.menu')}}
+ <i class="el-icon-arrow-down el-icon--right"></i>
+ </el-button>
+ <el-dropdown-menu slot="dropdown">
+ <el-dropdown-item @click.native="$parent.isSearch=true">{{$t('tagsView.search')}}</el-dropdown-item>
+ <el-dropdown-item @click.native="closeOthersTags">{{$t('tagsView.closeOthers')}}</el-dropdown-item>
+ <el-dropdown-item @click.native="closeAllTags">{{$t('tagsView.closeAll')}}</el-dropdown-item>
+ <el-dropdown-item @click.native="clearCacheTags">{{$t('tagsView.clearCache')}}</el-dropdown-item>
+ </el-dropdown-menu>
+ </el-dropdown>
+ </div>
+
+ </div>
+</template>
+<script>
+ import {mapGetters, mapState} from "vuex";
+ import {clearCache} from "@/api/user";
+
+ export default {
+ name: "tags",
+ data() {
+ return {
+ active: "",
+ contentmenuX: "",
+ contentmenuY: "",
+ contextmenuFlag: false
+ };
+ },
+ created() {
+ },
+ mounted() {
+ this.setActive();
+ },
+ watch: {
+ tag() {
+ this.setActive();
+ },
+ contextmenuFlag() {
+ window.addEventListener("mousedown", this.watchContextmenu);
+ }
+ },
+ computed: {
+ ...mapGetters(["tagWel", "tagList", "tag", "website"]),
+ ...mapState({
+ showTag: state => state.common.showTag
+ }),
+ tagLen() {
+ return this.tagList.length || 0;
+ }
+ },
+ methods: {
+ generateTitle(item) {
+ return this.$router.$avueRouter.generateTitle(
+ item.label,
+ (item.meta || {}).i18n
+ );
+ },
+ watchContextmenu(event) {
+ if (!this.$el.contains(event.target) || event.button !== 0) {
+ this.contextmenuFlag = false;
+ }
+ window.removeEventListener("mousedown", this.watchContextmenu);
+ },
+ handleContextmenu(event) {
+ let target = event.target;
+ // 瑙ｅ喅 https://github.com/d2-projects/d2-admin/issues/54
+ let flag = false;
+ if (target.className.indexOf("el-tabs__item") > -1) flag = true;
+ else if (target.parentNode.className.indexOf("el-tabs__item") > -1) {
+ target = target.parentNode;
+ flag = true;
+ }
+ if (flag) {
+ event.preventDefault();
+ event.stopPropagation();
+ this.contentmenuX = event.clientX;
+ this.contentmenuY = event.clientY;
+ this.tagName = target.getAttribute("aria-controls").slice(5);
+ this.contextmenuFlag = true;
+ }
+ },
+ //婵�娲诲綋鍓嶉�夐」
+ setActive() {
+ this.active = this.tag.value;
+ },
+ menuTag(value, action) {
+ if (action === "remove") {
+ let {tag, key} = this.findTag(value);
+ this.$store.commit("DEL_TAG", tag);
+ if (tag.value === this.tag.value) {
+ tag = this.tagList[key === 0 ? key : key - 1]; //濡傛灉鍏抽棴鏈爣绛捐鍓嶆帹涓�涓�
+ this.openTag(tag);
+ }
+ }
+ },
+ openTag(item) {
+ let tag;
+ if (item.name) {
+ tag = this.findTag(item.name).tag;
+ } else {
+ tag = item;
+ }
+ this.$router.push({
+ path: this.$router.$avueRouter.getPath({
+ name: tag.label,
+ src: tag.value
+ }, tag.meta),
+ query: tag.query
+ });
+ },
+ closeOthersTags() {
+ this.contextmenuFlag = false;
+ this.$store.commit("DEL_TAG_OTHER");
+ },
+ findTag(value) {
+ let tag, key;
+ this.tagList.map((item, index) => {
+ if (item.value === value) {
+ tag = item;
+ key = index;
+ }
+ });
+ return {tag: tag, key: key};
+ },
+ closeAllTags() {
+ this.contextmenuFlag = false;
+ this.$store.commit("DEL_ALL_TAG");
+ this.$router.push({
+ path: this.$router.$avueRouter.getPath({
+ src: this.tagWel.value
+ }),
+ query: this.tagWel.query
+ });
+ },
+ clearCacheTags() {
+ this.$confirm("鏄惁闇�瑕佹竻闄ょ紦瀛�?", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ type: "warning"
+ }).then(() => {
+ clearCache().then(() => {
+ this.contextmenuFlag = false;
+ this.$message.success('娓呴櫎瀹屾瘯');
+ })
+ });
+ }
+ }
+ };
+</script>
+
+
--
Gitblit v1.9.3