eoss 0.1.0-alpha.21 → 0.1.0-alpha.23

package/packages/main/src/components/pages.vue

@@ -11,31 +11,31 @@
         <div
           class="es-main-pages__handle--item"
           :class="{ 'is-disabled': refresh }"
-          @click="handleRefresh"
+          @click.stop="handleRefresh"
         >
           刷新
         </div>
-        <div class="es-main-pages__handle--item" @click="handleClose">
+        <div class="es-main-pages__handle--item" @click.stop="handleClose">
           关闭标签
         </div>
         <div
           class="es-main-pages__handle--item"
           :class="{ 'is-disabled': other }"
-          @click="other ? '' : handleCloseOther"
+          @click.stop="handleCloseOther"
         >
           关闭其他
         </div>
         <div
           class="es-main-pages__handle--item"
           :class="{ 'is-disabled': left }"
-          @click="left ? '' : handleCloseLeft"
+          @click.stop="handleCloseLeft"
         >
           关闭左侧
         </div>
         <div
           class="es-main-pages__handle--item"
           :class="{ 'is-disabled': right }"
-          @click="right ? '' : handleCloseRight"
+          @click.stop="handleCloseRight"
         >
           关闭右侧
         </div>
@@ -72,12 +72,10 @@
       </div>
       <!-- 菜单 end -->
       <es-tab-pane
-        v-for="(item, index) in tabs"
+        v-for="(item, index) in newTabs"
         :class="{
           'is-fourthTabs':
-            isFourthTabs &&
-            item.fourthTabs &&
-            item.fourthTabs.length
+            isFourthTabs && item.fourthTabs && item.fourthTabs.length
         }"
         :key="item.id"
         :label="item.text || item.name"
@@ -85,11 +83,7 @@
       >
         <es-menu
           class="es-main-pages__sub-menu-fourthTabs"
-          v-if="
-            isFourthTabs &&
-            item.fourthTabs &&
-            item.fourthTabs.length
-          "
+          v-if="isFourthTabs && item.fourthTabs && item.fourthTabs.length"
           mode="horizontal"
           :default-active="item.defaultActive"
           :contents="item.fourthTabs"
@@ -103,7 +97,6 @@
           <router-page
             v-if="item.method === 'router'"
             v-bind="item"
-            :query="$parent.params"
           ></router-page>
           <iframe
             v-else
@@ -142,6 +135,10 @@ export default {
   },
 
   props: {
+    tabs: {
+      type: Array,
+      default: () => []
+    },
     showMenu: {
       type: Boolean,
       default: false
@@ -169,6 +166,7 @@ export default {
 
   data() {
     return {
+      newTabs: [],
       host: getStorage('host') || '',
       //是否显示操作栏
       operate: false,
@@ -189,20 +187,6 @@ export default {
     mode() {
       return this.mainBox.mode;
     },
-    tabs: {
-      get() {
-        return this.isFourthTabs ? this.$main.tabs.map(item => {
-          let defaultActive = ((item.fourthTabs || []).filter(ele => item.url === ele.url)[0] || {}).id || '';
-          return defaultActive ? {
-            ...item,
-            defaultActive: defaultActive
-          } : item;
-        }):this.$main.tabs;
-      },
-      set(val) {
-        this.$main.tabs = val;
-      }
-    },
     activeName: {
       get() {
         return this.$main.activeName;
@@ -214,15 +198,37 @@ export default {
   },
 
   watch: {
+    tabs: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        if (this.isFourthTabs) {
+          this.newTabs = val.map((item) => {
+            let defaultActive =
+              (
+                (item.fourthTabs || []).filter(
+                  (ele) => item.url === ele.url
+                )[0] || {}
+              ).id || '';
+            return defaultActive
+              ? {
+                  ...item,
+                  defaultActive: defaultActive
+                }
+              : item;
+          });
+          return;
+        }
+        this.newTabs = val;
+      }
+    }
   },
 
-  created() {
-  },
+  created() {},
 
   mounted() {},
 
-  beforeDestroy() {
-  },
+  beforeDestroy() {},
 
   methods: {
     /**
@@ -233,11 +239,11 @@ export default {
     renderUrl(url) {
       const userInfo = this.$main.userInfo || this.$main.userModel || {};
       for (let key in userInfo) {
-        url = url.replace(new RegExp(`{{${key}}}`, 'g'), userInfo[key]);
+        url = url.replace(new RegExp(`{${key}}`, 'g'), userInfo[key]);
       }
       return url;
     },
-    
+
     handleSelect(res, index) {
       const { node } = res;
       if (node.urlopenmode === 1 || node.openModel === 1) {
@@ -248,7 +254,7 @@ export default {
         return;
       }
 
-      const updatedTabs = [...this.tabs];
+      const updatedTabs = [...this.newTabs];
       updatedTabs[index].url = node.url;
       this.$main.tabs = updatedTabs;
     },
@@ -258,7 +264,7 @@ export default {
      * @date 2024年9月7日
      **/
     handleTabClick() {
-      const activeTab = this.tabs.find(item => item.id == this.activeName);
+      const activeTab = this.newTabs.find((item) => item.id == this.activeName);
       this.$emit('tab-click', this.activeName, activeTab);
     },
     /**
@@ -267,13 +273,13 @@ export default {
      * @date 2024年9月7日
      **/
     handleRemove(name) {
-      let len = this.tabs.length - 1;
-      let i = indexOfObj(this.tabs, name, 'id,code,appCode');
-      let tab = this.tabs[i];
+      let len = this.newTabs.length - 1;
+      let i = indexOfObj(this.newTabs, name, 'id,code,appCode');
+      let tab = this.newTabs[i];
       let activeTab;
 
       if (i > -1) {
-        const updatedTabs = this.tabs.filter((item) => item.id !== name);
+        const updatedTabs = this.newTabs.filter((item) => item.id !== name);
 
         if (updatedTabs.length == 0) {
           this.activeName = '';
@@ -286,7 +292,7 @@ export default {
         }
 
         this.$emit('tab-remove', tab, activeTab);
-        this.tabs = updatedTabs;
+        this.newTabs = updatedTabs;
       }
     },
     /**
@@ -304,13 +310,13 @@ export default {
       if (index == 0) {
         this.left = true;
       }
-      if (index == this.tabs.length - 1) {
+      if (index == this.newTabs.length - 1) {
         this.right = true;
       }
-      if (this.tabs.length == 1) {
+      if (this.newTabs.length == 1) {
         this.other = true;
       }
-      if (this.tabs[index].id != this.activeName) {
+      if (this.newTabs[index].id != this.activeName) {
         this.refresh = true;
       }
 
@@ -347,12 +353,12 @@ export default {
       if (this.refresh) {
         return;
       }
-      let tab = this.tabs[this.index];
+      let tab = this.newTabs[this.index];
       if (tab.method == 'iframe') {
-        this.tabs[this.index].url = timestampUrl(tab.url);
+        this.newTabs[this.index].url = timestampUrl(tab.url);
       }
       if (tab.method === 'router') {
-        this.$set(this.tabs[this.index], 'keys', uuid());
+        this.$set(this.newTabs[this.index], 'keys', uuid());
       }
       this.operate = false;
       window.removeEventListener('click', this.closeTabsEvents);
@@ -363,19 +369,25 @@ export default {
      * @date 2024年9月7日
      **/
     handleClose() {
-      let i = indexOfObj(this.tabs, this.activeName, 'id');
-      if (this.tabs.length == 1) {
+      let i = indexOfObj(this.newTabs, this.activeName, 'id');
+      let activeTab = this.newTabs[i];
+      let removeTab = [this.newTabs[this.index]];
+      if (this.newTabs.length == 1) {
         this.activeName = '';
+        activeTab = '';
       } else if (i == this.index) {
-        if (this.index < this.tabs.length - 1) {
-          this.activeName = this.tabs[this.index + 1].id;
+        if (this.index < this.newTabs.length - 1) {
+          activeTab = this.newTabs[this.index + 1];
+          this.activeName = activeTab.id;
         } else {
-          this.activeName = this.tabs[this.index - 1].id;
+          activeTab = this.newTabs[this.index - 1];
+          this.activeName = activeTab.id;
         }
       }
-      this.tabs.splice(i, 1);
+      this.newTabs.splice(i, 1);
       this.operate = false;
       window.removeEventListener('click', this.closeTabsEvents);
+      this.$emit('tab-change', this.newTabs, removeTab, activeTab);
     },
     /**
      * @desc:关闭其他标签
@@ -383,11 +395,16 @@ export default {
      * @date 2024年9月7日
      **/
     handleCloseOther() {
-      let tab = this.tabs[this.index];
-      this.tabs = [tab];
-      this.activeName = tab.id;
+      if (this.other) {
+        return;
+      }
+      const activeTab = this.newTabs[this.index];
+      const removeTab = this.newTabs.filter((item) => item.id != activeTab.id);
+      this.newTabs = [activeTab];
+      this.activeName = activeTab.id;
       this.operate = false;
       window.removeEventListener('click', this.closeTabsEvents);
+      this.$emit('tab-change', this.newTabs, removeTab, activeTab);
     },
     /**
      * @desc:关闭左侧标签
@@ -395,13 +412,19 @@ export default {
      * @date 2024年9月7日
      **/
     handleCloseLeft() {
-      let i = indexOfObj(this.tabs, this.activeName, 'id');
-      if (i > this.index) {
-        this.activeName = this.tabs[i].id;
+      if (this.left) {
+        return;
+      }
+      let i = indexOfObj(this.newTabs, this.activeName, 'id');
+      let activeTab = this.newTabs[i];
+      if (i < this.index) {
+        activeTab = this.newTabs[this.index];
       }
-      this.tabs.splice(0, i);
+      this.activeName = activeTab.id;
+      const removeTab = this.newTabs.splice(0, this.index);
       this.operate = false;
       window.removeEventListener('click', this.closeTabsEvents);
+      this.$emit('tab-change', this.newTabs, removeTab, activeTab);
     },
     /**
      * @desc:关闭右侧标签
@@ -409,13 +432,22 @@ export default {
      * @date 2024年9月7日
      **/
     handleCloseRight() {
-      let i = indexOfObj(this.tabs, this.activeName, 'id');
-      if (i < this.index) {
-        this.activeName = this.tabs[i].id;
+      if (this.right) {
+        return;
+      }
+      let i = indexOfObj(this.newTabs, this.activeName, 'id');
+      let activeTab = this.newTabs[i];
+      if (i > this.index) {
+        activeTab = this.newTabs[this.index];
       }
-      this.tabs.splice(i + 1, this.tabs.length - 1);
+      this.activeName = activeTab.id;
+      const removeTab = this.newTabs.splice(
+        this.index + 1,
+        this.newTabs.length - 1
+      );
       this.operate = false;
       window.removeEventListener('click', this.closeTabsEvents);
+      this.$emit('tab-change', this.newTabs, removeTab, activeTab);
     }
   }
 };

package/packages/main/src/components/router-page.vue

@@ -111,5 +111,3 @@ export default {
   }
 };
 </script>
-
-<style lang="scss" scoped></style>

package/packages/main/src/gzw.vue

@@ -17,12 +17,13 @@
       <!-- 路由、iframe -->
       <pages
         :isFourthTabs="isFourthTabs"
-        :tabs.sync="tabs"
+        :tabs="tabs"
         :show-menu="showMenu"
         :fold="fold"
         :spread="spread"
         :active="activeName"
         :tabs-type="tabsType"
+        @tab-change="handleTabChange"
         @tab-click="handleTabClick"
         @tab-remove="handleRemove"
         @fourthTabs="handleFourthTabs"
@@ -278,7 +279,7 @@ export default {
     handleClickAi() {
       // 只有非拖动状态才执行点击
       if (this.isDragging || this.hasDragged) return;
-      this.handlerSetDrawer({type: 'ai', direction: 'rtl', visible: true});
+      this.handlerSetDrawer({ type: 'ai', direction: 'rtl', visible: true });
     },
 
     startDrag(event) {

package/packages/main/src/minxs.js

@@ -36,7 +36,7 @@ import {
   exclAttribute,
   getParams
 } from 'eoss/src/utils/util';
-import { getStorage, setStorage, removeStorage} from 'eoss/src/utils/storage';
+import { getStorage, setStorage, removeStorage } from 'eoss/src/utils/storage';
 import { timeCycle } from 'eoss/src/utils/date';
 import { socket } from 'eoss/src/utils/websocket';
 import { ajax, getMainConfig } from 'eoss/src/utils/ajax';
@@ -67,7 +67,7 @@ export default {
   },
   inject: {
     mainBox: {
-      default: () => {}
+      default: () => { }
     }
   },
   components: {
@@ -1024,10 +1024,10 @@ export default {
         type = resType;
       }
       if (type === 'open') {
-        this.handlerSetDrawer({type: 'ai', direction: 'rtl', ...config, visible: true});
+        this.handlerSetDrawer({ type: 'ai', direction: 'rtl', ...config, visible: true });
         this.aiOpen = true;
       } else if (type === 'close' || type === 'float') {
-        this.handlerSetDrawer({type: 'ai', direction: 'rtl', ...config, visible: false});
+        this.handlerSetDrawer({ type: 'ai', direction: 'rtl', ...config, visible: false });
         // this.aiOpen = false;
       }
     },
@@ -1116,21 +1116,9 @@ export default {
         let appCode;
         if (res.path !== '/' && pathname === res.path) {
           if (res.components) {
-            if (!res.components[code]) {
-              console.error(
-                '路由“命名视图”规范属性名称与菜单appCode不一致',
-                res,
-                code
-              );
-              appCode = Object.keys(res.components).filter((item) => {
-                return item !== 'default';
-              })[0];
-            }
-          } else {
-            console.error(
-              '请根据路由“命名视图”规范，正确添加components属性名称',
-              res
-            );
+            appCode = Object.keys(res.components).filter((item) => {
+              return item !== 'default';
+            })[0];
           }
           return appCode ? { path: pathname, appCode } : pathname;
         }
@@ -1229,7 +1217,7 @@ export default {
             try {
               window.webPageWatermark = res[i];
               watermark(res[i]);
-            } catch (error) {}
+            } catch (error) { }
             break;
           case 'openModel':
             setStorage({ key: 'openModel', value: res[i] });
@@ -1237,12 +1225,12 @@ export default {
           case 'aiConfig':
             if (typeof res[i] === 'string') {
               try {
-                this.aiConfig = {width: 56, height: 56, ...JSON.parse(res[i])};
+                this.aiConfig = { width: 56, height: 56, ...JSON.parse(res[i]) };
               } catch (error) {
                 this.aiConfig = { width: 56, height: 56, url: res[i] };
               }
             } else {
-              this.aiConfig = {width: 56, height: 56, ...res[i]};
+              this.aiConfig = { width: 56, height: 56, ...res[i] };
             }
             this.aiConfig.float && (this.aiFloat = true);
             break;
@@ -1458,14 +1446,14 @@ export default {
         let obj = null;
         if (appid) {
           obj = this.getMenu(this.menuApps, appid, 'id');
-        }
-        if (!obj) {
-          obj = this.getMenu(this.menus, appid, 'id');
-        }
-        if (!obj) {
-          console.error('未找到应用菜单', appid);
-        } else {
-          obj = JSON.parse(JSON.stringify(obj));
+          if (!obj) {
+            obj = this.getMenu(this.menus, appid, 'id');
+          }
+          if (!obj) {
+            console.error('未找到应用菜单', appid);
+          } else {
+            obj = JSON.parse(JSON.stringify(obj));
+          }
         }
         let homePage = null;
         if (this.indexUrl) {
@@ -1603,23 +1591,30 @@ export default {
       if (this.urlParseCache[cacheKey]) {
         const cached = this.urlParseCache[cacheKey];
         res.method = cached.method;
-        if (cached.appCode) res.appCode = cached.appCode;
-        if (cached.path) res.path = cached.path;
-        if (cached.keys) res.keys = cached.keys;
+        if (cached.appCode) {
+          res.appCode = cached.appCode;
+        };
+        if (cached.path) {
+          res.path = cached.path;
+        };
+        if (cached.keys) {
+          res.keys = cached.keys;
+        };
         return res;
       }
       let urls = url.split('?');
       res.method = 'iframe';
       const routes = this.$router.options.routes;
       if (routes) {
-        let path = this.hasRouter(routes, urls[0], res.appCode);
+        let path = this.hasRouter(routes, urls[0], res.appCode || res.code);
         if (path) {
           res.method = 'router';
           if (typeof path === 'string') {
             res.path = path;
+            res.appCode = res.appCode || res.code;
           } else {
             res.path = path.path;
-            res.appCode = path.appCode;
+            res.appCode = res.appCode || res.code || path.appCode;
           }
           res.keys = uuid();
         }
@@ -1914,7 +1909,7 @@ export default {
           if (this.$store) {
             try {
               this.$store.commit('websocket', data);
-            } catch (error) {}
+            } catch (error) { }
           }
           const bus = this.bus || this.$eventBus || this.$root.Bus;
           if (bus) {
@@ -2029,16 +2024,16 @@ export default {
                 let tab = this.setIframeType(obj);
                 this.tabs.push(tab);
                 this.activeName = obj.id;
-                this.tabMenus[tab.id] = {...menus, parentAppId: res.id};
+                this.tabMenus[tab.id] = { ...menus, parentAppId: res.id };
               } else {
                 this.activeName = obj.id;
               }
               if (
                 (menus.children && menus.children.length) ||
-                  (menus.fourthTabs && menus.fourthTabs.length)
+                (menus.fourthTabs && menus.fourthTabs.length)
               ) {
                 this.subActive = obj.id;
-                this.subMenus = {...menus, parentAppId: res.id};
+                this.subMenus = { ...menus, parentAppId: res.id };
                 this.showMenu = this.isFourthTabs ? menus.children.length > 0 : true;
                 this.spread = false;
                 this.fold = false;
@@ -2055,7 +2050,7 @@ export default {
                 (menus.children && menus.children.length) ||
                 (menus.fourthTabs && menus.fourthTabs.length)
               ) {
-                this.subMenus = {...menus, parentAppId: res.id};
+                this.subMenus = { ...menus, parentAppId: res.id };
                 this.showMenu = true;
                 this.spread = false;
                 this.fold = false;
@@ -2075,14 +2070,14 @@ export default {
             this.$alert('没有关联菜单，请联系管理员！', '提示', {
               confirmButtonText: '确定',
               type: 'warning'
-            }).catch(() => {});
+            }).catch(() => { });
           } else {
             this.spread = false;
             this.fold = false;
-            this.subMenus = subMenus ? {...subMenus, parentAppId: res.id} : null;
+            this.subMenus = subMenus ? { ...subMenus, parentAppId: res.id } : null;
             this.showMenu = subMenus
               ? (subMenus.children && subMenus.children.length > 0) ||
-                (subMenus.fourthTabs && subMenus.fourthTabs.length > 0)
+              (subMenus.fourthTabs && subMenus.fourthTabs.length > 0)
               : false;
             if (subMenus.url) {
               // subMenus = JSON.parse(JSON.stringify(subMenus));
@@ -2104,7 +2099,7 @@ export default {
      * @author huangbo
      * @date 2024年9月7日
      **/
-    handlerSetDrawer({type, direction = 'ltr', visible = true, size = '100%'}) {
+    handlerSetDrawer({ type, direction = 'ltr', visible = true, size = '100%' }) {
       this.drawer.visible = visible;
       this.drawer.active = type;
       this.drawer.direction = direction;
@@ -2144,7 +2139,7 @@ export default {
         n = index;
         return item.id === this.activeName;
       });
-      tab = this.setIframeType({...this.tabs[n], url: res.url});
+      tab = this.setIframeType({ ...this.tabs[n], url: res.url });
       this.$set(this.tabs, n, tab);
     },
     /**
@@ -2161,8 +2156,8 @@ export default {
             appId: res.id
           }
         })
-          .then(() => {})
-          .catch(() => {});
+          .then(() => { })
+          .catch(() => { });
       this.showMsg = false;
       this.showSet = false;
       const tabs = [...this.tabs];
@@ -2250,6 +2245,31 @@ export default {
         }
       }
     },
+    /**
+     * @desc:tabs页签删除事件
+     * @author huangbo
+     * @date 2024年9月7日
+     **/
+    handleTabChange(tabs, removeTab, activeTab) {
+      this.tabs = JSON.parse(JSON.stringify(tabs));
+      removeTab.forEach((item) => {
+        delete this.tabMenus[item.id];
+      });
+      if (Object.keys(this.tabMenus).length === 0) {
+        this.subActive = '';
+      }
+      if (activeTab) {
+        if (activeTab.text) {
+          this.subActive = activeTab.id;
+          return;
+        }
+        this.subActive = '';
+        this.activeName = activeTab.id;
+        return;
+      }
+      this.subActive = '';
+      this.activeName = '';
+    },
     /**
      * @desc:删除iframe
      * @author huangbo
@@ -2257,6 +2277,7 @@ export default {
      **/
     handleRemove(removeTab, activeTab) {
       delete this.tabMenus[removeTab.id];
+      this.tabs = this.tabs.filter((item) => item.id !== removeTab.id);
       this.activeName = activeTab.id;
       if (Object.keys(this.tabMenus).length === 0) {
         this.subActive = '';
@@ -2347,10 +2368,10 @@ export default {
             this.showSet = false;
             break;
           case 'ai':
-            this.handlerSetDrawer({type: 'ai', direction: 'rtl', visible: true});
+            this.handlerSetDrawer({ type: 'ai', direction: 'rtl', visible: true });
             break;
           case 'im':
-            this.handlerSetDrawer({type: 'im', direction: 'rtl', visible: true});
+            this.handlerSetDrawer({ type: 'im', direction: 'rtl', visible: true });
             break;
           case 'goView':
             window.open(res.path, '_blank');
@@ -2435,9 +2456,9 @@ export default {
                 }
               }
             })
-            .catch(() => {});
+            .catch(() => { });
         })
-        .catch(() => {});
+        .catch(() => { });
     },
     /**
      * @desc:主题、消息回调

package/packages/menu/src/menu.vue

@@ -424,10 +424,6 @@ export default {
     this.$nextTick(() => this.updated());
   },
   methods: {
-    //  处理滚轮事件，阻止冒泡
-    handleWheel(e) {
-      this.barSize && e.stopPropagation();
-    },
     //  更新选中项索引
     updateActiveIndex(val) {
       const item =
@@ -458,6 +454,10 @@ export default {
         }
       };
     },
+    //  处理滚轮事件，阻止冒泡
+    handleWheel(e) {
+      this.barSize && e.stopPropagation();
+    },
     //  处理滚动事件
     handleScroll() {
       const { x, y } = scrollMove(this.$refs.menuContainer);