hqchart 1.1.13182 → 1.1.13194

package/src/jscommon/umychart.popMenu.js

@@ -21,6 +21,7 @@ function JSPopMenu()
     this.ClickCallback=null;        //点击回调
     this.CheckedClassName="UMyChart_MenuItem_Span_Checked  iconfont icon-checked";   //选中图标
     this.RightArrowClassName="UMyChart_MenuItem_Span_Arrow  iconfont icon-menu_arraw_right";  //右侧箭头
+    this.SelectedClassName="UMyChart_MenuItem_Tr_Selected";
 
     this.AryTDClassName=
     [
@@ -93,7 +94,7 @@ function JSPopMenu()
     {
         var trDom=document.createElement("tr");
         trDom.className='UMyChart_MenuItem_Tr';
-
+        
         var prtTdDom=null;
         for(var i=0;i<this.AryTDClassName.length;++i)
         {
@@ -106,6 +107,7 @@ function JSPopMenu()
                 {
                     var spanDom=document.createElement("span");
                     spanDom.className=this.CheckedClassName;
+                    spanDom.style["font-size"]="10px";
                     tdDom.appendChild(spanDom);
                 }
             }
@@ -123,6 +125,7 @@ function JSPopMenu()
                 {
                     var spanDom=document.createElement("span");
                     spanDom.className=this.RightArrowClassName;
+                    spanDom.style["font-size"]="10px";
                     tdDom.appendChild(spanDom);
                 }
             }
@@ -150,7 +153,21 @@ function JSPopMenu()
                 var subItem=item.SubMenu[i];
                 if (subItem.Name==JSPopMenu.SEPARATOR_LINE_NAME)
                 {
-                    if (preTrDom) preTrDom.classList.add("border");
+                    var trSeparator=document.createElement("tr");
+                    trSeparator.className='UMyChart_MenuItem_Tr_Separator';
+                    var tdDom=document.createElement("td");
+                    tdDom.className="UMyChart_MenuItem_Td_Status_Separator";
+                    trSeparator.appendChild(tdDom);
+                    var tdDom=document.createElement("td");
+                    tdDom.className="UMyChart_MenuItem_Td_Separator";
+                    trSeparator.appendChild(tdDom);
+                    var tdDom=document.createElement("td");
+                    tdDom.className="UMyChart_MenuItem_Td_Separator";
+                    trSeparator.appendChild(tdDom);
+                    var tdDom=document.createElement("td");
+                    tdDom.className="UMyChart_MenuItem_Td_Separator";
+                    trSeparator.appendChild(tdDom);
+                    subTbody.appendChild(trSeparator);
                     continue;
                 }
                 
@@ -192,11 +209,40 @@ function JSPopMenu()
         if (!this.RootDOM) return;  
         if (!IFrameSplitOperator.IsNumber(x) || !IFrameSplitOperator.IsNumber(y)) return;
 
+        //菜单在当前屏幕无法显示需要调整
+        var menuHeight=this.RootDOM.offsetHeight;
+        var yMenuBottom=y+menuHeight;
+        var yBottom=window.innerHeight-15;
+        if (yMenuBottom>yBottom) y=yBottom-menuHeight;
+
+        var menuWidth=this.RootDOM.offsetWidth;
+        var yMenuRight=x+menuWidth;
+        var yRight=window.innerWidth-15;
+        if (yMenuRight>yRight) x=yRight-menuWidth;
+
         this.RootDOM.style.visibility='visible';
         this.RootDOM.style.top = y + "px";
         this.RootDOM.style.left = x + "px";
     }
 
+    //下拉菜单
+    this.PopupMenuByDrapdown=function(rtButton)
+    {
+        if (!this.RootDOM) return;  
+        if (!rtButton) return;
+
+        var xLeft=rtButton.Left;
+        var yTop=rtButton.Bottom;
+        var menuHeight=this.RootDOM.offsetHeight;
+        var yMenuBottom=yTop+menuHeight;
+        var yBottom=window.innerHeight-15;
+        if (yMenuBottom>yBottom) yTop=rtButton.Top-menuHeight;
+
+        this.RootDOM.style.visibility='visible';
+        this.RootDOM.style.top = yTop + "px";
+        this.RootDOM.style.left = xLeft + "px";
+    }
+
     this.OnClickMenu=function(e, item, bSubMenu)
     {
         console.log("[JSPopMenu::OnClickMenu] e=, item=, bSubMenu", e, item, bSubMenu);
@@ -210,6 +256,8 @@ function JSPopMenu()
         if (parentItem && parentItem.PopMenu && parentItem.PopMenu!=subMenu) 
         {
             parentItem.PopMenu.style.visibility="hidden";
+            if (parentItem.PopRow) parentItem.PopRow.classList.remove(this.SelectedClassName);
+
             parentItem.PopMenu=null;
             parentItem.PopRow=null;
         }
@@ -223,8 +271,23 @@ function JSPopMenu()
             else
             {
                 var rtParent=trDom.getBoundingClientRect();
-                subMenu.style.left=`${rtParent.right}px`;
-                subMenu.style.top=`${rtParent.top}px`;
+                var x=rtParent.right, y=rtParent.top;
+
+                //菜单在当前屏幕无法显示需要调整
+                var yBottom=window.innerHeight-15;
+                var yRight=window.innerWidth-15;
+                var menuHeight=subMenu.offsetHeight;
+                var menuWidth=subMenu.offsetWidth;
+                var yMenuBottom=y+menuHeight;
+                var yMenuRight=x+menuWidth;
+
+                if (yMenuBottom>yBottom) y=yBottom-menuHeight;
+                if (yMenuRight>yRight) x=rtParent.left-menuWidth;
+
+                subMenu.style.left=`${x}px`;
+                subMenu.style.top=`${y}px`;
+
+                trDom.classList.add(this.SelectedClassName);
 
                 /*
                 if (this.Data.Position==JSPopMenu.POSITION_ID.TAB_MENU_ID)

package/src/jscommon/umychart.resource/css/tools.css

@@ -1194,3 +1194,138 @@ input[type="color"] {
 .subtool-del{
     position: relative;
 }
+
+
+
+
+
+/*
+    Copyright (c) 2018 jones
+ 
+    http://www.apache.org/licenses/LICENSE-2.0
+
+   开源项目 https://github.com/jones2000/HQChart
+ 
+   jones_2000@163.com
+
+   右键菜单
+*/
+.UMyChart_PopMenu {
+    position: absolute;
+    z-index: 500;
+    border: 1px solid;
+    border-color:rgb(116, 112, 112);
+    background-color: #fff;
+    visibility:hidden;
+    font-size: 12px;
+    font-family: "微软雅黑";
+    cursor: default;
+    padding: 2px;
+    
+}
+
+.UMyChart_PopMenu_Table
+{
+    border-collapse: collapse;
+    border-spacing: 2px;
+}
+
+.UMyChart_PopMenu_Tbody 
+{
+    
+}
+
+.UMyChart_MenuItem_Tr
+{
+    display: table-row;
+    height:20px;
+}
+
+.UMyChart_MenuItem_Tr_Separator
+{
+    height:5px;   
+}
+
+.UMyChart_MenuItem_Td_Separator
+{
+    border-top:1px solid;
+    border-color:rgb(116, 112, 112);
+}
+
+.UMyChart_MenuItem_Td_Status_Separator 
+{
+    height:5px;
+    background: rgb(204,204,204);
+}
+
+.UMyChart_MenuItem_Tr_Selected
+{
+    background: rgb(172,172,221);
+    border:0px solid;
+}
+
+.UMyChart_MenuItem_Td_Status 
+{
+    width: 23px;
+    background: rgb(204,204,204);
+}
+
+.UMyChart_MenuItem_Td_Shortcut {
+    width: 60px;
+    text-align:right;
+}
+
+.UMyChart_MenuItem_Td_Content
+{
+    padding-left: 5px;
+    text-align:left;
+}
+
+.UMyChart_MenuItem_Td_Arrow
+{
+    width: 25px;
+    text-align:right;
+    margin-right: 10px;
+}
+
+
+.UMyChart_MenuItem_Tr:hover
+{
+    background: rgb(172,172,221);
+}
+
+.UMyChart_PopSubMenu{
+    position: absolute;
+    left: 99px;
+    top: 0;
+    border: 1px solid;
+    border-color:rgb(116, 112, 112);
+    background-color: #fff;
+    visibility:hidden;
+    z-index: 501;
+    font-size: 12px;
+    font-family: "微软雅黑";
+    cursor: default;
+    padding: 2px;
+}
+
+.UMyChart_MenuItem_Span_Checked
+{
+    color:rgb(0,0,0);
+    font-size: 10px;
+    margin-left: 5px;
+    text-align:left;
+}
+
+.UMyChart_MenuItem_Span_Arrow
+{
+    color:rgb(0,0,0);
+    font-size: 10px;
+    text-align:right;
+}
+
+
+
+
+
+

package/src/jscommon/umychart.resource/css/umychart.popmenu.css

@@ -1,6 +1,14 @@
+/*
+    Copyright (c) 2018 jones
+ 
+    http://www.apache.org/licenses/LICENSE-2.0
 
+   开源项目 https://github.com/jones2000/HQChart
+ 
+   jones_2000@163.com
 
-/*右键菜单*/
+   右键菜单
+*/
 .UMyChart_PopMenu {
     position: absolute;
     z-index: 500;
@@ -11,6 +19,8 @@
     font-size: 12px;
     font-family: "微软雅黑";
     cursor: default;
+    padding: 2px;
+    
 }
 
 .UMyChart_PopMenu_Table
@@ -19,7 +29,8 @@
     border-spacing: 2px;
 }
 
-.UMyChart_PopMenu_Tbody {
+.UMyChart_PopMenu_Tbody 
+{
     
 }
 
@@ -29,9 +40,33 @@
     height:20px;
 }
 
-.UMyChart_MenuItem_Td_Status {
-    width: 25px;
-    
+.UMyChart_MenuItem_Tr_Separator
+{
+    height:5px;   
+}
+
+.UMyChart_MenuItem_Td_Separator
+{
+    border-top:1px solid;
+    border-color:rgb(116, 112, 112);
+}
+
+.UMyChart_MenuItem_Td_Status_Separator 
+{
+    height:5px;
+    background: rgb(204,204,204);
+}
+
+.UMyChart_MenuItem_Tr_Selected
+{
+    background: rgb(172,172,221);
+    border:0px solid;
+}
+
+.UMyChart_MenuItem_Td_Status 
+{
+    width: 23px;
+    background: rgb(204,204,204);
 }
 
 .UMyChart_MenuItem_Td_Shortcut {
@@ -41,7 +76,7 @@
 
 .UMyChart_MenuItem_Td_Content
 {
-    margin-left: 3px;
+    padding-left: 5px;
     text-align:left;
 }
 
@@ -56,8 +91,6 @@
 .UMyChart_MenuItem_Tr:hover
 {
     background: rgb(172,172,221);
-    border:1px solid;
-    border-color:rgb(0, 120, 215);
 }
 
 .UMyChart_PopSubMenu{
@@ -72,11 +105,12 @@
     font-size: 12px;
     font-family: "微软雅黑";
     cursor: default;
+    padding: 2px;
 }
 
 .UMyChart_MenuItem_Span_Checked
 {
-    color:rgb(105,105,105);
+    color:rgb(0,0,0);
     font-size: 10px;
     margin-left: 5px;
     text-align:left;
@@ -84,9 +118,12 @@
 
 .UMyChart_MenuItem_Span_Arrow
 {
-    color:rgb(105,105,105);
+    color:rgb(0,0,0);
     font-size: 10px;
     text-align:right;
 }
 
 
+
+
+