修改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

@@ -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 {