9274d1a1 by 杨威

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

1 parent 287254e7
......@@ -95,23 +95,27 @@ export default {
},
// 右键点击事件
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("changeTop", y);
this.$emit("changeLeft", x);
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("changeTop", y);
this.$emit("changeLeft", x);
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="{
active_color: item.expand && item.children.length > 0,
}"
@contextmenu.prevent="openMenu($event, item)"
@click="itemClick(item)"
>
<div
......@@ -29,7 +28,7 @@
reTree_expand_icon: !item.expand && item.children.length > 0,
}"
></div>
<div class="layer_text nowrap">{{ item.mc }}</div>
<div class="layer_text nowrap" @contextmenu.prevent="openMenu($event, item)">{{ item.mc }}</div>
</div>
<lineItem
......@@ -39,6 +38,7 @@
@changeZdData="changeZdData"
@changeLeft="changeLeft"
@changeVisible="changeVisible"
@changeLpbVisible="changeLpbVisible"
@changeIsZD="changeIsZD"
:list="item.children"
:visible="visible"
......@@ -61,6 +61,15 @@
<li v-show="isZD" @click="openCreateDialog">添加定着物</li>
<li @click="deleteByBsm()">删除</li>
</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%">
<Create @closeDialog="closeDialog" :auth="true"></Create>
......@@ -95,7 +104,11 @@ export default {
left: 0,
isZD: true,
zdData:{},
dialogVisible:false
dialogVisible:false,
//控制楼盘表
lpbvisible: false,
lpbtop: 0,
lpbleft: 0,
};
},
watch: {
......@@ -103,6 +116,14 @@ export default {
this.formatData = this.preDealData(n);
console.log(this.formatData);
},
lpbvisible(value) {
if (value) {
document.body.addEventListener("click", this.closeMenu);
} else {
document.body.removeEventListener("click", this.closeMenu);
}
}
},
created() {
console.log("lineTree create");
......@@ -120,13 +141,19 @@ export default {
},
changeTop(data) {
this.top = data;
this.lpbtop = data;
},
changeLeft(data) {
this.left = data;
this.lpbleft = data;
},
changeIsZD(data) {
this.isZD = data;
},
changeLpbVisible(data) {
console.log(this.zdData,'zdData');
this.lpbvisible = data;
},
//添加定着物
openCreateDialog(){
this.dialogVisible = true
......@@ -176,17 +203,28 @@ export default {
},
//自然幢右键点击事件
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) {
clearTimeout(this.timer);
this.selectedDetail = data;
this.$emit("detailDoubleClick", data);
},
//右键菜单的删除
deleteByBsm(){
var zdBsm = this.zdData.zdbsm;
var type;
let zdBsm = this.zdData.zdbsm;
let type;
console.log(zdBsm);
switch (this.zdData.type){
case "zd":
......@@ -201,7 +239,7 @@ export default {
default:
break;
}
var params={"id":zdBsm,"type":type}
let params={"id":zdBsm,"type":type}
deleteZdInfoByBsm(params)
.then((res) => {
if(res.code=200){
......
......@@ -50,6 +50,7 @@ export default {
width: 100%;
height: 100%;
flex:1;
position: unset;
}
.el-tab-pane{
width: 100%;
......
......@@ -21,7 +21,7 @@
<div class="tab-content">
<div class="lp-tree" :class="createFlag ? 'w260':'w0'">
<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 class="lp-overview">
楼盘单元格
......@@ -30,6 +30,15 @@
楼盘图例
</div>
</div>
<el-dialog
title="添加"
:visible.sync="dialogVisible"
width="50%"
center
>
添加
</el-dialog>
</div>
</template>
......@@ -48,6 +57,7 @@ export default {
bdcdyh:'',
islpb:true,
pd:[], //创建楼盘的树结构数据
dialogVisible:false
}
},
created(){},
......@@ -67,6 +77,11 @@ export default {
})
.catch((error) => {});
},
//打开新建楼盘树结构右键菜单唤起的弹框
openLpbDialog(data){
console.log(data,'data');
this.dialogVisible = true
}
},
computed: {},
watch: {
......@@ -112,10 +127,11 @@ export default {
.lp-tree{
overflow: hidden;
transition: .5s;
position: relative;
// position: relative;
.treeData{
margin-top: 20px;
margin-left: 20px;
float: left;
}
}
.w0{
......