perf: 添加组件缓存

src/components/Apps/ChatAi/index.vue

@@ -73,7 +73,6 @@ export default {
   },
   methods: {
     handleMoveMouseDown(event) {
-      console.log('Event: ', event)
       this.$refs.drawer.handleHeaderMoveDown(event)
     },
     handleMouseMoveUp(event) {

src/components/Form/AutoDataForm/index.vue

@@ -106,7 +106,7 @@ export default {
       const generator = new FormFieldGenerator(this.$emit)
       this.totalFields = generator.generateFields(this.fields, this.fieldsMeta, this.remoteMeta)
       this.groups = generator.groups
-      this.$log.debug('Total fields: ', JSON.stringify(this.totalFields))
+      this.$log.debug('Total fields: ', this.totalFields)
     },
     _cleanFormValue(form, remoteMeta) {
       if (!form) {

src/components/Form/FormFields/InputWithUnit.vue

@@ -28,7 +28,6 @@ export default {
   },
   computed: {
     iUnit() {
-      console.log('Unit is:', this.unit)
       return this.displayMapper[this.unit] || this.unit
     }
   }

src/components/Table/ListTable/index.vue

@@ -165,6 +165,11 @@ export default {
       deep: true
     }
   },
+  activated() {
+    setTimeout(() => {
+      this.reloadTable()
+    })
+  },
   methods: {
     handleSelectionChange(val) {
       this.selectedRows = val

src/components/Tree/DataZTree/components/ZTree/index.vue

@@ -438,6 +438,7 @@ div.rMenu li {
   padding: 3px 20px;
   clear: both;
   white-space: nowrap;
+  width: 20px;
 }
 
 .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {

src/layout/components/AppMain.vue

@@ -1,7 +1,7 @@
 <template>
   <section class="app-main">
     <transition mode="out-in" name="fade-transform">
-      <keep-alive :include="cachedViews">
+      <keep-alive :max="10">
         <router-view :key="key" />
       </keep-alive>
     </transition>
@@ -22,9 +22,6 @@ export default {
     ...mapGetters([
       'publicSettings'
     ]),
-    chatAiEnabled() {
-      return this.publicSettings?.CHAT_AI_ENABLED
-    },
     key() {
       return this.$route.path
     },
@@ -33,7 +30,6 @@ export default {
     }
   },
   methods: {
-
   }
 }
 </script>

src/layout/components/GenericCreateUpdateForm/index.vue

@@ -206,10 +206,9 @@ export default {
       default(res, method, vm, addContinue) {
         const route = this.getNextRoute(res, method)
         if (!(route.params && route.params.id)) {
-          route['params'] = deepmerge(route['params'] || {}, { 'id': res.id, order: this.extraQueryOrder })
+          route['params'] = deepmerge(route['params'] || {}, { 'id': res.id })
-        } else {
-          route['params'] = deepmerge(route['params'], { order: this.extraQueryOrder })
         }
+        route['query'] = deepmerge(route['query'], { 'order': this.extraQueryOrder, 'updated': new Date().getTime() })
         this.$emit('submitSuccess', res)
 
         this.emitPerformSuccessMsg(method, res, addContinue)

src/layout/components/GenericListPage/index.vue

@@ -13,6 +13,7 @@ export default {
   components: {
     Page, GenericListTable
   },
+
   methods: {
     reloadTable() {
       this.$refs.ListTable.reloadTable()

src/layout/components/NavHeader/ViewSwitcher.vue

@@ -128,7 +128,7 @@ export default {
 
   ::v-deep .el-submenu .el-submenu__title {
     height: 40px;
-    line-height: 40px;
+    line-height: 32px;
     border-bottom: none;
   }
 
@@ -142,8 +142,9 @@ export default {
   }
 
   .el-menu-item {
-    height: 40px;
+    height: 36px;
-    line-height: 36px;
+    width: 160px;
+    line-height: 26px;
     padding: 4px 24px;
 
     &:hover {
@@ -192,7 +193,6 @@ export default {
 
 .el-menu-item {
   &.is-active {
-    font-weight: bold;
     color: var(--menu-text-active);
 
     &:before {

src/layout/components/Page/index.vue

@@ -1,7 +1,16 @@
 <template>
   <div class="page">
+    <TagsView :show.sync="showHistory" />
     <PageHeading v-if="iTitle || helpMessage" :help-msg="helpMessage" class="disabled-when-print">
-      <el-button :disabled="gobackDisabled" class="go-back" icon="el-icon-back" @click="handleGoBack" />
+      <el-button
+        :disabled="gobackDisabled"
+        class="go-back"
+        icon="el-icon-back"
+        @click="handleGoBack"
+        @mouseleave="endLongPress"
+        @mouseup="endLongPress"
+        @mousedown.native="startLongPress"
+      />
       <slot name="title">
         <span style="padding-left: 10px">
           {{ iTitle }}
@@ -33,6 +42,7 @@
 import PageHeading from './PageHeading'
 import PageContent from './PageContent'
 import UserConfirmDialog from '@/components/Apps/UserConfirmDialog/index.vue'
+import TagsView from '../TagsView/index.vue'
 import { toSentenceCase } from '@/utils/common'
 
 export default {
@@ -40,7 +50,8 @@ export default {
   components: {
     UserConfirmDialog,
     PageHeading,
-    PageContent
+    PageContent,
+    TagsView
   },
   props: {
     title: {
@@ -62,6 +73,11 @@ export default {
       }
     }
   },
+  data() {
+    return {
+      showHistory: false
+    }
+  },
   computed: {
     iTitle() {
       let title = this.title || this.$route.meta.title
@@ -81,6 +97,15 @@ export default {
   methods: {
     handleGoBack() {
       this.goBack.bind(this)()
+    },
+    startLongPress() {
+      this.longPressTimer = setTimeout(() => {
+        this.showHistory = !this.showHistory
+        // 在这里执行长按事件的操作
+      }, 1000) // 设置长按持续时间，单位为毫秒
+    },
+    endLongPress() {
+      clearTimeout(this.longPressTimer)
     }
   }
 }

src/layout/components/TagsView/ScrollPane.vue

@@ -10,7 +10,6 @@
 </template>
 
 <script>
-const tagAndTagSpacing = 4 // tagAndTagSpacing
 export default {
   name: 'ScrollPane',
   data() {
@@ -29,43 +28,7 @@ export default {
       const $scrollWrapper = this.scrollWrapper
       $scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4
     },
-    moveToTarget(currentTag) {
+    moveToTarget() {
-      const $container = this.$refs.scrollContainer.$el
-      const $containerWidth = $container.offsetWidth
-      const $scrollWrapper = this.scrollWrapper
-      const tagList = this.$parent.$refs.tag
-      let firstTag = null
-      let lastTag = null
-      // find first tag and last tag
-      if (tagList.length > 0) {
-        firstTag = tagList[0]
-        lastTag = tagList[tagList.length - 1]
-      }
-      if (firstTag === currentTag) {
-        $scrollWrapper.scrollLeft = 0
-      } else if (lastTag === currentTag) {
-        $scrollWrapper.scrollLeft =
-          $scrollWrapper.scrollWidth - $containerWidth
-      } else {
-        // find preTag and nextTag
-        const currentIndex = tagList.findIndex(item => item === currentTag)
-        const prevTag = tagList[currentIndex - 1]
-        const nextTag = tagList[currentIndex + 1]
-        // the tag's offsetLeft after of nextTag
-        const afterNextTagOffsetLeft =
-          nextTag.$el.offsetLeft + nextTag.$el.offsetWidth + tagAndTagSpacing
-        // the tag's offsetLeft before of prevTag
-        const beforePrevTagOffsetLeft =
-          prevTag.$el.offsetLeft - tagAndTagSpacing
-        if (
-          afterNextTagOffsetLeft >
-          $scrollWrapper.scrollLeft + $containerWidth
-        ) {
-          $scrollWrapper.scrollLeft = afterNextTagOffsetLeft - $containerWidth
-        } else if (beforePrevTagOffsetLeft < $scrollWrapper.scrollLeft) {
-          $scrollWrapper.scrollLeft = beforePrevTagOffsetLeft
-        }
-      }
     }
   }
 }

src/layout/components/TagsView/index.vue

@@ -1,14 +1,14 @@
 <template>
-  <div id="tags-view-container" class="tags-view-container">
+  <el-alert v-show="show" id="tags-view-container" class="tags-view-container">
     <scroll-pane ref="scrollPane" class="tags-view-wrapper">
       <router-link
         v-for="tag in visitedViews"
-        ref="tag"
         :key="tag.path"
-        :class="isActive(tag)?'active':''"
+        ref="tag"
+        :class="isActive(tag) ? 'active' : '' "
         :to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"
-        tag="span"
         class="tags-view-item"
+        tag="span"
         @click.middle.native="!isAffix(tag)?closeSelectedTag(tag):''"
         @contextmenu.prevent.native="openMenu(tag,$event)"
       >
@@ -26,14 +26,21 @@
       <li @click="closeOthersTags">Close Others</li>
       <li @click="closeAllTags(selectedTag)">Close All</li>
     </ul>
-  </div>
+  </el-alert>
 </template>
 
 <script>
 import ScrollPane from './ScrollPane'
 import path from 'path'
+
 export default {
   components: { ScrollPane },
+  props: {
+    show: {
+      type: Boolean,
+      default: false
+    }
+  },
   data() {
     return {
       visible: false,
@@ -52,7 +59,7 @@ export default {
     }
   },
   watch: {
-    $route() {
+    $route(iNew, iOld) {
       this.addTags()
       this.moveToCurrentTag()
     },
@@ -202,12 +209,14 @@ export default {
 <style lang="scss" scoped>
 @import "~@/styles/variables.scss";
 .tags-view-container {
+  background-color: #f3f3f4 !important;
+  border: none !important;
   height: 34px;
   width: 100%;
-  margin-top: 5px;
+  margin-top: 2px !important;
-  background: #fff;
+  margin-bottom: 2px !important;
-  border-bottom: 1px solid #d8dce5;
+  padding: 0;
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
+
   .tags-view-wrapper {
     .tags-view-item {
       display: inline-block;

src/store/modules/tagsView.js

@@ -3,6 +3,8 @@ const state = {
   cachedViews: []
 }
 
+const maxCacheViews = 10
+
 const mutations = {
   ADD_VISITED_VIEW: (state, view) => {
     if (state.visitedViews.some(v => v.path === view.path)) return
@@ -11,12 +13,18 @@ const mutations = {
         title: view.meta.title || 'no-name'
       })
     )
+    if (state.visitedViews?.length > maxCacheViews) {
+      state.visitedViews.shift()
+    }
   },
   ADD_CACHED_VIEW: (state, view) => {
     if (state.cachedViews.includes(view.name)) return
     if (!view.meta.noCache) {
       state.cachedViews.push(view.name)
     }
+    if (state.cachedViews.length > maxCacheViews) {
+      state.cachedViews.shift()
+    }
   },
 
   DEL_VISITED_VIEW: (state, view) => {

src/store/modules/users.js

@@ -71,7 +71,6 @@ const mutations = {
     state.consoleOrgs = state.consoleOrgs.filter(i => i.id !== org.id)
   },
   SET_CURRENT_ORG(state, org) {
-    console.log('Set current org: ', org)
     // 系统组织和全局组织不设置成 Pre org
     if (!state.currentOrg?.autoEnter) {
       state.preOrg = state.currentOrg

src/styles/index.scss

@@ -511,3 +511,7 @@ $tooltip-arrow-color: #c2d1e1;
 .el-upload--text {
   font-size: 0.9em;
 }
+
+li.rmenu i.fa {
+  width: 20px;
+}

src/styles/ztree.css

@@ -60,7 +60,6 @@ website:    http://code.google.com/p/jquerytree/
   *border: 0px;
 }
 .ztree li a:hover {
-  background: #e7f4f9;
   border-radius: 2px;
   box-shadow: inset 0 0 1px #cccccc;
 }

src/utils/auth.js

@@ -33,7 +33,6 @@ export function saveCurrentRoleLocal(username, role) {
 export function getCurrentOrgLocal(username) {
   const key = CURRENT_ORG_KEY + '_' + username
   const value = localStorage.getItem(key)
-  console.log('Local org: ', value)
   try {
     return JSON.parse(value)
   } catch (e) {

src/utils/org.js

@@ -12,9 +12,7 @@ function getPropOrg() {
   if (defaultOrg) {
     return defaultOrg
   }
-  console.log('Orgs: ', orgs)
+  return orgs.filter(item => !item['is_root'] && item.id !== SYSTEM_ORG_ID)[0]
-  const org = orgs.filter(item => !item['is_root'] && item.id !== SYSTEM_ORG_ID)[0]
-  console.log('Prop org: ', org)
 }
 
 async function change2PropOrg() {

src/views/assets/Asset/AssetList/components/BaseList.vue

@@ -306,6 +306,14 @@ export default {
   watch: {
     optionInfo(iNew) {
       this.$set(this.defaultConfig.columnsMeta.gathered_info.formatterArgs, 'info', iNew)
+    },
+    $route(iNew, old) {
+      const tab = iNew.query.tab
+      const oldTab = old.query.tab
+      if (tab !== oldTab && tab !== 'all') {
+        iNew.query.node_id = ''
+        this.$router.push(iNew)
+      }
     }
   },
   methods: {

src/views/assets/Platform/PlatformList.vue

@@ -142,7 +142,6 @@ export default {
       this.headerActions.moreCreates.dropdown = this.$store.state.assets.assetCategoriesDropdown.filter(item => {
         return item.category === this.tab.activeMenu
       })
-      console.log('Category: ', this.headerActions.moreCreates.dropdown)
     },
     async setCategoriesTab() {
       const categoryIcon = {