Browse Source

'隐藏右键菜单'

zhangyu 4 years ago
parent
commit
408e739a56

+ 19 - 2
src/components/baseEditer.vue

@@ -4,6 +4,7 @@
     <div class="canvas-container">
       <canvas id="canvas" :width="canvasWidth" :height="canvasHeight" ref="canvas" tabindex="0"></canvas>
     </div>
+    <menuList :style="menuStyle"></menuList>
   </div>
 </template>
 <script>
@@ -25,7 +26,8 @@ import { SImageLegendItem } from "@/lib/items/SImageLegendItem";
 import store from "../store";
 import { Loading } from "element-ui";
 import { Message } from "element-ui";
-import { SCircleItem } from "@/lib/items/SCircleItem"
+import { SCircleItem } from "@/lib/items/SCircleItem";
+import menuList from "@/components/edit/menu_list.vue";
 window.FENGMAP = null;
 //// 底图空间增加字段 isExtracted:boolean true 已被提取过
 export default {
@@ -41,6 +43,9 @@ export default {
       required: false
     }
   },
+  components: {
+    menuList
+  },
   data() {
     return {
       appName: "万达可视化系统",
@@ -59,7 +64,11 @@ export default {
       graphId: "",
       initScale: 1, //加载好底图之后的,初始缩放比例
       changeScaleByClick: false, //区分 滚轮,点击 事件改变的缩放比例
-      autoSave: null
+      autoSave: null,
+      menuStyle: {
+        top: 0,
+        left: 0
+      }
     };
   },
   mounted() {
@@ -755,6 +764,14 @@ export default {
     }
   },
   created() {
+    // // 禁用鼠标右键菜单
+    // window.oncontextmenu=(e) => {
+    //   console.log("#############",e);
+    //   this.menuStyle.top = `${e.clientY}px`
+    //   this.menuStyle.left = `${e.clientX}px`
+    //     //取消默认的浏览器自带右键 很重要!!
+    //     e.preventDefault();
+    // }
     const href = window.location.href;
     // 路由
     // const route = href.split("?")[0];

+ 64 - 0
src/components/edit/menu_list.vue

@@ -0,0 +1,64 @@
+<!--
+ * @Author: zhangyu
+ * @Date: 2020-07-23 16:27:38
+ * @Info: 
+ * @LastEditTime: 2020-07-23 17:28:34
+--> 
+<template>
+  <ul class="menu_list_box">
+    <li title="七月最强新番">七月最强新番</li>
+    <li title="Re:从零开始的异世界生活">Re:从零开始的异世界生活</li>
+    <li title="然而我却连个二十多天上班没休息了">然而我却连个二十多天上班没休息了</li>
+  </ul>
+</template>
+<script>
+export default {
+  computed: {
+
+  },
+  data() {
+    return {
+      
+    };
+  },
+  mounted() {
+    console.log("右侧列表********************")
+  },
+  methods: {
+    
+  },
+  watch: {
+    
+  }
+};
+</script>
+<style lang="less" scoped>
+  .menu_list_box {
+    display: none;
+    width: 200px;
+    position: fixed;
+    padding: 10px 0;
+    margin: 5px 0;
+    background-color: #fff;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
+    li {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      list-style: none;
+      line-height: 36px;
+      padding: 0 20px;
+      margin: 0;
+      font-size: 14px;
+      color: #606266;
+      cursor: pointer;
+      outline: none;
+    }
+    li:hover {
+      background-color: #ecf5ff;
+      color: #66b1ff;
+    }
+  }
+</style>

+ 2 - 0
src/lib/items/SImageLegendItem.ts

@@ -5,6 +5,8 @@ import { Legend } from '../types/Legend';
 import { ItemOrder, SItemStatus } from '@saga-web/big/lib';
 import { SFont, SColor, SPainter, SRect } from '@saga-web/draw/lib';
 import { uuid } from '@/components/mapClass/until';
+import { SMouseEvent } from '@saga-web/base/lib';
+
 /**
  * 图例节点Item(图标类型)
  *