<template>
|
<div class="menuBox">
|
<div class="" v-if="list.length == 0 && val == null"></div>
|
<div class="boxContent" v-else-if="list.length == 0">
|
<div class="close" @click.stop="closelist"></div>
|
{{ val }}
|
暂未搜索到相关数据
|
</div>
|
<ul class="boxContent" v-if="list.length != 0">
|
<div class="close" @click.stop="closelist"></div>
|
<div class="listContent">
|
<li v-for="(item, index) in list" :key="index">
|
<div>
|
{{ item.name }}
|
</div>
|
<div v-if="item.address">地址： {{ item.address }}</div>
|
<div v-if="item.code">地块编号： {{ item.code }}</div>
|
</li>
|
</div>
|
</ul>
|
</div>
|
</template>
|
|
<script>
|
import store from "@/utils/store";
|
import rpc from "@/assets/js/rpc";
|
import vueEvents from "@/utils/vueEvent.js";
|
export default {
|
data() {
|
return {
|
list: [],
|
val: null,
|
};
|
},
|
mounted() {
|
vueEvents.$on("queryData", (res) => {
|
this.list = [];
|
this.val = null;
|
if (res) {
|
if (store.queryLayer.data) {
|
this.list = store.queryLayer.data;
|
}
|
this.val = store.queryLayer.val;
|
}
|
});
|
},
|
methods: {
|
closelist() {
|
vueEvents.$emit("queryData", false);
|
rpc.setClearAllMsg();
|
|
store.queryLayer.data = [];
|
},
|
},
|
};
|
</script>
|
|
<style scoped>
|
.menuBox {
|
border-radius: 3px;
|
background-image: url("~@/assets/img/new/listbg.png");
|
background-size: 100% 100%;
|
position: absolute;
|
z-index: 30;
|
bottom: 130px;
|
right: 70px;
|
width: 300px;
|
color: white;
|
font-family: Source Han Sans SC;
|
font-size: 16px;
|
}
|
.close {
|
pointer-events: all;
|
width: 28px;
|
height: 28px;
|
background-repeat: no-repeat;
|
background-size: 100% 100%;
|
background-image: url("../poplayer/img/close.png");
|
cursor: pointer;
|
margin-top: 5px;
|
margin-right: 5px;
|
}
|
.menuBox .boxContent {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
align-items: flex-end;
|
}
|
.listContent {
|
width: 100%;
|
}
|
.menuBox li {
|
/* width: 100%; */
|
padding: 10px;
|
border: 1px solid gray;
|
margin-top: 2px;
|
}
|
</style>
|
