gter.net/gterFang
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
A1300399510 2023-07-21 15:13:46 +08:00
parent d53616c347
commit 955d8cf3b3
5 changed files with 180 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/assets/img/apartmentDetail/media-icon.svg Normal file
View File

@ -0,0 +1,21 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="53px" height="53px" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter x="-50.00%" y="-50.00%" width="200.00%" height="200.00%" filterUnits="objectBoundingBox" id="filter1182">
<feColorMatrix type="matrix" values="1 0 0 0 1 0 1 0 0 1 0 0 1 0 1 0 0 0 1 0 " in="SourceGraphic" />
</filter>
<filter x="400px" y="978px" width="53px" height="53px" filterUnits="userSpaceOnUse" id="filter1183">
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetInner" />
<feGaussianBlur stdDeviation="5" in="shadowOffsetInner" result="shadowGaussian" />
<feComposite in2="shadowGaussian" operator="atop" in="SourceAlpha" result="shadowComposite" />
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.662745098039216 0 " in="shadowComposite" />
</filter>
<g id="widget1184">
<image preserveAspectRatio="none" style="overflow:visible" width="33" height="33" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAQKADAAQAAAABAAAAQAAAAABGUUKwAAAEVElEQVR4Ae2bvY7TQBDHly8JJIqUdFxJR3gCTEdHrqMjPMFBR3fhDe4NYp4guSe40NFd7g1S0iWRKJD4OH6j+KSNbzdex7N2LLzSyvYyOzP//87Mrp3DmK51DHQMdAz8xwzcqQP7fWNeYieh9+lH15srt9sNZ+aMLOhynf025ivXdrYHxrwD+OSeMddVuugQXa1goWdMD4dPAbysAtozdym6xcZBkhEReD6ClkTEycGQgDN9wF96Vi3vvNqz2BTbjRIhK1E38Ly9xqIBR8Z5Zxp8HtcWCVmhu2gQrDONSInJPgWy9DkAQxfs40ltjJcwBJgpZ4fjElMMCxneEJZQG4TPqF3y2d3NQes81HIwARSbD6z8p1DFDcrJrrT+a8y3EB+CUkC2GxRehig8FBki4cWvzZF6p0vIFTdWXkK/VS3U58IUIJxGKHurgZ5wu0LPI/pDDX0FOp6USQWnLtlWYEjrXJ+KEZAf4dgcvc7tTHl8WbQ17kyBHxQ+fEZH9cbqL0TLT66PN9vol+paCzX0MgyFgk4BxdW/llTKG5GdRXnFXVG1zNu1n70RgHNDBFVW3zZo31Olz4iMV4yt7XHle0njgU+nlwAKn3eST9k+45zcZjiRQIQUyCgN3UOf4l0EvPFN0h6X/VrqAo4Gn+DK+MBierE4CSBfkzIGNGRXxqyIhgEkfNbQl9fhw+QkgMlJXkFdz5AwwtYxXbsuJOi81XwE9G9J1jjwh7c6HNOuC05MPgKe1ojXaSpCXXBichJA0XCy5fQ04qBmXfBhchIQEdNeqqUu4Oh7JmvXBdMKAoQ1UiLlMqSrttYQoIraUtYaArLj7NjyXeW2FQRwiDkF7YTeU0FtKXESwGnsypJp7Ba08lvjhAo+quqED5OTAIwtqhqsOl++Q/IuL5/gB1V1ZfMXLj0+AuYu4brGJN/5CCvg+4o2nZh8BMwUDZdSFTHfnZiwd7vJOzqrUGvrke+E/Fgx5Lf8F0xbA9mDLwIMRePcNSHGmHwoVc73LTd3YdlFwHRLS6QHQjDhlHepnO9b3qI73RqwHrwEZEdP9bO3ZdtQ6U9w7oIxMiBaW8vrtU+7lwCZQOic+SZWGQetfKgcU+mj6Ld9q4Qhc3SFs67PzWXHUnEs+2Gkrj+pWQkGm5DS9+ToSIkA+W1AgGv90lS4AKTYhyLAREhxw/E5ufq8WPJwJAB2xdbXL/JoZw24mYyy4c19W66hPhORxY1i9Z0oWBMFr4ulm5dgVT+yi03VPYGtlF6Yew3LpOrAbYVEwrRhgN4FEN9sX6Pc99hWDpEE8Ul8iwLapfTA0iF1+Rh9TPbZptMhZK+PSgQOyJ+lzesmQmyK7ajgyijPokHr2OwtdBC9anzVfcRkBVKOzjGIWLHqo1oLnQ9oyDgkDKQyV02NTMcgxOY+MkHvAvsotucAIuFZuuSs/Kcp53uFnN/59wV9Tpf/NDXj2rWOgY6BjoGOgVgM/AP9HjGMza5aZwAAAABJRU5ErkJggg==" x="410px" y="988px" filter="url(#filter1182)" />
</g>
</defs>
<g transform="matrix(1 0 0 1 -400 -978 )">
<use xlink:href="#widget1184" filter="url(#filter1183)" />
<use xlink:href="#widget1184" />
</g>
</svg>

37
src/components/apartment/seachModule.vue
View File

@ -18,7 +18,8 @@
popper-style="background: transparent;padding:0;box-shadow: none;border: none;transform: translateX(50px);">
<template #reference>
<el-input class="search-input" v-model="pitchValue['keyword']" placeholder="搜索房源或输入房源ID"
@keyup.enter='handleKeyword(pitchValue["keyword"])' style="height:48px;width:460px;"></el-input>
@keyup.enter='handleKeyword(pitchValue["keyword"])'
style="height:48px;width:460px;"></el-input>
</template>
<div class="dis-f al-item pos-r">
<div class="seach-hiosory-box scrollbar" :class="{ 'seach-history-h': historyShow }">
@ -54,7 +55,7 @@
发布房源
</div>
<el-popover placement="bottom-end" popper-class="consult-popover flexcenter" :width="300"
<el-popover placement="bottom-end" popper-class="consult-popover flexcenter" :width="300"
trigger="click" :show-arrow="false"
popper-style="background-color:transparent;border: none;box-shadow: none;padding:0;">
<template #reference>
@ -70,8 +71,8 @@
</div>
<div class="consult-hint">微信扫码添加好友</div>
<div class="consult-remark flexacenter">备注：<b>寄托租房</b></div>
</div>
<!-- <img class="QR-code" :src="wechat['wechatqrcode']" alt=""> -->
</el-popover>
</div>
@ -181,6 +182,31 @@ const usestore = useStore();
const { wechat } = toRefs(usestore.state);
const router = useRouter()
const value = ref('')
const options = [
{
value: 'Option1',
label: 'Option1',
},
{
value: 'Option2',
label: 'Option2',
},
{
value: 'Option3',
label: 'Option3',
},
{
value: 'Option4',
label: 'Option4',
},
{
value: 'Option5',
label: 'Option5',
},
]
const props = defineProps({
count: {
type: Number,
@ -348,7 +374,7 @@ const selectOption = (type, value) => {
}
.seach-box-bg {
background: #d7d7d7;
// background: #d7d7d7;
border-radius: 16px;
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
@ -358,8 +384,9 @@ const selectOption = (type, value) => {
.seach-box {
background: #FFFFFF;
transform: translate(0, 3px);
// transform: translate(0, 3px);
border-radius: 16px;
filter: drop-shadow(0px3px 0px #d7d7d7);
.top-seach {
padding: 20px;

127
src/views/apartmentDetail.vue
View File

@ -25,21 +25,49 @@
<div class="details-left flex1">
<div class="type-box">
<div class="type-item">
<div class="type-name">双人套间A</div>
<div class="type-left flex1">
<div class="type-name">双人套间A</div>
<div class="type-tags flexacenter">
<div class="tags-item flexcenter" :class="{ 'first': item == 1 }" v-for="item in 4">仅剩1间
</div>
</div>
<div class="media-box flexflex">
<div class="media-item flexcenter" v-for="item in 5">
<img class="media-img"
src="https://axure-file.lanhuapp.com/md5__c1c85f2680e7e9a2026de4d381081fc6.svg">
<img class="media-icon" src="@/assets/img/apartmentDetail/media-icon.svg" />
</div>
</div>
</div>
<div class="type-right">
<div class="price-box flexflex">
<div class="former">HK$ 7600/月</div>
<div class="new flexacenter">
<div class="unit">HK$</div>
<div class="cost">8200</div>
/月
</div>
</div>
<div class="consult-btn flexcenter">咨询</div>
</div>
</div>
</div>
</div>
<div class="details-right"></div>
<div class="details-right flexacenter">
</div>
</div>
</div>
</template>
<script setup>
import { ref } from 'vue';
import pageTopBar from '../components/pageTopBar/pageTopBar.vue';
const uniqid = "1qfWOLTPbyPH"
let input = ref("")
</script>
<style lang="less" scoped>
@ -152,7 +180,100 @@ const uniqid = "1qfWOLTPbyPH"
.details-left {
.type-box {
.type-item {
height: ;
width: 876px;
height: 230px;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(235, 235, 235, 1);
border-radius: 16px;
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
font-size: 14px;
.type-left {
.type-name {
font-weight: 650;
font-size: 20px;
color: #000000;
}
.type-tags {
.tags-item {
height: 24px;
background-color: rgba(242, 242, 242, 1);
border-radius: 4px;
line-height: 26px;
font-size: 14px;
color: #7F7F7F;
margin-right: 8px;
padding: 0 9px;
&.first {
border: 1px solid rgba(80, 227, 194, 1);
color: #50e3c2;
background-color: #fff;
}
}
}
.media-box {
.media-item {
position: relative;
height: 80px;
margin-right: 10px;
.media-img {}
.media-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 53px;
height: 53px;
}
}
}
}
.type-right {
.price-box {
flex-direction: column;
align-items: flex-end;
.former {
color: #AAAAAA;
font-size: 14px;
text-decoration: line-through;
text-decoration-color: #797979;
}
.new {
.unit {
font-family: 'Arial-Black', 'Arial Black', sans-serif;
font-weight: 900;
color: #000000;
font-size: 16px;
}
}
}
.consult-btn {
width: 90px;
height: 40px;
background: -webkit-linear-gradient(321.966692522331deg, rgba(98, 177, 255, 1) -13%, rgba(128, 255, 255, 1) 137%);
background: -moz-linear-gradient(128.033307477669deg, rgba(98, 177, 255, 1) -13%, rgba(128, 255, 255, 1) 137%);
background: linear-gradient(128.033307477669deg, rgba(98, 177, 255, 1) -13%, rgba(128, 255, 255, 1) 137%);
border-radius: 36px;
font-weight: 400;
font-size: 16px;
color: #FFFFFF;
cursor: pointer;
}
}
}
}
}

6
src/views/housingView/apartment.vue
View File

@ -20,7 +20,6 @@
<!-- 右下角咨询 -->
<circle-btn></circle-btn>
</template>
<script setup>
@ -104,7 +103,7 @@ const handleScroll = () => {
const scrollHeight = document.documentElement.scrollHeight;
const clientHeight = document.documentElement.clientHeight;
const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if (scrollTop + clientHeight >= scrollHeight) getData()
if (scrollTop + clientHeight >= scrollHeight - 350) getData()
};
let pitchValue = {}
@ -125,6 +124,7 @@ const handleTransfer = (data) => {
<style lang="less" scoped>
.screen-box {
margin: 0 auto 20px;
// box-shadow: 0 0 3px 0 #d7d7d7;
}
.list {
@ -150,6 +150,4 @@ const handleTransfer = (data) => {
justify-content: center;
margin: 0 auto;
}
</style>

2
src/views/user.vue
View File

@ -288,7 +288,7 @@ const handleScroll = () => {
const scrollHeight = document.documentElement.scrollHeight;
const clientHeight = document.documentElement.clientHeight;
const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if (scrollTop + clientHeight >= scrollHeight) {
if (scrollTop + clientHeight >= scrollHeight - 350) {
if (tabState.value == 'publish') getPublishData()
else getFavData()
}