XiaoMo/gterFang
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

个人房源

Browse Source
This commit is contained in:
luJianJun
2023-07-25 19:32:50 +08:00
parent fff3c786a8
commit 7e95fd62f8
6 changed files with 151 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
src/components/biserialListItem/biserialListItem.vue
View File

@@ -1,6 +1,8 @@
<template>
<div class="list-item" ref="list" @click="watchInfo">
<div class="authentication-box dis-f al-item" v-if="data && data.data && data.data.verified == 1">
<div class="list-item" ref="list" @click="watchInfo" :class="{'s-w-100':detailShow}">
<img src="../../assets/homeImage/corner.svg" class="detail-tab" v-if="detailShow&&pageType===1" alt="">
<img src="../../assets/homeImage/intermediaryCorner.svg" class="detail-tab" v-if="detailShow&&pageType===2" alt="">
<div class="authentication-box dis-f al-item" v-if="data && data.data && data.data.verified == 1 && !detailShow">
<img src="../../assets/homeImage/authenticationLogo.png" class="logo" alt="">
<img src="../../assets/homeImage/topAuthenticationBg.svg" class="bg" alt="">
<img src="../../assets/homeImage/authenticationText.png" class="text-img" alt="">
@@ -19,17 +21,19 @@
v-if="listData && listData.data && listData.data.type[data && data.data && data.data.type]">
{{ listData && listData.data && listData.data.type[data && data.data && data.data.type] || '' }}
</div>
<div class="tab-item mg-l-8" v-if="data && data.data && data.data.elevator !== -1&&data.data.elevator">
<div class="tab-item mg-l-8"
v-if="data && data.data && data.data.elevator !== -1 && data.data.elevator">
{{ listData && listData.data && listData.data.elevator[data && data.data && data.data.elevator]
||
'' }}
</div>
<div class="tab-item mg-l-8" v-if="data && data.data && data.data.sunshinearea !== -1&&data.data.sunshinearea !== 0&&data.data.sunshinearea">
<div class="tab-item mg-l-8"
v-if="data && data.data && data.data.sunshinearea !== -1 && data.data.sunshinearea !== 0 && data.data.sunshinearea">
{{ listData && listData.data && listData.data.sunshinearea[data && data.data &&
data.data.sunshinearea] || '' }}
</div>
<div class="tab-item mg-l-8"
v-if="listData && listData.data && listData.data.gender[data && data.data && data.data.gender]&&data.data.gender">
v-if="listData && listData.data && listData.data.gender[data && data.data && data.data.gender] && data.data.gender">
{{ listData && listData.data && listData.data.gender[data && data.data && data.data.gender] ||
''
}}
@@ -45,9 +49,9 @@
}}</span>
<span v-if="Array.isArray(data.data.location)">{{
location && location.data && location.data[data && data.data &&
data.data.location && data.data.location[0].substring(0, 1)]
data.data.location && data.data.location[0].substring(0, 1)]
}}>
<span v-for="(item,i) in data.data.location">
<span v-for="(item, i) in data.data.location">
{{ location &&
location.data[item] }}
</span>
@@ -55,8 +59,10 @@
</div>
<div class="price-text dis-f" style="align-items: end;">
<span class="unit">HK$</span>
<span class="price" v-if="!Array.isArray(data && data.data &&data.data.rent)">{{ data && data.data && data.data.rent }}</span>
<span class="price" v-if="Array.isArray(data && data.data &&data.data.rent)">{{ data && data.data && data.data.rent[0] }}~{{ data && data.data && data.data.rent[1] }}</span>
<span class="price" v-if="!Array.isArray(data && data.data && data.data.rent)">{{ data && data.data
&& data.data.rent }}</span>
<span class="price" v-if="Array.isArray(data && data.data && data.data.rent)">{{ data && data.data &&
data.data.rent[0] }}~{{ data && data.data && data.data.rent[1] }}</span>
<span>/月</span>
<span class="time" v-show="data && data.data && data.data.rentalduration != 0">[ 租期{{ data &&
data.data && data.data.rentalduration }}{{
@@ -79,15 +85,21 @@
<img src="../../assets/homeImage/needHousingCorner.svg" v-if="routePath === '/needHousing'" class="tab-img"
alt="">
</div>
<div class="btm-box dis-f al-item">
<img :src="data && data.data && data.data.avatar" class="user-img" alt="">
<span class="user-name">{{ data && data.data && data.data.author }}</span>
<div class="btn" v-if="data && data.data && data.data.isintermediary !== 1 && !data.data.intermediary_text">{{
listData && listData.data && listData.data.intermediary[data && data.data && data.data.intermediary] }}
<div class="btm-box dis-f al-item" :class="{'jus-bet':detailShow}">
<div class="dis-f al-item">
<img :src="data && data.data && data.data.avatar" class="user-img" alt="">
<span class="user-name">{{ data && data.data && data.data.author }}</span>
<div class="btn" v-if="data && data.data && data.data.isintermediary !== 1 && !data.data.intermediary_text">
{{
listData && listData.data && listData.data.intermediary[data && data.data && data.data.intermediary] }}
</div>
<div class="btn" v-if="data && data.data && data.data.isintermediary !== 1 && data.intermediary_text">{{
data &&
data.data.intermediary_text
}}</div>
</div>
<div class="btn" v-if="data && data.data && data.data.isintermediary !== 1 && data.intermediary_text">{{ data &&
data.data.intermediary_text
}}</div>
<img src="../../assets/img/detail/authenticationHousing.png" class="intermediary-tab-img"
v-show="detailShow && data && data.data && data.data.verified == 1" alt="">
<img src="../../assets/homeImage/intermediaryTabImg.png"
v-if="data && data.data && data.data.isintermediary == 1" class="intermediary-tab-img" alt="">
</div>
@@ -103,13 +115,23 @@ let props = defineProps({
type: Object
},
imgLoad: {
type: Function
type: Function,
default: function () {
return () => { }
}
},
listId: {
type: [String, Number]
type: [String, Number],
default: ''
},
detailShow: {
type: Boolean,
default: false
}
})
let data = reactive({ data: {} })
//显示样式
let detailShow = props.detailShow
watchEffect(() => {
data.data = props.item
})
@@ -118,7 +140,7 @@ watchEffect(() => {
let listId = props.listId
let imgRef = null
let loadFinish = () => {
let height = imgRef.ctx.$refs&&imgRef.ctx.$refs.list&&imgRef.ctx.$refs.list.offsetHeight
let height = imgRef.ctx.$refs && imgRef.ctx.$refs.list && imgRef.ctx.$refs.list.offsetHeight
// console.log(data.id, listId, height)
props.imgLoad(data.id, listId, height)
}
@@ -136,19 +158,29 @@ location.data = store.state.indexData && store.state.indexData.config && store.s
let listData = reactive({ data: {} })
listData.data = store.state.indexData && store.state.indexData.config
let pageType=ref('')
//跳转
let router=useRouter()
let watchInfo = ()=>{
let router = useRouter()
let watchInfo = () => {
router.push({
path:'/detail',
query:{
id:data.data.uniqid
path: '/detail',
query: {
id: data.data.uniqid,
type:pageType.value
}
})
}
onMounted(() => {
imgRef = getCurrentInstance()
let {type}=router.currentRoute.value.query
console.log('type',type)
if(type){
pageType.value=type
}else{
pageType.value=routePath.value==='/personHousing'?1:routePath.value==='/intermediaryHousing'?2:routePath.value==='/needHousing'?3:''
}
})
</script>
@@ -187,7 +219,7 @@ img {
}
.s-w-100 {
width: 100%;
width: 100% !important;
}
.authentication-box {
@@ -226,6 +258,15 @@ img {
margin-bottom: 20px;
cursor: pointer;
.detail-tab{
width:32px;
height:32px;
position: absolute;
top:0;
right:0;
z-index:66;
}
.mg-t-10 {
margin-top: 10px;
}
@@ -394,8 +435,7 @@ img {
text-align: center;
}
}
}
</style>
}</style>