距离院校新样式
This commit is contained in:
A1300399510
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
6
dist/img/arrow-circle-blue.33a099ea.svg
vendored
Normal file
6
dist/img/arrow-circle-blue.33a099ea.svg
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="matrix(1 0 0 1 -995 -13670 )">
|
||||
<path d="M 19.796875 12.703125 C 19.984375 12.515625 20.078125 12.28125 20.078125 12 C 20.078125 11.71875 19.984375 11.484375 19.796875 11.296875 L 18.375 9.875 L 12.71875 4.21875 C 12.53125 4.03125 12.296875 3.9375 12.015625 3.9375 C 11.734375 3.9375 11.5 4.03125 11.3125 4.21875 L 9.890625 5.640625 C 9.703125 5.828125 9.609375 6.0625 9.609375 6.34375 C 9.609375 6.625 9.703125 6.859375 9.890625 7.046875 L 12.84375 10 L 5 10 C 4.72916666666667 10 4.49479166666667 10.0989583333333 4.296875 10.296875 C 4.09895833333333 10.4947916666667 4 10.7291666666667 4 11 L 4 13 C 4 13.2708333333333 4.09895833333333 13.5052083333333 4.296875 13.703125 C 4.49479166666667 13.9010416666667 4.72916666666667 14 5 14 L 12.84375 14 L 9.890625 16.953125 C 9.69270833333333 17.1510416666667 9.59375 17.3854166666667 9.59375 17.65625 C 9.59375 17.9270833333333 9.69270833333333 18.1614583333333 9.890625 18.359375 L 11.3125 19.78125 C 11.5 19.96875 11.734375 20.0625 12.015625 20.0625 C 12.296875 20.0625 12.53125 19.96875 12.71875 19.78125 L 18.375 14.125 L 19.796875 12.703125 Z M 22.390625 5.9765625 C 23.4635416666667 7.81510416666666 24 9.82291666666666 24 12 C 24 14.1770833333333 23.4635416666667 16.1848958333333 22.390625 18.0234375 C 21.3177083333333 19.8619791666667 19.8619791666667 21.3177083333333 18.0234375 22.390625 C 16.1848958333333 23.4635416666667 14.1770833333333 24 12 24 C 9.82291666666667 24 7.81510416666667 23.4635416666667 5.9765625 22.390625 C 4.13802083333333 21.3177083333333 2.68229166666667 19.8619791666667 1.609375 18.0234375 C 0.536458333333333 16.1848958333333 0 14.1770833333333 0 12 C 0 9.82291666666666 0.536458333333333 7.81510416666666 1.609375 5.9765625 C 2.68229166666667 4.13802083333333 4.13802083333333 2.68229166666666 5.9765625 1.609375 C 7.81510416666667 0.536458333333331 9.82291666666667 0 12 0 C 14.1770833333333 0 16.1848958333333 0.536458333333331 18.0234375 1.609375 C 19.8619791666667 2.68229166666666 21.3177083333333 4.13802083333333 22.390625 5.9765625 Z " fill-rule="nonzero" fill="#62b1ff" stroke="none" transform="matrix(1 0 0 1 995 13670 )" />
|
||||
</g>
|
||||
</svg>
|
||||
6
dist/img/arrow-green.2e1904da.svg
vendored
Normal file
6
dist/img/arrow-green.2e1904da.svg
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="7px" height="12px" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="matrix(1 0 0 1 -900 -691 )">
|
||||
<path d="M 6.76909722222222 5.47265625 C 6.92303240740741 5.62109375 7 5.796875 7 6 C 7 6.203125 6.92303240740741 6.37890625 6.76909722222222 6.52734375 L 1.32465277777778 11.77734375 C 1.17071759259259 11.92578125 0.988425925925926 12 0.777777777777778 12 C 0.56712962962963 12 0.384837962962963 11.92578125 0.230902777777778 11.77734375 C 0.0769675925925926 11.62890625 0 11.453125 0 11.25 L 0 0.75 C 0 0.546874999999998 0.0769675925925926 0.371093749999998 0.230902777777778 0.22265625 C 0.384837962962963 0.0742187499999991 0.56712962962963 0 0.777777777777778 0 C 0.988425925925926 0 1.17071759259259 0.0742187499999991 1.32465277777778 0.22265625 L 6.76909722222222 5.47265625 Z " fill-rule="nonzero" fill="#50e3c2" stroke="none" transform="matrix(1 0 0 1 900 691 )" />
|
||||
</g>
|
||||
</svg>
|
||||
7
dist/img/markIconNot.688d23ad.svg
vendored
7
dist/img/markIconNot.688d23ad.svg
vendored
@@ -1,7 +0,0 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10px" height="10px" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="matrix(1 0 0 1 -792 -1470 )">
|
||||
<path d="M 797 1471 C 799.24 1471 801 1472.76 801 1475 C 801 1477.24 799.24 1479 797 1479 C 794.76 1479 793 1477.24 793 1475 C 793 1472.76 794.76 1471 797 1471 Z " fill-rule="nonzero" fill="#f2f2f2" stroke="none" />
|
||||
<path d="M 797 1471 C 799.24 1471 801 1472.76 801 1475 C 801 1477.24 799.24 1479 797 1479 C 794.76 1479 793 1477.24 793 1475 C 793 1472.76 794.76 1471 797 1471 Z " stroke-width="2" stroke="#d7d7d7" fill="none" />
|
||||
</g>
|
||||
</svg>
|
||||
15
dist/index.html
vendored
15
dist/index.html
vendored
@@ -1,8 +1,7 @@
|
||||
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/favicon.ico"><title>港校租房</title><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/chunk-vendors.6d96b969.js"></script><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/app.e91855ee.js"></script><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/chunk-vendors.7885d77e.css" rel="stylesheet"><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/app.f5f600f1.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but zufang doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><script src="https://app.gter.net/bottom?tpl=header&menukey=fang"></script><div id="app"></div><div style="display:none;"><script src="//v1.cnzz.com/z_stat.php?id=1281224882&web_id=1281224882"></script><script>console.log("111");
|
||||
var _hmt = _hmt || [];
|
||||
(function () {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "//hm.baidu.com/hm.js?4bd66cbe45a640b607fe46c48f658746";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();</script></div><script src="https://app.gter.net/bottom?tpl=footer"></script></body></html>
|
||||
<!doctype html><html lang=""><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1"/><link rel="icon" href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/favicon.ico"/><title>港校租房</title><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/chunk-vendors.6d96b969.js"></script><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/app.4adfb45b.js"></script><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/chunk-vendors.7885d77e.css" rel="stylesheet"><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/app.f5f600f1.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but zufang doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><script src="https://app.gter.net/bottom?tpl=header&menukey=fang"></script><div id="app"></div><div style="display: none;"><script src="//v1.cnzz.com/z_stat.php?id=1281224882&web_id=1281224882"></script><script>var _hmt = _hmt || []
|
||||
;(function () {
|
||||
var hm = document.createElement("script")
|
||||
hm.src = "//hm.baidu.com/hm.js?4bd66cbe45a640b607fe46c48f658746"
|
||||
var s = document.getElementsByTagName("script")[0]
|
||||
s.parentNode.insertBefore(hm, s)
|
||||
})()</script></div><script src="https://app.gter.net/bottom?tpl=footer"></script></body></html>
|
||||
1
dist/js/306.7135e2cb.js
vendored
Normal file
1
dist/js/306.7135e2cb.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/js/967.421ad13d.js
vendored
1
dist/js/967.421ad13d.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
dist/js/detail.4cd32d18.js
vendored
1
dist/js/detail.4cd32d18.js
vendored
File diff suppressed because one or more lines are too long
1
dist/js/detail.fbbe3ba0.js
vendored
Normal file
1
dist/js/detail.fbbe3ba0.js
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
6
src/assets/img/detail/arrow-green.svg
Normal file
6
src/assets/img/detail/arrow-green.svg
Normal file
@@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="7px" height="12px" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="matrix(1 0 0 1 -900 -691 )">
|
||||
<path d="M 6.76909722222222 5.47265625 C 6.92303240740741 5.62109375 7 5.796875 7 6 C 7 6.203125 6.92303240740741 6.37890625 6.76909722222222 6.52734375 L 1.32465277777778 11.77734375 C 1.17071759259259 11.92578125 0.988425925925926 12 0.777777777777778 12 C 0.56712962962963 12 0.384837962962963 11.92578125 0.230902777777778 11.77734375 C 0.0769675925925926 11.62890625 0 11.453125 0 11.25 L 0 0.75 C 0 0.546874999999998 0.0769675925925926 0.371093749999998 0.230902777777778 0.22265625 C 0.384837962962963 0.0742187499999991 0.56712962962963 0 0.777777777777778 0 C 0.988425925925926 0 1.17071759259259 0.0742187499999991 1.32465277777778 0.22265625 L 6.76909722222222 5.47265625 Z " fill-rule="nonzero" fill="#50e3c2" stroke="none" transform="matrix(1 0 0 1 900 691 )" />
|
||||
</g>
|
||||
</svg>
|
||||
@@ -131,6 +131,9 @@ let props = defineProps({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
school: {
|
||||
type: String,
|
||||
},
|
||||
})
|
||||
let data = reactive({ data: {} })
|
||||
//显示样式
|
||||
@@ -170,8 +173,9 @@ let watchInfo = () => {
|
||||
store.state.seachSelect["seachPage"][key] = seachData[key]
|
||||
}
|
||||
}
|
||||
// console.log(document.location.origin)
|
||||
window.open(`${document.location.origin}/detail?id=${data.data.uniqid}`)
|
||||
let url = `${document.location.origin}/detail?id=${data.data.uniqid}`
|
||||
if (props.school) url += `&school=${props.school}`
|
||||
window.open(url)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
@@ -221,7 +221,7 @@
|
||||
<div class="title-box">
|
||||
所在楼层
|
||||
</div>
|
||||
<span class="text"> {{ housingInfo["data"] && housingInfo["data"].info.floor }}  </span>
|
||||
<span class="text"> {{ housingInfo["data"] && housingInfo["data"].info.floor }} </span>
|
||||
|
||||
<span class="text" style="margin-left: 0;" v-if="housingInfo['data'] && housingInfo['data'].info.elevator && housingInfo['data'].info.elevator != -1">
|
||||
<span style="color: #d7d7d7;">|</span>
|
||||
@@ -306,31 +306,70 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- -->
|
||||
|
||||
<div class="dis-f jus-x pos-r" v-if="distanceList[0] && distanceList[0].name && pageType != 3 && distanceList.length > 1">
|
||||
<!-- <div class="distance-info-box pos-r" :class="{ 'show-distance-info-box': showDistance }" :style="{ 'height': showDistance ? `${70 + 42 + 82 * distanceList.length - 1}px` : '0px' }"> -->
|
||||
<div class="distance-info-box pos-r show-distance-info-box" style="height: 611px;">
|
||||
<div class="distance-info-box pos-r" :class="{ 'show-distance-info-box': showDistance }" :style="{ height: showDistance ? `${50 * annexSchoolList.length + 70}px` : '0px' }">
|
||||
<div class="title-box dis-f al-item jus-x">
|
||||
房源
|
||||
<img class="distance-arrow" src="@/assets/img/detail/arrow-circle-blue.svg" />
|
||||
院校
|
||||
<img src="../assets/img/detail/close.png" class="close-icon" @click="showDistance = false" alt="" />
|
||||
</div>
|
||||
<el-scrollbar v-if="distanceList.length > 0" height="541px">
|
||||
<div class="distance-info-data dis-f">
|
||||
<div class="distance-info-left">
|
||||
<div class="distance-info-left-item flexcenter pitch" v-for="(item, index) in 15" :key="index">中大</div>
|
||||
<div class="distance-info-left-item flexcenter" :class="{ 'pitch': index == academyPitchIndex }" v-for="(item, index) in annexSchoolList" :key="index" @click="selectAcademyIndex(index)">{{ item.alias }}</div>
|
||||
</div>
|
||||
|
||||
<el-scrollbar v-if="distanceList.length > 0" :style="{ height: 50 * annexSchoolList.length + 'px' }">
|
||||
<div class="distance-info-right flex1">
|
||||
<div class="distance-header-box flexacenter">
|
||||
<div class="flexacenter">
|
||||
<div class="distance-header-icon flexcenter">
|
||||
<img src="@/assets/img/detail/home.png" alt="" class="distance-header-img" />
|
||||
</div>
|
||||
香港科技大学
|
||||
{{ targetAcademyPitch.school }}
|
||||
</div>
|
||||
<div class="distance-header-hint">
|
||||
本数据来自高德地图，仅供参考。
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="academy-school-item" v-for="(item, index) in targetAcademyPitch.list" :key="index">
|
||||
<div class="academy-school-item-header flexacenter">
|
||||
<div class="academy-school-item-left flexacenter">
|
||||
<div class="academy-school-item-name">{{ item.title }}</div>
|
||||
<div class="academy-school-item-number">{{ item.distanceText || "1km" }}</div>
|
||||
</div>
|
||||
<div class="academy-school-item-right flexacenter">
|
||||
<img v-if="item.publictransport" class="academy-school-item-icon" src="@/assets/img/detail/subway-icon.png" mode="widthFix" />
|
||||
<img v-else class="academy-school-item-icon" src="@/assets/img/detail/walk-icon.png" mode="widthFix" />
|
||||
<div class="academy-school-item-time">{{ item?.publictransport?.durationText || item.durationText || "1分钟" }}</div>
|
||||
</div>
|
||||
<img class="arrow-green" mode="widthFix" src="@/assets/img/detail/arrow-green.svg" />
|
||||
</div>
|
||||
<div class="academy-school-item-journey" v-if="item.publictransport">
|
||||
<div class="journey-item flexacenter" v-for="(item, index) in item.publictransport.segments" :key="index">
|
||||
<div class="circle"></div>
|
||||
<!-- 步行 骑行 -->
|
||||
<div v-if="item.type == 'walking'" class="journey-value flex1">步行{{ item.distanceText }}</div>
|
||||
<!-- 地铁 -->
|
||||
<div v-else-if="item.type == 'bus' && item.bustype == '地铁线路'" class="journey-value flex1 subway flexacenter">
|
||||
<div class="subway-name flexcenter">{{ item.name }}</div>
|
||||
<div class="flex1" style="white-space: nowrap;">{{ item.via_num }}站·{{ item.durationText }}</div>
|
||||
</div>
|
||||
<!-- 公交 -->
|
||||
<div v-else-if="item.type == 'bus' && item.bustype == '普通公交线路'" class="journey-value flex1 bus flexacenter">
|
||||
<div class="bus-name flexcenter">{{ item.name }}</div>
|
||||
<div class="flex1" style="white-space: nowrap;">{{ item.via_num }}站·{{ item.durationText }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
|
||||
<!-- <div class="dis-f al-item school-info" v-for="(item, index) in distanceList" :key="index" :class="{ 'mg-t-50': index > 0 }">
|
||||
<div class="icon-box dis-f al-item jus-x" :class="{ 'home-icon': item && item.address }">
|
||||
<div class="line" v-show="index > 0"></div>
|
||||
@@ -346,30 +385,36 @@
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
<!-- </el-scrollbar> -->
|
||||
</div>
|
||||
<div class="distance-box dis-f jus-bet">
|
||||
<div class="dis-f al-item" style="position: relative;" @click="setShowDistance">
|
||||
<div class="dis-f al-item s-w-100" style="position: absolute;">
|
||||
<div class="line-school-box dis-f al-item s-w-100" style="justify-content: space-around;">
|
||||
<div v-for="(item, i) in distanceList" class="box-text" :key="item && item.id" v-show="i < 6 && item.id">
|
||||
<!-- <div :class="{ 'far-s': item && item.recently_distance > 4 }" v-if="item && !item.address" class="text-c"> -->
|
||||
<!-- <div :class="{ 'far-s': item && item.recently_distance > 4 }" v-if="item && !item.address" class="text-c">
|
||||
{{ item && item.recently_distance }}km
|
||||
</div> -->
|
||||
<div class="distance-item-value flexacenter">
|
||||
<div class="mileage">1.1km</div>
|
||||
<img class="tool-icon" src="@/assets/img/detail/walk-icon.png" />
|
||||
<!-- <img class="tool-icon" src="@/assets/img/detail/subway-icon.png" /> -->
|
||||
<div class="tool-time">21min</div>
|
||||
<div class="box-text" v-if="specialSchoolDistance">
|
||||
<div class="distance-item-value special flexacenter">
|
||||
<div class="mileage">{{ specialSchoolDistance.distanceText }}</div>
|
||||
<img v-if="specialSchoolDistance.toolText == '步行'" class="tool-icon" src="@/assets/img/detail/walk-icon.png" />
|
||||
<img v-else class="tool-icon" src="@/assets/img/detail/subway-icon.png" />
|
||||
<!-- subway-icon -->
|
||||
<div class="tool-time">{{ specialSchoolDistance.durationText }}</div>
|
||||
</div>
|
||||
<div class="dis-f jus-x" v-if="item && !item.address">
|
||||
<div class="dis-f jus-x">
|
||||
<img src="../assets/img/detail/markIcon.svg" class="marker-icon" alt="" />
|
||||
<!-- <img src="../assets/img/detail/markIcon.svg" v-if="item && item.recently_distance <= 4" class="marker-icon" alt="" /> -->
|
||||
<!-- <img src="../assets/img/detail/markIconNot.svg" v-if="item && item.recently_distance > 4" class="marker-icon" alt="" /> -->
|
||||
</div>
|
||||
<!-- <div :class="{ 'far-s': item && item.recently_distance > 4 }" class="text-c" v-if="item && !item.address">{{ item && item.alias }}</div> -->
|
||||
<div class="text-c" v-if="item && !item.address">{{ item && item.alias }}</div>
|
||||
<div class="text-c">{{ specialSchoolDistance.alias }}</div>
|
||||
</div>
|
||||
<div v-for="(item, i) in annexSchoolOmit" class="box-text" :key="i">
|
||||
<div class="distance-item-value flexacenter">
|
||||
<div class="mileage">{{ item.distanceText }}</div>
|
||||
<img v-if="!item.list[0].publictransport" class="tool-icon" src="@/assets/img/detail/walk-icon.png" />
|
||||
<img v-else class="tool-icon" src="@/assets/img/detail/subway-icon.png" />
|
||||
<div class="tool-time">{{ item.list[0].durationText2 }}</div>
|
||||
</div>
|
||||
<div class="dis-f jus-x">
|
||||
<img src="../assets/img/detail/markIcon.svg" class="marker-icon" alt="" />
|
||||
</div>
|
||||
<div class="text-c">{{ item.alias }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -534,7 +579,7 @@
|
||||
<div>
|
||||
<div class="body-maxWidth" v-show="recommendListData.length > 0">
|
||||
<div ref="gridContainer" style="margin-top: 15px; display: flex; flex-wrap: wrap; margin-bottom: 50px; width: 876px;">
|
||||
<indexWaterfallBox v-for="(items, i) in recommendListData" :data="items" :key="items.id"> </indexWaterfallBox>
|
||||
<indexWaterfallBox v-for="items in recommendListData" :data="items" :key="items.id"> </indexWaterfallBox>
|
||||
</div>
|
||||
</div>
|
||||
<div class="body-maxWidth" v-if="publisherList.length > 0">
|
||||
@@ -808,7 +853,6 @@ let moveImageList = type => {
|
||||
if (type === "right" && imgScrollBottom()) return
|
||||
if ((type === "left" && imgListTab.value === 0) || (imgListTab.value === imageLIstLeft.value.length - 1 && type === "right")) return
|
||||
type === "left" ? imgListTab.value-- : imgListTab.value++
|
||||
// console.log(imageLIstLeft.value[imgListTab.value])
|
||||
setOffsetWidth(imageLIstLeft.value[imgListTab.value], type)
|
||||
}
|
||||
//设置滚动
|
||||
@@ -845,7 +889,6 @@ let setImageWidth = num => {
|
||||
clientWidth.value = imageList.value.clientWidth
|
||||
scrollWidth.value = imageList.value.scrollWidth
|
||||
}
|
||||
// console.log(imageLIstLeft.value)
|
||||
}
|
||||
|
||||
//学校地址数据
|
||||
@@ -994,7 +1037,6 @@ let getHousingInfo = () => {
|
||||
uniqid: uniqid.value,
|
||||
uid: store.state.user.uid,
|
||||
}).then(res => {
|
||||
// console.log(res)
|
||||
if (res.code === 200) {
|
||||
const data = res.data
|
||||
housingInfo["data"] = res.data
|
||||
@@ -1032,7 +1074,6 @@ let setOperation = () => {
|
||||
api.operation({
|
||||
token: housingInfo["data"].token,
|
||||
}).then(res => {
|
||||
// console.log(res)
|
||||
if (res.code === 200) {
|
||||
housingInfo["data"].info.count_fav = res.data.count
|
||||
housingInfo["data"].isfav = res.data.status
|
||||
@@ -1119,7 +1160,6 @@ let recommendList = () => {
|
||||
pagevalue: pagevalue.value,
|
||||
token: housingInfo["data"].token,
|
||||
}).then(res => {
|
||||
// console.log(res)
|
||||
if (res.code === 200) {
|
||||
if (res.data.data && res.data.data.length >= 30) {
|
||||
loadMore.value = true
|
||||
@@ -1160,7 +1200,6 @@ let getPublisherList = () => {
|
||||
limit: 30,
|
||||
token: housingInfo["data"].token,
|
||||
}).then(res => {
|
||||
// console.log(res)
|
||||
if (res.code === 200) {
|
||||
if (res.data.length >= 30) {
|
||||
loadMore.value = true
|
||||
@@ -1184,21 +1223,25 @@ let masonryInstance = null
|
||||
let router = useRouter()
|
||||
let route = useRoute()
|
||||
|
||||
let pitchSchool = "" // 筛选页面带过来的 学校ID
|
||||
|
||||
watch(route, () => {
|
||||
let { id } = router.currentRoute.value.query
|
||||
uniqid.value = id
|
||||
pitchSchool = route.query["school"] || ""
|
||||
pageType.value = housingInfo["data"]["info"].intermediary === 1 ? 2 : housingInfo["data"]["info"].intermediary === 6 ? 3 : 1 //1个人 2中介 3求房源
|
||||
publisherList.value = []
|
||||
recommendListData.value = []
|
||||
getHousingInfo()
|
||||
// distanceSchool()
|
||||
distanceSchool()
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
let { id } = router.currentRoute.value.query
|
||||
uniqid.value = id
|
||||
pitchSchool = route.query["school"] || ""
|
||||
getHousingInfo()
|
||||
// distanceSchool()
|
||||
distanceSchool()
|
||||
masonryInstance = new Masonry(gridContainer.value, {
|
||||
itemSelector: ".item",
|
||||
gutter: 10,
|
||||
@@ -1218,8 +1261,100 @@ const distanceSchool = () => {
|
||||
api.detailsDistance({
|
||||
uniqid: uniqid.value,
|
||||
}).then(res => {
|
||||
console.log("res", res)
|
||||
const data = res.data
|
||||
if (res.code != 200) return
|
||||
|
||||
let specialSchoolDistanceTarget = null
|
||||
let academyPitchIndexTarget = 0
|
||||
const school = pitchSchool || ""
|
||||
let annexSchoolOmitTarget = []
|
||||
data.forEach((element, index) => {
|
||||
element["distanceText"] = metersToKilometers(element.distance)
|
||||
element.list.forEach(ele => {
|
||||
ele["durationText"] = secondsToHoursMinutes(ele.duration, "chinese")
|
||||
ele["durationText2"] = secondsToHoursMinutes(ele.duration)
|
||||
ele["distanceText"] = metersToKilometers(ele.distance)
|
||||
if (Object.prototype.toString.call(ele.publictransport) === "[object Object]") {
|
||||
ele.publictransport["durationText"] = secondsToHoursMinutes(ele?.publictransport?.duration || 0, "chinese")
|
||||
ele.publictransport["durationText2"] = secondsToHoursMinutes(ele?.publictransport?.duration || 0)
|
||||
const segments = ele.publictransport["segments"]
|
||||
if (Array.isArray(segments)) {
|
||||
segments.forEach(e => {
|
||||
e["via_num"] = 1 + Math.floor(e.via_num)
|
||||
e["durationText"] = secondsToHoursMinutes(e.duration)
|
||||
e["distanceText"] = metersToKilometers(e.distance, "chinese")
|
||||
})
|
||||
}
|
||||
} else ele.publictransport = null
|
||||
})
|
||||
|
||||
if (school == element.id) {
|
||||
academyPitchIndexTarget = index
|
||||
const obj = element.list[0] || {}
|
||||
let toolText = "步行"
|
||||
if (Object.prototype.toString.call(obj.publictransport) === "[object Object]") toolText = "公交地铁"
|
||||
specialSchoolDistanceTarget = {
|
||||
alias: element.alias,
|
||||
distanceText: obj["distanceText"],
|
||||
durationText: obj.publictransport?.durationText2 || obj["durationText2"],
|
||||
toolText,
|
||||
}
|
||||
} else annexSchoolOmitTarget.push(element)
|
||||
})
|
||||
|
||||
if (specialSchoolDistanceTarget) annexSchoolOmitTarget = annexSchoolOmitTarget.slice(0, 4)
|
||||
else annexSchoolOmitTarget = annexSchoolOmitTarget.slice(0, 5)
|
||||
|
||||
annexSchoolOmit.value = annexSchoolOmitTarget
|
||||
annexSchoolList.value = data
|
||||
targetAcademyPitch.value = data[academyPitchIndexTarget]
|
||||
specialSchoolDistance.value = specialSchoolDistanceTarget
|
||||
academyPitchIndex.value = academyPitchIndexTarget
|
||||
})
|
||||
}
|
||||
|
||||
let annexSchoolOmit = ref([]) // 附近院校 前面 7个 或者 6个的
|
||||
let annexSchoolList = ref([]) // 附近院校数据
|
||||
let academyPitchIndex = ref(0) // 附近学校距离选中院校 下标
|
||||
let targetAcademyPitch = ref({}) // 附近学校距离选中院校 数据
|
||||
let specialSchoolDistance = ref(null) // 特殊的 用户带有school参数 则需要特殊显示 学校距离
|
||||
|
||||
// 选择附近学校距离的学校下标
|
||||
const selectAcademyIndex = index => {
|
||||
academyPitchIndex.value = index || 0
|
||||
targetAcademyPitch.value = annexSchoolList.value[academyPitchIndex.value]
|
||||
}
|
||||
|
||||
// 转换 秒数
|
||||
const secondsToHoursMinutes = (seconds, type) => {
|
||||
// 计算小时数
|
||||
const hours = Math.floor(seconds / 3600)
|
||||
// 计算剩余的秒数
|
||||
const remainingSecondsAfterHours = seconds % 3600
|
||||
// 计算分钟数
|
||||
const minutes = Math.floor(remainingSecondsAfterHours / 60)
|
||||
// 计算剩余的秒数
|
||||
const remainingSeconds = remainingSecondsAfterHours % 60
|
||||
|
||||
let text = ""
|
||||
if (type == "chinese") {
|
||||
if (hours != 0) text += hours + "小时"
|
||||
if (minutes != 0) text += minutes + "分钟"
|
||||
if (remainingSeconds != 0 && minutes == 0) text += remainingSeconds + "秒"
|
||||
} else {
|
||||
if (hours != 0) text += hours + "h"
|
||||
if (minutes != 0) text += minutes + "min"
|
||||
if (remainingSeconds != 0 && minutes == 0) text += remainingSeconds + "s"
|
||||
}
|
||||
return text
|
||||
}
|
||||
|
||||
// 转换 米数
|
||||
const metersToKilometers = (input, type) => {
|
||||
let text = ""
|
||||
if (input >= 1000) text = (input / 1000).toFixed(1) + (type == "chinese" ? "公里" : "km")
|
||||
else text = input + (type == "chinese" ? "米" : "m")
|
||||
return text
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
@@ -2536,7 +2671,7 @@ img {
|
||||
top: 130px;
|
||||
z-index: 666;
|
||||
width: 100%;
|
||||
max-height: 610px;
|
||||
// max-height: 610px;
|
||||
transition: all 0.2s linear;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -2832,23 +2967,30 @@ img {
|
||||
width: 70px;
|
||||
flex-direction: column;
|
||||
border-right: 1px solid #ebebeb;
|
||||
box-sizing: content-box;
|
||||
|
||||
.distance-info-left-item {
|
||||
width: 69px;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
box-sizing: content-box;
|
||||
font-size: 16px;
|
||||
color: #555555;
|
||||
cursor: pointer;
|
||||
&.pitch {
|
||||
font-weight: 650;
|
||||
color: #000000;
|
||||
background: linear-gradient(to right, rgba(255, 255, 255, 0.8) -14%, rgba(80, 227, 194, 0.8) 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.distance-info-right {
|
||||
padding: 30px 40px;
|
||||
.distance-header-box {
|
||||
color: #333333;
|
||||
font-weight: 650;
|
||||
font-size: 20px;
|
||||
|
||||
margin-bottom: 30px;
|
||||
justify-content: space-between;
|
||||
.distance-header-icon {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
@@ -2861,6 +3003,162 @@ img {
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.distance-header-hint {
|
||||
color: #a09e9e;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.academy-school-item {
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
border-radius: 12px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.academy-school-item-header {
|
||||
font-size: 18px;
|
||||
width: 670px;
|
||||
height: 65px;
|
||||
justify-content: space-between;
|
||||
padding-left: 22px;
|
||||
padding-right: 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.academy-school-item-header .arrow-green {
|
||||
width: 7px;
|
||||
height: 12px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.academy-school-item-name {
|
||||
font-family: "PingFangSC-Semibold", "PingFang SC Semibold", "PingFang SC", sans-serif;
|
||||
font-weight: 650;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.academy-school-item-number {
|
||||
color: rgb(51, 51, 51);
|
||||
margin-left: 4px;
|
||||
font-weight: 400;
|
||||
font-family: "ArialMT", "Arial", sans-serif;
|
||||
}
|
||||
|
||||
.academy-school-item-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.academy-school-item-time {
|
||||
color: #000;
|
||||
font-weight: 650;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.academy-school-item-journey {
|
||||
border-top: 1px solid #ebebeb;
|
||||
padding-top: 22px;
|
||||
padding-left: 22px;
|
||||
padding-bottom: 30px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.journey-item {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.journey-item:not(:last-of-type) {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.academy-school-item-journey::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 26.4px;
|
||||
width: 1px;
|
||||
height: 100%;
|
||||
display: block;
|
||||
background-image: linear-gradient(to bottom, #aaaaaa 50%, transparent 50%);
|
||||
background-size: 1px 4px; /* 控制虚线的宽度和间距 */
|
||||
}
|
||||
|
||||
.journey-item:first-of-type::after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: -22px;
|
||||
left: 0;
|
||||
width: 9px;
|
||||
height: calc(50% + 22px);
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
}
|
||||
|
||||
.journey-item:last-of-type::after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: -30px;
|
||||
left: 0;
|
||||
width: 9px;
|
||||
height: calc(50% + 30px);
|
||||
background-color: rgba(246, 246, 246, 1);
|
||||
}
|
||||
|
||||
.journey-item .circle {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
border-radius: 50%;
|
||||
background-color: #f6f6f6;
|
||||
border: 1px solid #797979;
|
||||
box-sizing: border-box;
|
||||
margin-right: 20px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.journey-item .journey-value {
|
||||
color: #333;
|
||||
font-size: 15px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.journey-item .journey-value.subway {
|
||||
color: #aaaaaa;
|
||||
}
|
||||
|
||||
.journey-item .journey-value.subway .subway-name {
|
||||
padding: 3.5px 11px;
|
||||
background-color: rgba(51, 51, 51, 1);
|
||||
border-radius: 10px;
|
||||
color: #fff;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.journey-item .journey-value.bus {
|
||||
color: #aaaaaa;
|
||||
}
|
||||
|
||||
.journey-item .journey-value.bus .bus-name {
|
||||
padding: 3.5px 11px;
|
||||
background-color: rgba(80, 227, 194, 0);
|
||||
box-sizing: border-box;
|
||||
border: 1px solid rgba(51, 51, 51, 1);
|
||||
border-radius: 10px;
|
||||
margin-right: 10px;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.academy-school-hint {
|
||||
color: #a09e9e;
|
||||
font-size: 15px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<div class="dis-f jus-x al-item">
|
||||
<div class="body-maxWidth mg-t-35">
|
||||
<div v-show="dataList.data && dataList.data.length > 0" ref="list">
|
||||
<biserialItem v-for="(item, i) in pageList" :key="i" :item="item"></biserialItem>
|
||||
<biserialItem v-for="(item, i) in pageList" :key="i" :item="item" :school="school"></biserialItem>
|
||||
</div>
|
||||
<div class="dis-f jus-x no-list-box al-item" v-show="dataList.data && dataList.data.length === 0">
|
||||
<noList hint-text-two="建议放宽筛选条件"></noList>
|
||||
@@ -15,7 +15,7 @@
|
||||
<!-- 其他附近房源 -->
|
||||
<div v-if="moreList.length != 0" class="other-nearby-listings-box flexcenter">没有找到更多房源，为您推荐其他附近房源</div>
|
||||
<div style="width: 1200px;" ref="moreShowList">
|
||||
<biserialItem v-for="(item, i) in moreList" :key="i" :item="item"></biserialItem>
|
||||
<biserialItem v-for="(item, i) in moreList" :key="i" :item="item" :school="school"></biserialItem>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -58,6 +58,9 @@ let loading = ref(true)
|
||||
let loadingText = ref(" 下拉加载更多 ")
|
||||
provide("count", dataCount)
|
||||
|
||||
let school = ref("") // 单独提前 选中的学校id 需要 在跳转页面中使用
|
||||
|
||||
|
||||
//轮播
|
||||
// let bannerList = reactive({ data: [] })
|
||||
// let banner = () => {
|
||||
@@ -92,6 +95,8 @@ let getDataList = data => {
|
||||
...data,
|
||||
}
|
||||
|
||||
school.value = postData["school"] || ""
|
||||
|
||||
moreList.value = []
|
||||
window.removeEventListener("scroll", getMoreScroll, true)
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<div class="dis-f jus-x al-item">
|
||||
<div class="body-maxWidth mg-t-35">
|
||||
<div v-show="dataList.data && dataList.data.length > 0" style="width: 1200px;" ref="list">
|
||||
<biserialItem v-for="(item, i) in pageList" :key="i" :item="item"></biserialItem>
|
||||
<biserialItem v-for="(item, i) in pageList" :key="i" :item="item" :school="school"></biserialItem>
|
||||
</div>
|
||||
<div class="dis-f jus-x no-list-box al-item" v-show="dataList.data && dataList.data.length === 0">
|
||||
<noList hint-text-two="建议放宽筛选条件"></noList>
|
||||
@@ -15,7 +15,7 @@
|
||||
<!-- 其他附近房源 -->
|
||||
<div v-if="moreList.length != 0" class="other-nearby-listings-box flexcenter">没有找到更多房源，为您推荐其他附近房源</div>
|
||||
<div style="width: 1200px;" ref="moreShowList">
|
||||
<biserialItem v-for="(item, i) in moreList" :key="i" :item="item"></biserialItem>
|
||||
<biserialItem v-for="(item, i) in moreList" :key="i" :item="item" :school="school"></biserialItem>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -61,6 +61,8 @@ let pageList = ref([])
|
||||
let seachSelectData = reactive({ data: {} })
|
||||
let loading = ref(true)
|
||||
let loadingText = ref(" 下拉加载更多 ")
|
||||
|
||||
let school = ref("") // 单独提前 选中的学校id 需要 在跳转页面中使用
|
||||
provide("count", dataCount)
|
||||
|
||||
const { proxy } = getCurrentInstance()
|
||||
@@ -77,16 +79,6 @@ let setSeachSelectData = (data, noMask = false) => {
|
||||
getDataList(seachSelectData.data)
|
||||
}
|
||||
|
||||
//轮播
|
||||
// let bannerList = reactive({ data: [] })
|
||||
// let banner = () => {
|
||||
// api.banner().then(res => {
|
||||
// if (res.code === 200) {
|
||||
// bannerList.data = res.data
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
|
||||
//获取搜索数据
|
||||
let getDataList = data => {
|
||||
loadingText.value = " 加载中..... "
|
||||
@@ -97,6 +89,8 @@ let getDataList = data => {
|
||||
intermediary: 0,
|
||||
...data,
|
||||
}
|
||||
school.value = postData["school"] || ""
|
||||
|
||||
if (!postData["orderby"]) postData["orderby"] = "default"
|
||||
|
||||
moreList.value = []
|
||||
|
||||
Reference in New Issue
Block a user