XiaoMo/gterFang
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

筛选 虚线优化

Browse Source
This commit is contained in:
luJianJun
2023-08-03 18:51:24 +08:00
parent 7713620e32
commit 72af528484
2 changed files with 27 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
src/components/selectTabBox/selectTabBox.vue
View File

@@ -1,7 +1,7 @@
<template> <template>
<div class="dis-f s-w-100" :style="[routePath === '/seachPage' ? '' : 'border-bottom:1px solid #ebebeb;']"> <div class="dis-f s-w-100" :style="[routePath === '/seachPage' ? '' : 'border-bottom:1px solid #ebebeb;']">
<div class="select-box s-w-50 bor-r"> <div class="select-box s-w-50">
<div class="dis-f bor-b-das" :class="{ 'al-item housing-pd': routePath === '/needHousing' }"> <div class="dis-f" :class="{ 'al-item housing-pd': routePath === '/needHousing' }">
<div class="tab-title">{{ routePath === '/needHousing' ? '目标区域' : '地理位置' }}</div> <div class="tab-title">{{ routePath === '/needHousing' ? '目标区域' : '地理位置' }}</div>
<!-- 中介/个人房源页面 --> <!-- 中介/个人房源页面 -->
<div class="tab-text" v-if="routePath !== '/needHousing'"> <div class="tab-text" v-if="routePath !== '/needHousing'">
@@ -98,7 +98,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="dis-f pad-t-b-15 bor-b-das" :class="{ 'housing-pd pd-t-25': routePath === '/needHousing' }"> <div class="bor-b-das"></div>
<div class="dis-f pad-t-b-15" :class="{ 'housing-pd pd-t-25': routePath === '/needHousing' }">
<div class="tab-title">{{ routePath === '/needHousing' ? '求租方式' : '出租方式' }}</div> <div class="tab-title">{{ routePath === '/needHousing' ? '求租方式' : '出租方式' }}</div>
<div class="tab-text dis-f al-item" style="padding-bottom:0;"> <div class="tab-text dis-f al-item" style="padding-bottom:0;">
<div class="dis-f" v-for="(item, i) in hireTypeArr" :key="i"> <div class="dis-f" v-for="(item, i) in hireTypeArr" :key="i">
@@ -131,6 +132,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="bor-b-das"></div>
<div class="dis-f al-item" style="padding:30px 0;"> <div class="dis-f al-item" style="padding:30px 0;">
<div class="tab-title">{{ routePath === '/needHousing' ? '租金预算' : '租金' }}</div> <div class="tab-title">{{ routePath === '/needHousing' ? '租金预算' : '租金' }}</div>
<div class="dis-f al-item rent-box jus-bet"> <div class="dis-f al-item rent-box jus-bet">
@@ -149,8 +151,9 @@
</div> </div>
</div> </div>
</div> </div>
<div class="bor-r"></div>
<div class="select-box s-w-50"> <div class="select-box s-w-50">
<div class="dis-f bor-b-das"> <div class="dis-f">
<div class="tab-title">租期</div> <div class="tab-title">租期</div>
<div class="select-btn-box"> <div class="select-btn-box">
<div class="dis-f"> <div class="dis-f">
@@ -161,7 +164,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="dis-f bor-b-das pd-t-20"> <div class="bor-b-das"></div>
<div class="dis-f pd-t-20">
<div class="tab-title">{{ routePath === '/needHousing' ? '求租者性别' : '性别' }}</div> <div class="tab-title">{{ routePath === '/needHousing' ? '求租者性别' : '性别' }}</div>
<div class="select-btn-box"> <div class="select-btn-box">
<div class="dis-f"> <div class="dis-f">
@@ -171,7 +175,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="dis-f bor-b-das pd-t-20"> <div class="bor-b-das"></div>
<div class="dis-f pd-t-20">
<div class="tab-title">发布时间</div> <div class="tab-title">发布时间</div>
<div class="select-btn-box"> <div class="select-btn-box">
<div class="dis-f"> <div class="dis-f">
@@ -182,6 +187,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="bor-b-das"></div>
<div class="dis-f pd-t-20"> <div class="dis-f pd-t-20">
<div class="tab-title">其他</div> <div class="tab-title">其他</div>
<div class="select-btn-box" style="margin-left:-11px;"> <div class="select-btn-box" style="margin-left:-11px;">
@@ -212,7 +218,8 @@
<div class="dis-f" style="flex-wrap: wrap;width:800px;"> <div class="dis-f" style="flex-wrap: wrap;width:800px;">
<div v-for="(item, i) in selectData.data" :key="i" class="btm-btn"> <div v-for="(item, i) in selectData.data" :key="i" class="btm-btn">
{{ item.title }} {{ item.title }}
<img src="../../assets/homeImage/closeIcon.svg" @click="deleteSelect(i, item.id)" class="img" alt=""> <img src="../../assets/homeImage/closeIcon.svg" @click="deleteSelect(i, item.id)" class="img"
alt="">
</div> </div>
</div> </div>
</div> </div>
@@ -747,7 +754,11 @@ export default {
} }
.bor-r { .bor-r {
border-right: 1px dashed #ebebeb; height: 291px;
width: 1px;
background-image: linear-gradient(to top, #d7d7d7 0%, #d7d7d7 50%, transparent 0%);
background-size: 1px 2px;
background-repeat: repeat-y;
} }
.s-w-50 { .s-w-50 {
@@ -766,16 +777,12 @@ img {
padding: 10px; padding: 10px;
} }
.transverse-line {
height: 2px;
width: 743px;
background-image: linear-gradient(to right, #d7d7d7 0%, #d7d7d7 50%, transparent 0%);
background-size: 4px 2px;
background-repeat: repeat-x;
}
.bor-b-das { .bor-b-das {
border-bottom: 1px dashed #ebebeb; height: 1px;
width: 100%;
background-image: linear-gradient(to right, #d7d7d7 0%, #d7d7d7 50%, transparent 0%);
background-size: 2px 1px;
background-repeat: repeat-x;
} }
.housing-pd { .housing-pd {
@@ -1210,9 +1217,7 @@ img {
color: #555555; color: #555555;
font-size: 15px; font-size: 15px;
.bold-text{ .bold-text {}
}
.btm-btn { .btm-btn {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif; font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;

4
src/views/detail.vue
View File

@@ -598,8 +598,8 @@
发布者对房源信息的真实性、合法性等负责，平台不负责甄别和审核具体内容真实性和有效性等，请务必仔细核实相关信息，谨防上当受骗。 发布者对房源信息的真实性、合法性等负责，平台不负责甄别和审核具体内容真实性和有效性等，请务必仔细核实相关信息，谨防上当受骗。
<div> <div>
如房源信息中有内容侵犯了您的合法权益，可点击屏幕右侧的举报或联系寄托方同学（微信号 如房源信息中有内容侵犯了您的合法权益，可点击屏幕右侧的举报或联系寄托方同学（微信号
<el-dropdown> <el-dropdown style="border-color:#fff;">
<span class="text-line line-h-30" <span class="text-line line-h-30" style="border-color: #fff;"
@click="clone(concatInfo.data && concatInfo.data.wechat)">{{ @click="clone(concatInfo.data && concatInfo.data.wechat)">{{
concatInfo.data && concatInfo.data.wechat }}</span> concatInfo.data && concatInfo.data.wechat }}</span>
<template #dropdown> <template #dropdown>