no message

This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-05-15 17:32:47 +08:00
parent d201c8892f
commit d3d3542822
7 changed files with 374 additions and 60 deletions

View File

@@ -74,7 +74,7 @@
<img class="icon" src="@/assets/img/apartmentDetail/yellow-diamond.png" />
<div class="name">{{ company.title }}</div>
<div class="full-name flex1">{{ info.propaganda }}</div>
<div class="more flexacenter" @click="handleClickNav('eleseEle')">
<div class="more flexacenter" v-if="withsameapartments" @click="handleClickNav('eleseEle')">
同品牌
<img class="icon" src="@/assets/img/publicImage/black-arrow.svg" />
</div>
@@ -225,7 +225,11 @@
</div>
</div>
<div class="btn flexacenter">
<div class="collect flexcenter">
<div v-if="item.iscollection" class="collect flexcenter red" @click="roomCollect(item.id, index)">
<img class="icon" src="@/assets/img/apartmentDetail/collect-red.svg" />
已收藏
</div>
<div v-else class="collect flexcenter" @click="roomCollect(item.id, index)">
<img class="icon" src="@/assets/img/apartmentDetail/collect-hollow-black.svg" />
收藏
</div>
@@ -439,8 +443,8 @@
</div>
</div>
<div class="img-box flexflex" v-if="item.images.length > 0">
<div class="img-item" v-for="(item, index) in item.images" :key="index" @click="openFacilitiesImg(item.img[0])">
<img class="icon" :src="item.img[0]" />
<div class="img-item" v-for="(item, index) in item.images" :key="index" @click="openFacilitiesImg(item.img[0].imageurl)">
<img class="icon" :src="item.img[0].thumbnail" />
<div class="name">{{ item.name }}</div>
</div>
</div>
@@ -765,7 +769,7 @@ onMounted(() => {
});
const init = () => {
proxy.$get("/tenement/pc/api/apartment/details", { uniqid }).then((res) => {
proxy.$get("https://api.gter.net/v1/apartment/details", { uniqid }).then((res) => {
if (res.code != 200) {
ElMessage.error(res["message"]);
return;
@@ -804,8 +808,8 @@ const init = () => {
const facility = data.info.facility;
if (facility) {
facility["public"][0].images = ["https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skdX7qqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MtZCjvF5wr_-kU8uRQ0NDI5", "https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skfHvqqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MsIAzvG5Ar_-kU8uRQ0NDI5"];
facility["public"][1].images = ["https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skdXfqqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MtdDG6W5Q7_-kU8uRQ0NDI5", "https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skfXnqqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MtcA2vF5A7_-kU8uRQ0NDI5"];
// facility["public"][0].images = ["https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skdX7qqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MtZCjvF5wr_-kU8uRQ0NDI5", "https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skfHvqqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MsIAzvG5Ar_-kU8uRQ0NDI5"];
// facility["public"][1].images = ["https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skdXfqqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MtdDG6W5Q7_-kU8uRQ0NDI5", "https://oss.x-php.com/Zvt57TuJSUvkyhw-xG7Y2l-c-5skfXnqqsgFptxhXa6QWi2uePJ5Bg8WFLPIqoYV7MtcA2vF5A7_-kU8uRQ0NDI5"];
let list = [];
facilityArr.forEach((key) => {
@@ -919,13 +923,17 @@ const openFacilities = () => {
const openFacilitiesImg = (current) => {
const list = facilitylist.value || [];
let urls = [];
// element.images.forEach((ele) => {
// ele.img.forEach((e) => {
// urls.push(e.imageurl);
// });
// });
list.forEach((element) => {
element.images.forEach((ele) => {
ele.img.forEach((imageurl) => {
ele.img.forEach((e) => {
urls.push({
imageurl,
thumbnail: imageurl,
imageurl: e.imageurl,
thumbnail: e.thumbnail,
type: "attachment",
});
});
@@ -1050,7 +1058,8 @@ const handleClickNav = (value) => {
let dualBrandList = ref([]); // 同品牌数据
// 同品牌请求数据
const dualBrandData = () => {
proxy.$get("/tenement/pc/api/apartment", { token }).then((res) => {
// proxy.$get("/tenement/pc/api/apartment", { token }).then((res) => {
proxy.$get("https://api.gter.net/v1/apartment/lists", { token }).then((res) => {
if (res.code != 200) return;
let data = res.data;
dualBrandList.value = data.data;
@@ -1369,6 +1378,17 @@ const openMap = () => {
viewMapRef.value.showPop();
isSelectSchool.value = false;
};
const roomCollect = (id, index) => {
console.log(id, index);
proxy.$post("https://api.gter.net/v1/apartment/roomCollection", { id }).then((res) => {
if (res.code != 200) return;
const data = res.data;
ElMessage.success(res.message);
roomList.value[index].iscollection = data.status || 0;
});
};
</script>
<style lang="less" scoped>

View File

@@ -72,7 +72,48 @@
<div class="list wid1200 flexflex" v-show="tabState == 'fav'" ref="gridContainer">
<div class="item" v-for="(item, index) in favData['list']" :key="item.id" @click="goApartmentDetail(item)">
<div v-if="item.collectiontype == 'apartment'" class="apartment-item">
<div v-if="item.typetype == 'apartmentroomfav'" class="apartment-item">
<div class="apartment-top flexacenter">
<img class="icon" src="@/assets/img/publicImage/apartment-icon.png" />
<img class="title" src="@/assets/img/publicImage/apartment-title.png" />
</div>
<div class="apartment-title">{{ item.title }}</div>
<div class="apartment-header flexflex">
<div class="apartment-room-img" v-if="item.image">
<img class="img" :src="item.image" />
<img class="media-icon" v-if="item.videos.length > 0" src="@/assets/img/apartmentDetail/media-icon.svg" />
</div>
<div class="apartment-room-content flexflex">
<div class="name">{{ item.name }}</div>
<div class="type-tags flexacenter" v-if="item.allowance || item?.tags?.length != 0">
<div class="tags-item flexcenter first" v-if="item.allowance">仅剩{{ item.allowance }}</div>
<template v-if="item?.tags?.length != 0">
<div class="tags-item flexcenter" v-for="(it, ii) in item.tags" :key="ii">{{ it }}</div>
</template>
</div>
<div class="price-box flexacenter">
<div class="new flexacenter">
<div class="unit">HK$</div>
<div class="cost">{{ item.discountprice || item.price }}</div>
/
</div>
<div class="former" v-if="item.discountprice">HK$ {{ item.price }}/</div>
</div>
</div>
</div>
<div class="apartment-bottom flexacenter">
<div class="apartment-bottom-location flexacenter flex1">
<img class="apartment-bottom-icon" src="@/assets/img/publicImage/location-icon.png" />
<span class="apartment-bottom-text flex1 ellipsis">{{ item.address }}</span>
</div>
<div class="apartment-bottom-btn flexacenter" @click.stop="cancelCollection(item)">
<img class="apartment-bottom-btn-icon" src="@/assets/img/publicImage/black-circle-cross.svg" />
取消收藏
</div>
</div>
</div>
<div v-else-if="item.typetype == 'apartmentcollection'" class="apartment-item">
<div class="apartment-top flexacenter">
<img class="icon" src="@/assets/img/publicImage/apartment-icon.png" />
<img class="title" src="@/assets/img/publicImage/apartment-title.png" />
@@ -81,13 +122,33 @@
<img class="apartment-header-img" :src="item.image || item.imageurl" />
<div class="apartment-header-content flexflex">
<div class="apartment-header-title ellipsis">{{ item.title }}</div>
<div class="apartment-header-tips ellipsis">{{ item.propaganda }}</div>
<div class="apartment-header-types flex">
<div v-for="(it, i) in item.othertags" :key="i" class="apartment-header-types-item flexcenter">{{ it }}</div>
<!-- <div class="apartment-header-tips ellipsis">{{ item.propaganda }}</div> -->
<div class="label-list flexacenter">
<div class="label-item flexacenter blue">
<img class="safety-icon" src="@/assets/img/publicImage/safety-icon.png" />
实地考察
</div>
<div class="label-item flexacenter violet">0服务费</div>
<div class="label-item red" v-for="(item, index) in item.hottags" :key="index">{{ item }}</div>
<div class="label-item" v-for="(item, index) in item.tags" :key="index">{{ item }}</div>
</div>
<div class="flexacenter">
<div class="price flexacenter flex1">
<div class="unit">HK$</div>
<div class="value">{{ item.rentprice }}</div>
/月起
</div>
<div class="type flexacenter">
{{ item.roomnum }}个房型
<img class="icon" src="@/assets/img/publicImage/arrow-return.svg" />
</div>
</div>
<!-- <div class="apartment-header-types flex">
<div v-for="(it, i) in item.othertags" :key="i" class="apartment-header-types-item flexcenter">{{ it }}</div>
</div> -->
</div>
</div>
<div class="apartment-type-box flexflex flex1">
<!-- <div class="apartment-type-box flexflex flex1">
<div class="apartment-type-list flexflex flex1">
<div class="apartment-type-list-item flexacenter" v-for="(it, index) in item.roomlist" :key="index">
<div class="apartment-type-list-item-name ellipsis flex1">{{ it.name }}</div>
@@ -104,7 +165,7 @@
个房型
<img class="apartment-type-arrow" src="@/assets/img/publicImage/black-arrow.svg" />
</div>
</div>
</div> -->
<div class="apartment-bottom flexacenter">
<div class="apartment-bottom-location flexacenter flex1">
<img class="apartment-bottom-icon" src="@/assets/img/publicImage/location-icon.png" />
@@ -288,17 +349,28 @@ const getFavData = () => {
text: "Loading",
background: "rgba(0, 0, 0, 0.7)",
});
// .$post("/tenement/pc/api/user/favList", {
// .$post("/tenement/pc/api/user/collectionList", {
proxy
// .$post("/tenement/pc/api/user/favList", {
.$post("/tenement/pc/api/user/collectionList", {
page: favData.value["page"],
})
.$post("https://app.gter.net/tenement/v2/api/user/collections", { page: favData.value["page"] })
.then((res) => {
if (res.code != 200) return;
let data = res.data;
console.log("data", data);
let list = data.data || [];
list = list.map((item) => {
const newItem = item.data ? { ...item.data } : { ...item };
newItem.typetype = item.type;
newItem.token = item.token;
if (newItem.typetype === "apartmentcollection" && typeof newItem.tags === "string") newItem.tags = newItem.tags.split(",");
return newItem;
});
favData.value["page"] = data["page"] * data["limit"] >= data["count"] ? 0 : data["page"] + 1;
favData.value["list"] = favData.value["list"].concat(data["data"] || []);
favData.value["list"] = favData.value["list"].concat(list || []);
favData.value["limit"] = data["limit"];
nextTick(() => {
masonryInstance.reloadItems();
masonryInstance.layout();
@@ -320,20 +392,36 @@ const cutTab = (value) => {
// 取消收藏
let cancelCollection = (data) => {
let url = "/tenement/pc/api/user/operation";
if (data["collectiontype"] == "apartment") url = "/tenement/pc/api/user/apartmentCollection";
// if (data["type"] == "apartment") url = "/tenement/pc/api/user/apartmentCollection";
// if (data["typetype"] == "apartmentcollection") url = "https://api.gter.net/v1/apartment/collection";
// if (data["typetype"] == "apartmentroomfav") url = "https://api.gter.net/v1/apartment/roomCollection";
url = "https://app.gter.net/tenement/v2/api/user/unfav";
const token = data["token"];
const list = favData.value.list || [];
const index = list.findIndex((item) => item.token == token);
if (index == -1) return;
// const list = favData.value.list || [];
console.log("list", list);
proxy
.$post(url, {
token: data["token"],
token,
})
.then((res) => {
if (res.code != 200) return;
favData.value.list.splice(data["index"], 1);
if (res.code != 200) {
ElMessage.error(res.message);
return;
}
favData.value.list.splice(index, 1);
count.value["fav"]--;
if (favData.value.list.length == 0 && favData.value["page"] != 0) {
favData.value["page"] = 1;
getFavData();
} else refillData(data["index"]);
} else refillData(index);
nextTick(() => {
masonryInstance.reloadItems();
@@ -347,15 +435,25 @@ let cancelCollection = (data) => {
const refillData = (index) => {
if (favData.value["page"] == 0 || loading["visible"].value) return;
const page = favData.value["page"] - 1;
proxy
.$post("/tenement/pc/api/user/favList", {
.$post("https://app.gter.net/tenement/v2/api/user/collections", {
page,
limit: favData.value["limit"],
})
.then((res) => {
if (res.code != 200) return;
let data = res.data["data"] || [];
favData.value["list"].push(data[data.length - 1]);
let list = data.data || [];
list = list.map((item) => {
const newItem = item.data ? { ...item.data } : { ...item };
newItem.typetype = item.type;
newItem.token = item.token;
if (newItem.typetype === "apartmentcollection" && typeof newItem.tags === "string") newItem.tags = newItem.tags.split(",");
return newItem;
});
// let data = res.data["data"] || [];
favData.value["list"].push(list[list.length - 1]);
nextTick(() => {
masonryInstance.reloadItems();
masonryInstance.layout();
@@ -684,8 +782,8 @@ onUnmounted(() => {
.apartment-item {
width: 590px;
height: 360px;
padding: 0 0 20px;
// height: 360px;
// padding: 0 0 20px;
background-color: rgba(255, 255, 255, 1);
border-radius: 16px;
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
@@ -712,14 +810,25 @@ onUnmounted(() => {
}
}
.apartment-header {
.apartment-title {
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
font-weight: 650;
font-style: normal;
font-size: 20px;
color: #000000;
padding: 0 20px;
margin-bottom: 20px;
}
.apartment-header {
padding: 0 20px 26px;
border-bottom: 1px dotted #d7d7d7;
.apartment-header-img {
width: 209px;
height: 140px;
border-radius: 15px;
margin-right: 20px;
object-fit: cover;
width: 240px;
height: 161px;
}
.apartment-header-content {
@@ -729,28 +838,194 @@ onUnmounted(() => {
font-weight: 650;
font-size: 20px;
color: #000000;
margin-bottom: 10px;
margin-bottom: 11px;
}
.apartment-header-tips {
color: #aaaaaa;
font-size: 14px;
margin-bottom: 20px;
}
// .apartment-header-tips {
// color: #aaaaaa;
// font-size: 14px;
// margin-bottom: 20px;
// }
.apartment-header-types {
height: 76px;
overflow: hidden;
.apartment-header-types-item {
display: inline-flex;
height: 28px;
padding: 0 12px;
background-color: rgba(224, 240, 255, 1);
border-radius: 5px;
color: #447eb3;
// .apartment-header-types {
// height: 76px;
// overflow: hidden;
// .apartment-header-types-item {
// display: inline-flex;
// height: 28px;
// padding: 0 12px;
// background-color: rgba(224, 240, 255, 1);
// border-radius: 5px;
// color: #447eb3;
// font-size: 13px;
// margin-right: 10px;
// margin-bottom: 10px;
// }
// }
.label-list {
flex-wrap: wrap;
// padding-bottom: 14px;
padding-bottom: 1px;
// border-bottom: 1px solid #ebebeb;
.label-item {
.safety-icon {
width: 14px;
height: 14px;
margin-right: 5px;
}
color: #555555;
text-align: center;
height: 22px;
line-height: 22px;
background-color: rgba(235, 235, 235, 1);
border-radius: 8px;
color: #555555;
padding: 0 8px;
font-size: 13px;
margin-right: 10px;
margin-bottom: 10px;
&.blue {
color: #ffffff;
background-color: rgba(98, 177, 255, 1);
}
&.violet {
color: #ffffff;
background-color: rgba(128, 128, 255, 1);
}
&.red {
color: #ffffff;
background-color: rgba(249, 93, 93, 1);
}
}
}
.price {
font-size: 14px;
color: #555555;
.unit {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
color: #000000;
font-size: 14px;
}
.value {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
font-size: 20px;
color: #f95d5d;
margin: 0 6px;
}
}
.type {
font-size: 13px;
color: #555555;
.icon {
width: 12px;
height: 12px;
margin-left: 8px;
}
}
}
.apartment-room-img {
width: 110px;
height: 110px;
position: relative;
border-radius: 8px;
margin-right: 20px;
.img {
width: 110px;
height: 110px;
object-fit: cover;
border-radius: 8px;
}
.media-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 53px;
height: 53px;
cursor: pointer;
}
}
.apartment-room-content {
flex-direction: column;
.name {
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
font-weight: 650;
font-style: normal;
font-size: 18px;
color: #000000;
margin-bottom: 16px;
}
.type-tags {
flex-wrap: wrap;
margin-bottom: 7px;
// margin-bottom: 20px;
.tags-item {
height: 24px;
background-color: rgba(242, 242, 242, 1);
border-radius: 4px;
line-height: 26px;
font-size: 14px;
color: #7f7f7f;
margin-bottom: 5px;
margin-right: 8px;
padding: 0 9px;
&.first {
border: 1px solid rgba(80, 227, 194, 1);
color: #50e3c2;
background-color: #fff;
}
}
}
.price-box {
padding-bottom: 3px;
.new {
margin-right: 13px;
font-weight: 400;
font-style: normal;
color: #555555;
font-size: 13px;
.unit {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
color: #000000;
font-size: 13px;
}
.cost {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
font-size: 20px;
color: #f95d5d;
margin: 0 6px;
}
}
.former {
font-size: 14px;
color: #aaaaaa;
text-decoration: line-through;
}
}
}
@@ -824,7 +1099,8 @@ onUnmounted(() => {
}
.apartment-bottom {
height: 58px;
height: 66px;
padding: 0 30px;
.apartment-bottom-location {
font-size: 15px;
@@ -836,7 +1112,7 @@ onUnmounted(() => {
}
.apartment-bottom-text {
width: 450px;
width: 430px;
}
}