dai
3 years ago
43 changed files with 962 additions and 661 deletions
@ -0,0 +1,243 @@ |
|||
<template> |
|||
<div class=""> |
|||
<resi-info |
|||
v-if="showedResiInfo && currentResiId" |
|||
:resi-id="currentResiId" |
|||
@close="showedResiInfo = false" |
|||
/> |
|||
|
|||
<house-info |
|||
v-if="showedHouseInfo && currentHouseId" |
|||
:house-id="currentHouseId" |
|||
@close="showedHouseInfo = false" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import resiInfo from "@/views/modules/cpts/resi/info"; |
|||
import houseInfo from "@/views/modules/cpts/house/info"; |
|||
|
|||
export default { |
|||
components: { |
|||
resiInfo, |
|||
houseInfo, |
|||
}, |
|||
|
|||
props: {}, |
|||
|
|||
data() { |
|||
return { |
|||
// 显示人员详情 |
|||
showedResiInfo: false, |
|||
currentResiId: "", |
|||
|
|||
// 显示人员详情 |
|||
showedHouseInfo: false, |
|||
currentHouseId: "", |
|||
}; |
|||
}, |
|||
|
|||
computed: {}, |
|||
|
|||
watch: {}, |
|||
|
|||
mounted() { |
|||
console.log("mounted=========== 方便调用人房详情"); |
|||
}, |
|||
|
|||
methods: { |
|||
async showResiInfo(resiId) { |
|||
this.currentResiId = resiId; |
|||
await nextTick(); |
|||
this.showedResiInfo = true; |
|||
}, |
|||
|
|||
async showHouseInfo(id) { |
|||
this.currentHouseId = id; |
|||
await nextTick(); |
|||
this.showedHouseInfo = true; |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
|
|||
.m-box { |
|||
position: relative; |
|||
padding: 24px 16px; |
|||
background: #ffffff; |
|||
box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.08), |
|||
0px 3px 6px -4px rgba(0, 0, 0, 0.12); |
|||
border-radius: 2px; |
|||
} |
|||
|
|||
.m-dialog { |
|||
.el-dialog__body { |
|||
position: relative; |
|||
max-height: 83vh; |
|||
box-sizing: border-box; |
|||
padding: 0 0 20px !important; |
|||
.dialog-h-content { |
|||
max-height: calc(83vh - 80px); |
|||
box-sizing: border-box; |
|||
padding: 50px 80px; |
|||
overflow: auto; |
|||
} |
|||
} |
|||
|
|||
.resi-btns { |
|||
margin-top: 20px; |
|||
text-align: center; |
|||
text-align: right; |
|||
margin-right: 16px; |
|||
} |
|||
} |
|||
|
|||
.m-search { |
|||
box-sizing: border-box; |
|||
padding: 40px 80px; |
|||
margin-bottom: 16px; |
|||
background-size: 100%; |
|||
|
|||
.title { |
|||
height: 47px; |
|||
font-size: 32px; |
|||
font-family: SourceHanSansSC-Medium, SourceHanSansSC; |
|||
font-weight: 500; |
|||
color: #0056d6; |
|||
line-height: 47px; |
|||
text-align: center; |
|||
} |
|||
|
|||
.tabs { |
|||
width: 692px; |
|||
margin: 24px auto 0; |
|||
display: flex; |
|||
align-items: center; |
|||
> div { |
|||
position: relative; |
|||
margin-right: 30px; |
|||
width: 56px; |
|||
height: 24px; |
|||
font-size: 14px; |
|||
line-height: 24px; |
|||
border-radius: 2px; |
|||
color: #0056d6; |
|||
text-align: center; |
|||
cursor: pointer; |
|||
&.z-on { |
|||
color: #ffffff; |
|||
background: #0056d6; |
|||
&::after { |
|||
content: ""; |
|||
display: block; |
|||
position: absolute; |
|||
bottom: -10px; |
|||
left: 0; |
|||
right: 0; |
|||
margin: 0 auto; |
|||
width: 0; |
|||
height: 0; |
|||
border: 5px solid transparent; |
|||
border-top: 5px solid #0056d6; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.search { |
|||
width: 692px; |
|||
margin: 15px auto 0; |
|||
display: flex; |
|||
align-items: center; |
|||
|
|||
.search-input { |
|||
position: relative; |
|||
width: 560px; |
|||
height: 48px; |
|||
background: #ffffff; |
|||
border-radius: 4px; |
|||
border: 1px solid #0056d6; |
|||
display: flex; |
|||
|
|||
.input { |
|||
position: relative; |
|||
width: calc(100% - 100px); |
|||
|
|||
input { |
|||
margin-left: 20px; |
|||
width: calc(100% - 10px); |
|||
border: none; |
|||
height: 44px; |
|||
line-height: 44px; |
|||
font-family: "思源宋体"; |
|||
font-size: 16px; |
|||
font-weight: 400; |
|||
color: #333; |
|||
} |
|||
|
|||
.close-btn { |
|||
position: absolute; |
|||
right: 0; |
|||
top: 0; |
|||
bottom: 0; |
|||
margin: auto 0; |
|||
width: 18px; |
|||
height: 18px; |
|||
background-color: #eee; |
|||
border-radius: 100%; |
|||
cursor: pointer; |
|||
|
|||
img { |
|||
display: block; |
|||
margin: 4px auto; |
|||
width: 10px; |
|||
height: 10px; |
|||
opacity: 0.3; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.btn { |
|||
margin: 7px 9px 0 auto; |
|||
line-height: 32px; |
|||
width: 66px; |
|||
height: 32px; |
|||
background: #0056d6; |
|||
border-radius: 2px; |
|||
text-align: center; |
|||
font-size: 15px; |
|||
font-family: Source Han Serif CN; |
|||
font-weight: 500; |
|||
color: #ffffff; |
|||
color: #ffffff; |
|||
cursor: pointer; |
|||
} |
|||
} |
|||
|
|||
.btn2 { |
|||
margin-left: 35px; |
|||
width: 100px; |
|||
height: 39px; |
|||
line-height: 39px; |
|||
border-radius: 6px; |
|||
text-align: center; |
|||
font-size: 16px; |
|||
font-family: Source Han Serif CN; |
|||
font-weight: 500; |
|||
color: #0056d6; |
|||
cursor: pointer; |
|||
img { |
|||
width: 20px; |
|||
height: 20px; |
|||
margin-right: 8px; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,58 @@ |
|||
<template> |
|||
<el-dialog |
|||
visible |
|||
title="房屋详情" |
|||
width="820px" |
|||
top="5vh" |
|||
append-to-body |
|||
class="m-dialog" |
|||
:close-on-click-modal="false" |
|||
:before-close="close" |
|||
> |
|||
<house-info |
|||
ref="houseInfo" |
|||
@diaDetailClose="close" |
|||
:view_real_data="true" |
|||
:house-id="houseId" |
|||
/> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import houseInfo from "@/views/modules/base/community/roomDetail"; |
|||
|
|||
export default { |
|||
props: { |
|||
houseId: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
}, |
|||
components: { |
|||
houseInfo, |
|||
}, |
|||
data() { |
|||
return {}; |
|||
}, |
|||
mounted() { |
|||
console.log("mounted ============房屋详情挂载"); |
|||
this.$nextTick(() => { |
|||
this.ini(); |
|||
}); |
|||
}, |
|||
methods: { |
|||
ini() { |
|||
this.$refs.houseInfo.initForm({ houseId: this.houseId }); |
|||
}, |
|||
|
|||
close() { |
|||
this.$emit("close"); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.m-dialog { |
|||
} |
|||
</style> |
|||
@ -0,0 +1,73 @@ |
|||
<template> |
|||
<el-dialog |
|||
visible |
|||
title="居民详情" |
|||
width="986px" |
|||
top="5vh" |
|||
append-to-body |
|||
class="m-dialog" |
|||
:close-on-click-modal="false" |
|||
:before-close="close" |
|||
> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<resi-info ref="resiInfo" :fixed="true" :resi-id="resiId" /> |
|||
</div> |
|||
|
|||
<div class="resi-btns"> |
|||
<el-button size="small" @click="close" class="diy-button--common" |
|||
>关闭</el-button |
|||
> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import resiInfo from "@/views/components/resiInfo"; |
|||
|
|||
export default { |
|||
props: { |
|||
resiId: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
}, |
|||
components: { |
|||
resiInfo, |
|||
}, |
|||
data() { |
|||
return {}; |
|||
}, |
|||
mounted() { |
|||
console.log("============"); |
|||
}, |
|||
methods: { |
|||
close() { |
|||
this.$emit("close"); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.m-dialog { |
|||
.el-dialog__body { |
|||
position: relative; |
|||
max-height: 83vh; |
|||
box-sizing: border-box; |
|||
padding: 0 0 20px !important; |
|||
.dialog-h-content { |
|||
max-height: calc(83vh - 80px); |
|||
box-sizing: border-box; |
|||
padding: 50px 80px; |
|||
overflow: auto; |
|||
} |
|||
} |
|||
|
|||
.resi-btns { |
|||
margin-top: 20px; |
|||
text-align: center; |
|||
text-align: right; |
|||
margin-right: 16px; |
|||
} |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue