修改bug和修改学校距离单位

This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-05-26 19:04:51 +08:00
parent cd1f1ecf83
commit c1df4e8cbf
10 changed files with 148 additions and 50 deletions

View File

@@ -999,7 +999,7 @@
color: #555555;
line-height: 30px;
padding: 0 15px;
margin-bottom: 26px;
margin-bottom: 20px;
white-space: pre-line;
}
.content .details-box .details-right {

View File

@@ -1438,7 +1438,7 @@
color: #555555;
line-height: 30px;
padding: 0 15px;
margin-bottom: 26px;
margin-bottom: 20px;
white-space: pre-line;
}
}

View File

@@ -51,6 +51,7 @@ const gobrand = (item) => router.push(`/apartmentDetail?uniqid=${item.uniqid}`);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
padding: 8px 0;
cursor: pointer;
transition: all .3s;
&:not(:last-of-type) {
margin-bottom: 20px;

View File

@@ -23,7 +23,7 @@
<div v-if="historyArr.length != 0" style="margin-bottom: 30px">
<div class="title">历史搜索</div>
<div class="info-box">
<div :class="flexacenter" v-for="(item, i) in historyArr" :key="i" class="btn flexacenter" @click="handleKeyword(item)">
<div v-for="(item, i) in historyArr" :key="i" class="btn flexacenter" @click="handleKeyword(item)">
<div class="flexflex">{{ item }}</div>
<img class="btn-icon" src="../../assets/homeImage/closeIcon.svg" @click.stop="deleteSeachVal(i)" alt="" />
</div>

View File

@@ -50,20 +50,20 @@
<div class="figure flexflex" v-if="item.distance?.distance">
距离
<div class="school">{{ item.distance.alias }}</div>
<div class="mile">{{ calculateDistance(item.distance.distance) }}km</div>
<div class="mile">{{ item.distance.distance }}公里</div>
</div>
<div class="vehicle-list flex1 flexflex">
<div class="vehicle-item flexacenter" v-if="item.distance?.walking_duration">
<div class="vehicle-item flexacenter" v-if="item.distance?.walking_duration > 0">
<img class="vehicle-icon" src="@/assets/img/apartmentDetail/walk-icon.png" />
{{ calculateDuration(item.distance.walking_duration) }}
{{ item.distance.walking_duration }}时长()
</div>
<div class="vehicle-item flexacenter" v-if="item.distance?.transit_duration">
<div class="vehicle-item flexacenter" v-if="item.distance?.transit_duration > 0">
<img class="vehicle-icon" src="@/assets/img/apartmentDetail/taxi-icon.png" />
{{ calculateDuration(item.distance.transit_duration) }}
{{ item.distance.transit_duration }}时长()
</div>
<div class="vehicle-item flexacenter" v-if="item.distance?.driving_duration">
<div class="vehicle-item flexacenter" v-if="item.distance?.driving_duration > 0">
<img class="vehicle-icon" src="@/assets/img/apartmentDetail/subway-icon.png" />
{{ calculateDuration(item.distance.driving_duration) }}
{{ item.distance.driving_duration }}时长()
</div>
</div>
</div>
@@ -85,10 +85,10 @@
<div class="price flexflex">
<div class="type-data flexacenter">
<div class="unit">HK$</div>
<div class="price">{{ it.discountprice || it["price"] }}</div>
<div class="price">{{ it.discountprice || it.price }}</div>
/
</div>
<div class="original-price" v-if="it.discountprice">HK${{ it.discountprice }}/</div>
<div class="original-price" v-if="it.discountprice">HK${{ it.price }}/</div>
</div>
</div>
</div>

View File

@@ -130,7 +130,7 @@ defineExpose({
#container {
cursor: pointer;
width: 816px;
width: 814px;
height: 180px;
margin-top: 20px;
// margin-bottom: 40px;

View File

@@ -124,17 +124,26 @@
</div>
</div>
<span class="dis-f al-item sort-text" v-show="tabType !== 'apartment'">
<el-dropdown trigger="click" @command="listSortCheck">
<span class="dis-f al-item sort-text"> {{ listSort.check }}<img class="img" src="../../assets/homeImage/sortIcon.png" alt="" /> </span>
<el-dropdown popper-class="popover-sort" trigger="click" @command="listSortCheck">
<div class="sort-btn flexacenter">
{{ listSort.check }}
<img class="sort-icon" src="@/assets/homeImage/sortIcon.png" />
</div>
<!-- <span class="dis-f al-item sort-text"> {{ listSort.check }}<img class="img" src="../../assets/homeImage/sortIcon.png" alt="" /> </span> -->
<template #dropdown>
<el-dropdown-menu class="pd-10 el-dropdown-menu">
<el-dropdown-menu class="sort-box">
<el-dropdown-item class="sort-item" v-for="(item, j) in listSort.type" :key="j" :command="j">
<div :class="{ pitch: listSort.checkType === item.type }">{{ item.title }}</div>
</el-dropdown-item>
</el-dropdown-menu>
<!-- <el-dropdown-menu class="pd-10 el-dropdown-menu">
<el-dropdown-item v-for="(items, j) in listSort.type" :key="j" :command="j">
<div class="dropdown-text" :class="{ 'dropdown-check-text': listSort.checkType === items.type }">
{{ items.title }}
<div class="type-icon" v-show="listSort.checkType === items.type"></div>
</div>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown-menu> -->
</template>
</el-dropdown>
</span>
@@ -438,13 +447,14 @@ let selectTabCheck = reactive({
//最新发布选项
let listSort = shallowReactive({
type: [
{ title: "综合", type: "default" },
{ title: "最新发布", type: "timestamp" },
{ title: "热门", type: "hotnum" },
{ title: "价格从低到高", type: "rentasc" },
{ title: "价格从高到低", type: "rentdesc" },
],
checkType: "timestamp",
check: "最新发布",
checkType: "default",
check: "综合",
});
//搜索列表排序
let listSortCheck = (item) => {
@@ -844,6 +854,20 @@ img {
color: #000000;
text-align: center;
cursor: pointer;
.sort-btn {
cursor: pointer;
color: #000;
line-height: 24px;
font-size: 14px;
font-weight: 650;
.sort-icon {
width: 20px;
height: 20px;
margin-left: 10px;
}
}
}
.img {
@@ -1003,3 +1027,51 @@ img {
--el-dropdown-menuItem-hover-fill: rgba(246, 246, 246, 1);
}
</style>
<style lang="less">
.el-popper.popover-sort {
width: 150px;
padding: 0;
border-radius: 10px;
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.0784313725490196);
.sort-box {
padding: 26px 20px 2px;
font-size: 14px;
color: #7f7f7f;
border-radius: 10px;
.sort-item {
margin-bottom: 30px;
cursor: pointer;
padding: 0;
&:not(.is-disabled):focus{
background-color: #fff;
color: #7f7f7f;
}
.pitch {
width: 100%;
color: #000;
font-weight: 650;
position: relative;
&::before {
content: "";
width: 6px;
height: 14px;
background-color: rgba(80, 227, 194, 1);
border-radius: 3px;
display: block;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
}
}
}
}
}
</style>

View File

@@ -95,16 +95,30 @@
<div class="figure flexacenter" v-if="distancePitch?.alias">
距离
<div class="school">{{ distancePitch.alias }}</div>
{{ distancePitch.distance }}km
{{ distancePitch.distance }}公里
<div class="btn" @click="openSelectSchool">[切换院校]</div>
</div>
<div class="vehicle flexflex">
<div class="item flexacenter" v-for="(item, index) in distancePitch?.obj" :key="index">
<!-- <div class="item flexacenter" v-for="(item, index) in distancePitch?.obj" :key="index">
<img v-if="index == 'walking'" class="icon" src="@/assets/img/apartmentDetail/walk-icon.png" />
<img v-if="index == 'driving'" class="icon" src="@/assets/img/apartmentDetail/taxi-icon.png" />
<img v-if="index == 'transit'" class="icon" src="@/assets/img/apartmentDetail/subway-icon.png" />
{{ item }}
</div> -->
<div class="item flexcenter" v-if="distancePitch.walking_duration > 0">
<img class="icon" src="@/assets/img/apartmentDetail/walk-icon.png" />
{{ distancePitch.walking_duration }}时长()
</div>
<div class="item flexcenter" v-if="distancePitch.transit_duration > 0">
<img class="icon" src="@/assets/img/apartmentDetail/subway-icon.png" />
{{ distancePitch.transit_duration }}时长()
</div>
<div class="item flexcenter" v-if="distancePitch.driving_duration > 0">
<img class="icon" src="@/assets/img/apartmentDetail/taxi-icon.png" />
{{ distancePitch.driving_duration }}时长()
</div>
</div>
</div>
@@ -179,7 +193,7 @@
</div>
<div class="explain two-line-text">{{ spotObj.content }}</div>
</div>
<img class="inspect-img" :src="spotObj.sources[0].thumbnail" />
<img class="inspect-img" :src="spotObj.sources[0]?.thumbnail" />
</div>
</div>
@@ -603,14 +617,20 @@
<div class="distance flexacenter">
距离
<div class="abbreviation">{{ item.alias }}</div>
{{ item.distance }}km
{{ item.distance }}公里
</div>
<div class="vehicle flexflex flex1">
<div class="item flexcenter" v-for="(item, index) in item.obj" :key="index">
<img v-if="index == 'walking'" class="vehicle-icon" src="@/assets/img/apartmentDetail/walk-icon.png" />
<img v-else-if="index == 'driving'" class="vehicle-icon" src="@/assets/img/apartmentDetail/taxi-icon.png" />
<img v-else class="vehicle-icon" src="@/assets/img/apartmentDetail/subway-icon.png" />
{{ item }}
<div class="item flexcenter" v-if="item.walking_duration > 0">
<img class="vehicle-icon" src="@/assets/img/apartmentDetail/walk-icon.png" />
{{ item.walking_duration }}时长()
</div>
<div class="item flexcenter" v-if="item.transit_duration > 0">
<img class="vehicle-icon" src="@/assets/img/apartmentDetail/subway-icon.png" />
{{ item.transit_duration }}时长()
</div>
<div class="item flexcenter" v-if="item.driving_duration > 0">
<img class="vehicle-icon" src="@/assets/img/apartmentDetail/taxi-icon.png" />
{{ item.driving_duration }}时长()
</div>
</div>
</div>
@@ -1236,8 +1256,8 @@ let isOperateShow = ref(true); // 底部操作栏是否显示
const handleScroll = () => {
if (Math.random() > 0.3) return;
let body = document.documentElement ? document.documentElement : document.body ? document.body : document.querySelector(".element")
let offsetHeight = body.offsetHeight
let body = document.documentElement ? document.documentElement : document.body ? document.body : document.querySelector(".element");
let offsetHeight = body.offsetHeight;
const clientHeight = document.documentElement.clientHeight;
const scrollTop = document.documentElement.scrollTop;
const top = scrollTop + clientHeight;
@@ -1254,7 +1274,7 @@ const handleScroll = () => {
const topDistance = 260 - 36 + headerHeight + leftHeight + 223;
if (top > topDistance && isFixed.value == false) {
isFixed.value = true;
FixedBottom.value = document.querySelector(".index-footer").getBoundingClientRect().height + 20
FixedBottom.value = document.querySelector(".index-footer").getBoundingClientRect().height + 20;
}
if (top < topDistance && isFixed.value == true) isFixed.value = false;
@@ -1422,24 +1442,25 @@ const getMapDistance = () => {
let arr = [];
let pitch = null;
distance.forEach((element) => {
let obj = {};
element.distance = calculateDistance(element.distance);
if (element.walking && element.walking.duration) obj["walking"] = calculateDuration(element.walking.duration);
if (element.transit && element.transit.duration) obj["transit"] = calculateDuration(element.transit.duration);
if (element.driving && element.driving.duration) obj["driving"] = calculateDuration(element.driving.duration);
const target = {
name: element.name,
distance: element.distance,
alias: element.alias,
sid: element.sid,
obj,
};
arr.push(target);
if (element.sid == sid) pitch = target;
// let obj = {};
// element.distance = calculateDistance(element.distance);
// if (element.walking && element.walking.duration) obj["walking"] = calculateDuration(element.walking.duration);
// if (element.transit && element.transit.duration) obj["transit"] = calculateDuration(element.transit.duration);
// if (element.driving && element.driving.duration) obj["driving"] = calculateDuration(element.driving.duration);
// const target = {
// name: element.name,
// distance: element.distance,
// alias: element.alias,
// sid: element.sid,
// obj,
// };
// arr.push(target);
if (element.sid == sid) pitch = element
});
if (pitch == null) pitch = arr[0];
distanceList.value = arr;
if (pitch == null) pitch = distance[0];
distanceList.value = distance;
distancePitch.value = pitch;
});
};
@@ -1450,6 +1471,7 @@ const openSelectSchool = () => {
isSelectSchool.value = true;
nextTick(() => {
return
const item = selectSchoolRef.value.querySelector(`.item${distancePitch.value.sid}`);
if (!item) return;
selectSchoolRef.value.scrollTo({ top: item.offsetTop - 20, behavior: "smooth" });
@@ -2055,6 +2077,7 @@ const cutRemarkType = (value) => (remarkTypeid.value = value);
font-size: 14px;
color: #555555;
margin-top: 7px;
padding-bottom: 7px;
.abbreviation {
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
@@ -2143,7 +2166,7 @@ const cutRemarkType = (value) => (remarkTypeid.value = value);
padding-left: 20px;
&:not(:last-of-type) {
border-bottom: 1px dashed #d7d7d7;
border-bottom: 1px #d7d7d7 dotted;
}
.avatar {

View File

@@ -8,7 +8,7 @@
<div class="info-box">
<div class="top-bar-box dis-f jus-x" :class="{ intermediary: housingInfo['data'] && (housingInfo['data'].isintermediary == 1 || housingInfo['data'].info.verified) }">
<div class="top-bar dis-f al-item jus-bet">
<div class="dis-f al-item">
<div class="dis-f al-item" style="margin-right: 10px;">
<img src="../assets/img/detail/authenticationHousing.png" class="authentication-housing" v-if="pageType == 1 && housingInfo['data'] && housingInfo['data'].info.verified" alt="" />
<img src="../assets/homeImage/intermediaryTabImg.png" class="intermediary-logo" style="margin-right: 10px" v-if="pageType == 2 && housingInfo['data'] && housingInfo['data'].isintermediary == 1" alt="" />
<div class="line" v-if="(housingInfo['data'] && housingInfo['data'].info.verified) || (pageType == 2 && housingInfo['data'] && housingInfo['data'].isintermediary == 1)"></div>
@@ -1825,7 +1825,7 @@ img {
}
.top-bar {
width: 750px;
min-width: 750px;
background: inherit;
background-color: rgba(255, 255, 255, 1);
box-sizing: border-box;

View File

@@ -126,6 +126,8 @@ const getData = () => {
localStorage.setItem("apartmentPitchValue", JSON.stringify(pitchValue.value));
pitchValue.value['sid'] = pitchValue.value['school'] || 0;
proxy
.$post("https://api.gter.net/v1/apartment/lists", { limit: 1000, page, ...pitchValue.value })
.then((res) => {