楼盘表左侧树结构和右键菜单完善

@@ -95,23 +95,27 @@ export default {
 		},
 		},
 		// 右键点击事件
 		// 右键点击事件
 		openMenu(e, item) {
 		openMenu(e, item) {
-			if (item.zdbsm) {
-				var x = e.pageX;
-				var y = e.pageY;
+			this.$emit("changeTop", e.pageY);
+			this.$emit("changeLeft", e.pageX);
+			this.$emit("changeZdData",item);
+			switch (item.type) {
+				case 'zd':
 					this.$emit("changeIsZD", true);
 					this.$emit("changeIsZD", true);
-				this.$emit("changeTop", y);
-				this.$emit("changeLeft", x);
 					this.$emit("changeVisible", true);
 					this.$emit("changeVisible", true);
-				this.$emit("changeZdData",item);
-			} else if (item.zrzbsm) {
-				var x = e.pageX;
-				var y = e.pageY;
+					break;
+				case 'zrz':
 					this.$emit("changeIsZD", false);
 					this.$emit("changeIsZD", false);
-				this.$emit("changeTop", y);
-				this.$emit("changeLeft", x);
 					this.$emit("changeVisible", true);
 					this.$emit("changeVisible", true);
-			} else {
-				return;
+					break;
+				case 'zdy':
+					this.$emit("changeLpbVisible", true);
+					break;
+				case 'ljz':
+					this.$emit("changeLpbVisible", true);
+					break;
+			
+				default:
+					break;
 			}
 			}
 		},
 		},
 		// 左键双击事件
 		// 左键双击事件

@@ -14,7 +14,6 @@
 				:class="{
 				:class="{
 					active_color: item.expand && item.children.length > 0,
 					active_color: item.expand && item.children.length > 0,
 				}"
 				}"
-				@contextmenu.prevent="openMenu($event, item)"
 				@click="itemClick(item)"
 				@click="itemClick(item)"
 			>
 			>
 				<div
 				<div
@@ -29,7 +28,7 @@
 						reTree_expand_icon: !item.expand && item.children.length > 0,
 						reTree_expand_icon: !item.expand && item.children.length > 0,
 					}"
 					}"
 				></div>                         
 				></div>                         
-				<div class="layer_text nowrap">{{ item.mc }}</div>
+				<div class="layer_text nowrap" @contextmenu.prevent="openMenu($event, item)">{{ item.mc }}</div>
 			</div>
 			</div>
 
 
 			<lineItem
 			<lineItem
@@ -39,6 +38,7 @@
 				@changeZdData="changeZdData"
 				@changeZdData="changeZdData"
 				@changeLeft="changeLeft"
 				@changeLeft="changeLeft"
 				@changeVisible="changeVisible"
 				@changeVisible="changeVisible"
+				@changeLpbVisible="changeLpbVisible"
 				@changeIsZD="changeIsZD"
 				@changeIsZD="changeIsZD"
 				:list="item.children"
 				:list="item.children"
 				:visible="visible"
 				:visible="visible"
@@ -61,6 +61,15 @@
 			<li v-show="isZD" @click="openCreateDialog">添加定着物</li>
 			<li v-show="isZD" @click="openCreateDialog">添加定着物</li>
 			<li @click="deleteByBsm()">删除</li>
 			<li @click="deleteByBsm()">删除</li>
 		</ul>
 		</ul>
+		<ul
+			v-show="lpbvisible"
+			:style="{ left: lpbleft + 'px', top: lpbtop + 'px' }"
+			class="contextmenu"
+		>
+			<li v-show="zdData.type == 'zrz'" @click="openLpbDialog">添加逻辑幢</li>
+			<li v-show="zdData.type == 'zrz' || zdData.type == 'ljz'" @click="openLpbDialog">添加幢单元</li>
+			<li @click="openLpbDialog">添加层户</li>
+		</ul>
 		<!-- 添加定着物弹框 -->
 		<!-- 添加定着物弹框 -->
 		<el-dialog title="新建" :visible.sync="dialogVisible" width="40%">
 		<el-dialog title="新建" :visible.sync="dialogVisible" width="40%">
 			<Create @closeDialog="closeDialog" :auth="true"></Create>
 			<Create @closeDialog="closeDialog" :auth="true"></Create>
@@ -95,7 +104,11 @@ export default {
 			left: 0,
 			left: 0,
 			isZD: true,
 			isZD: true,
 			zdData:{},
 			zdData:{},
-			dialogVisible:false
+			dialogVisible:false,
+			//控制楼盘表
+			lpbvisible: false,
+			lpbtop: 0,
+			lpbleft: 0,
 		};
 		};
 	},
 	},
 	watch: {
 	watch: {
@@ -103,6 +116,14 @@ export default {
 			this.formatData = this.preDealData(n);
 			this.formatData = this.preDealData(n);
 			console.log(this.formatData);
 			console.log(this.formatData);
 		},
 		},
+		
+		lpbvisible(value) {
+			if (value) {
+				document.body.addEventListener("click", this.closeMenu);
+			} else {
+				document.body.removeEventListener("click", this.closeMenu);
+			}
+		}
 	},
 	},
 	created() {
 	created() {
 		console.log("lineTree create");
 		console.log("lineTree create");
@@ -120,13 +141,19 @@ export default {
 		},
 		},
 		changeTop(data) {
 		changeTop(data) {
 			this.top = data;
 			this.top = data;
+			this.lpbtop = data;
 		},
 		},
 		changeLeft(data) {
 		changeLeft(data) {
 			this.left = data;
 			this.left = data;
+			this.lpbleft = data;
 		},
 		},
 		changeIsZD(data) {
 		changeIsZD(data) {
 			this.isZD = data;
 			this.isZD = data;
 		},
 		},
+		changeLpbVisible(data) {
+			console.log(this.zdData,'zdData');
+			this.lpbvisible = data;
+		},
 		//添加定着物
 		//添加定着物
 		openCreateDialog(){
 		openCreateDialog(){
 			this.dialogVisible = true
 			this.dialogVisible = true
@@ -176,17 +203,28 @@ export default {
 		},
 		},
 		//自然幢右键点击事件
 		//自然幢右键点击事件
 		openMenu(e,item){
 		openMenu(e,item){
-			console.log(e);
-			console.log(item);
+			this.lpbleft = e.pageX;
+			this.lpbtop = e.pageY;
+			this.zdData = item;
+			this.changeLpbVisible(true);
+		},
+		//关闭自然幢右击菜单
+		closeMenu(){
+			this.lpbvisible = false
+		},
+		//楼盘表右键菜单项打开父组件弹框
+		openLpbDialog(){
+			this.$parent.openLpbDialog(this.zdData);	
 		},
 		},
 		detailDoubleClick(data) {
 		detailDoubleClick(data) {
 			clearTimeout(this.timer);
 			clearTimeout(this.timer);
 			this.selectedDetail = data;
 			this.selectedDetail = data;
 			this.$emit("detailDoubleClick", data);
 			this.$emit("detailDoubleClick", data);
 		},
 		},
+		//右键菜单的删除
 		deleteByBsm(){
 		deleteByBsm(){
-			var zdBsm = this.zdData.zdbsm;
-			var type;
+			let zdBsm = this.zdData.zdbsm;
+			let type;
 			console.log(zdBsm);
 			console.log(zdBsm);
 			switch (this.zdData.type){
 			switch (this.zdData.type){
 				case "zd":
 				case "zd":
@@ -201,7 +239,7 @@ export default {
 				default:
 				default:
 					break;
 					break;
 			}
 			}
-			var params={"id":zdBsm,"type":type}
+			let params={"id":zdBsm,"type":type}
 			deleteZdInfoByBsm(params)
 			deleteZdInfoByBsm(params)
 				.then((res) => {
 				.then((res) => {
 					if(res.code=200){
 					if(res.code=200){

@@ -50,6 +50,7 @@ export default {
 		width: 100%;
 		width: 100%;
 		height: 100%;
 		height: 100%;
 		flex:1;
 		flex:1;
+		position: unset;
 	}
 	}
 	.el-tab-pane{
 	.el-tab-pane{
 		width: 100%;
 		width: 100%;

@@ -21,7 +21,7 @@
       <div class="tab-content">
       <div class="tab-content">
           <div class="lp-tree" :class="createFlag ? 'w260':'w0'">
           <div class="lp-tree" :class="createFlag ? 'w260':'w0'">
             <LineTree :pd="pd" class="treeData" :islpb = "islpb" ></LineTree>
             <LineTree :pd="pd" class="treeData" :islpb = "islpb" ></LineTree>
-            <p @click="createFlag = false" style="width:20px;position:absolute;top:0;right:0;cursor:pointer;">X</p> 
+            <p @click="createFlag = false" style="width:20px;float:left;cursor:pointer;">X</p> 
           </div>
           </div>
           <div class="lp-overview">
           <div class="lp-overview">
               楼盘单元格
               楼盘单元格
@@ -30,6 +30,15 @@
               楼盘图例
               楼盘图例
           </div>
           </div>
       </div>
       </div>
+      
+		<el-dialog
+			title="添加"
+			:visible.sync="dialogVisible"
+			width="50%"
+			center
+		>
+        添加
+		</el-dialog>
   </div>
   </div>
 </template>
 </template>
 
 
@@ -48,6 +57,7 @@ export default {
         bdcdyh:'',
         bdcdyh:'',
         islpb:true,
         islpb:true,
         pd:[], //创建楼盘的树结构数据
         pd:[], //创建楼盘的树结构数据
+        dialogVisible:false
     }
     }
   },
   },
   created(){},
   created(){},
@@ -67,6 +77,11 @@ export default {
 				})
 				})
 				.catch((error) => {});
 				.catch((error) => {});
       },
       },
+      //打开新建楼盘树结构右键菜单唤起的弹框
+      openLpbDialog(data){
+          console.log(data,'data');
+          this.dialogVisible = true
+      }
   },
   },
   computed: {},
   computed: {},
   watch: {
   watch: {
@@ -112,10 +127,11 @@ export default {
         .lp-tree{
         .lp-tree{
             overflow: hidden;
             overflow: hidden;
             transition: .5s;
             transition: .5s;
-            position: relative;
+            // position: relative;
             .treeData{
             .treeData{
                 margin-top: 20px;
                 margin-top: 20px;
                 margin-left: 20px;
                 margin-left: 20px;
+                float: left;
             }
             }
         }
         }
         .w0{
         .w0{