fix #267 标签过多时会，右键弹出的选项菜单会变形

newpanjing · Jun 22, 2020 · 3247dc8 · 3247dc8
1 parent ce3c912
commit 3247dc8
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/simpleui/static/admin/simpleui-x/js/index.js b/simpleui/static/admin/simpleui-x/js/index.js
@@ -374,15 +374,27 @@
                 window.open(url);
             },
             contextmenu: function (item, e) {
+                //右键菜单，如果x+菜单宽度超过屏幕宽度，就默认为屏幕宽度-10-菜单宽度
 
                 //home没有popup menu
                 if (item.id == '0') {
                     return;
                 }
                 this.popup.tab = item;
-                this.popup.left = e.clientX;
-                this.popup.top = e.clientY;
                 this.popup.show = true;
+                this.$nextTick(function () {
+                    let el = this.$refs.popupmenu;
+                    el.style.width='150px';
+                    let x = e.clientX;
+
+                    let w= document.body.offsetWidth
+                    if(x+150>w){
+                        x = w - 160;
+                    }
+
+                    this.popup.left = x;
+                    this.popup.top = e.clientY;
+                });
             },
             mainClick: function (e) {
                 this.popup.show = false;

diff --git a/simpleui/templates/admin/index.html b/simpleui/templates/admin/index.html
@@ -263,7 +263,7 @@
         </el-container>
     </el-container>
 
-    <ul v-if="popup.show" class="el-dropdown-menu el-popper"
+    <ul v-if="popup.show" class="el-dropdown-menu el-popper" ref="popupmenu"
         :style="{position: 'absolute',top: popup.top+'px',left: popup.left+'px'}" x-placement="top-end">
         <li v-for="(item,index) in popup.menus" tabindex="-1" class="el-dropdown-menu__item"
             @click="item.handler(popup.tab,item)"><i :class="item.icon"></i><span