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