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

个人房源对接

Browse Source
This commit is contained in:
luJianJun 2023-07-24 19:35:17 +08:00
parent 3712c1bc4c
commit 44406ee209
4 changed files with 279 additions and 169 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/detail/breadcrumb.vue
View File

@ -11,7 +11,7 @@
</div>
<div class="dis-f al-item jus-bet title-box">
<div class="detail-title">
房东直租 | 中城浸教公大理公，近地铁，新装修，两房一厅，采光通风好，设备齐全拎包入住
{{ data['data']['info']&&data['data']['info'].subject }}
</div>
<div class="tool-btn-box dis-f al-item">
<div class="btn-s dis-f al-item jus-x">
@ -37,21 +37,27 @@
<script setup>
import { ArrowRight } from '@element-plus/icons-vue'
import { reactive, onMounted, ref, defineProps } from 'vue'
import { reactive, onMounted, ref, defineProps,watchEffect } from 'vue'
import store from '@/store'
defineProps({
const props=defineProps({
data: {
type: Array,
type: Object,
default: function () {
return []
return {}
}
}
})
let data=reactive({})
//导航数据
let storeData = store.state.routeList
console.log(storeData)
console.log('storeData',storeData)
watchEffect(()=>{
data['data']=props.data
console.log(data['data'])
})
</script>
<style scoped>
@ -90,7 +96,6 @@ img {
.title-top-box {
width: 1200px;
height: 186px;
background: inherit;
background-color: rgba(255, 255, 255, 1);
box-sizing: border-box;

28
src/components/detail/imageWatch.vue
View File

@ -1,13 +1,13 @@
<template>
<div class="watch-box">
<div class="watch-box" v-show="show">
<div class="pos-r dis-f al-item mg-t-60">
<div class="s-w-100">
<el-carousel arrow="never" height="600px" :autoplay="false" indicator-position="none" ref="carousel">
<el-carousel-item v-for="(item, i) in list" :key="i">
<div class="dis-f jus-x al-item">
<div class="dis-f jus-x al-item" v-if="item">
<div class="img-box">
{{ item }}
<img src="" class="img" alt="">
<img :src="item&&item.url" class="img" alt="">
</div>
</div>
</el-carousel-item>
@ -31,12 +31,12 @@
</div>
</div>
</div>
<img src="../../assets/img/detail/imageClose.svg" class="close-img" alt="">
<img src="../../assets/img/detail/imageClose.svg" @click="close" class="close-img" alt="">
</div>
</template>
<script setup>
import { reactive, onMounted, ref, defineProps } from 'vue'
import { reactive, onMounted, ref, defineProps,watchEffect } from 'vue'
const props = defineProps({
list: {
@ -44,9 +44,19 @@ const props = defineProps({
default: function () {
return [1, 2, 3, 4, 5]
}
},
close:{
type:Function
},
show:{
type:Boolean,
default:false
}
})
let show=props.show
let list = props.list
let close=props.close
let carousel = ref(null)
let imageTab = ref(0)
@ -65,6 +75,12 @@ let next = () => {
carousel.value.next()
console.log(imageTab.value)
}
watchEffect(()=>{
show=props.show
list = props.list
console.log('url',list)
})
</script>
<style scoped>
img {
@ -188,7 +204,7 @@ img {
}
.img-box {
width: 800px;
width:1200px;
height: 600px;
background: #fff;
border-radius: 10px;

3
src/utils/api.js
View File

@ -24,6 +24,9 @@ export default{
},
apartment:(params={})=>{//获取公寓列表
return axios.get('/tenement/pc/api/apartment',params)
},
details:(params={})=>{//房源详情
return axios.post('/tenement/pc/api/details',params)
}
}

398
src/views/detail.vue
View File

@ -3,19 +3,27 @@
<pageTopBar></pageTopBar>
<div class="dis-f jus-x al-item">
<div class="body-maxWidth mg-t-35">
<breadcrumb></breadcrumb>
<breadcrumb :data="housingInfo['data']"></breadcrumb>
<el-affix :offset="0" @change="changeTitleType">
<div class="top-bar-box dis-f jus-x" v-show="titleType">
<div class="top-bar dis-f al-item jus-bet">
<div class="dis-f al-item">
<span class="unit">HK$</span>
<span class="rent">123456</span>
<span class="rent">{{ housingInfo['data'] && housingInfo['data'].info.rent }}</span>
<span>/月</span>
<div class="line"></div>
<div class="dis-f al-item">
整租
{{ indexData['data'] &&
indexData['data']['config'] &&
indexData['data']['config']['type'][housingInfo['data'] &&
housingInfo['data'].info.type.substring(0, 1)]
}}
<img src="../assets/img/detail/arrowIcon.svg" class="icon" alt="">
两房
{{ indexData['data'] &&
indexData['data']['config'] &&
indexData['data']['config']['type'][housingInfo['data'] &&
housingInfo['data'].info.type]
}}
</div>
</div>
<div class="dis-f al-item">
@ -37,7 +45,7 @@
</div>
</div>
<div class="concat-btn-box" :class="{ 'concat-btn-show': concatType }">
<div class="contact-btn" style="margin:0 0 0 10px;">
<div class="contact-btn" style="margin:0 0 0 10px;" @click="showConcat = true">
联系方式
</div>
</div>
@ -48,7 +56,9 @@
<div class="dis-f jus-bet" style="transform: translateY(-15px);">
<div class="info-box">
<div class="detail-price-box">
<span class="unit">HK$</span><span class="rent">123456</span><span>/月</span>
<span class="unit">HK$</span><span class="rent">{{
housingInfo['data'] && housingInfo['data'].info.rent }}</span>
<span>/月</span>
</div>
<div class="dis-f al-item detail-condition-box">
<div class="condition condition-border">
@ -56,10 +66,18 @@
<div class="icon">
</div>
整租
{{ indexData['data'] &&
indexData['data']['config'] &&
indexData['data']['config']['type'][housingInfo['data'] &&
housingInfo['data'].info.type.substring(0, 1)]
}}
</div>
<div class="type-text">
两房
{{ indexData['data'] &&
indexData['data']['config'] &&
indexData['data']['config']['type'][housingInfo['data'] &&
housingInfo['data'].info.type]
}}
</div>
</div>
<div class="condition condition-border">
@ -70,7 +88,9 @@
租期
</div>
<div class="type-text">
一年
{{ housingInfo['data'] && housingInfo['data'].info.rentalduration === '0' ?
'不限' : `${housingInfo['data'] && housingInfo['data'].info.rentalduration}
${housingInfo['data'] && housingInfo['data'].info.rentalperiod}` }}
</div>
</div>
<div class="condition condition-border">
@ -81,18 +101,19 @@
起租日期
</div>
<div class="type-text">
随时
{{ housingInfo['data'] && housingInfo['data'].info.leasetime || '随时' }}
</div>
</div>
</div>
<div class="image-box">
<div class="dis-f al-item">
<img src="../assets/img/detail/videoIcon.png" class="img-video" alt="">
<div class="num-box">1</div>
<div class="num-box">{{ housingInfo['data'] &&housingInfo['data'].info.video?
housingInfo['data']&&housingInfo['data'].info.video.length:0 }}</div>
<img src="../assets/img/detail/imageIcon.png" class="img-icon" alt="">
<div class="num-box">2</div>
<div class="num-box">{{housingInfo['data'] &&housingInfo['data'].info.picturegroup.length ||0 }}</div>
</div>
<div class="img-list-box dis-f jus-x al-item">
<div class="img-list-box dis-f jus-x al-item" @click="imageShow=true">
<img src="../assets/img/detail/moreNot.svg" class="icon left-icon" alt=""
@click="moveImageList('left')">
<img src="../assets/img/detail/moreAllow.svg" class="icon left-icon" alt=""
@ -101,18 +122,18 @@
@click="moveImageList('right')">
<img src="../assets/img/detail/moreNot.svg" class="icon right-icon" alt=""
style="transform: rotate(180deg);" @click="moveImageList('right')">
<div class="dis-f al-item list-box" ref="imageList">
<div class="dis-f al-item list-box" ref="imageList" v-if="imgList.length > 0">
<div v-for="(item, i) in imgList" :key="i">
<div class="video" v-if="item === 1">
<div class="video" v-if="item && !item.thumbnail">
<div class="icon-box dis-f jus-x al-item">
<img src="../assets/img/detail/videoStop.svg" class="icon" alt="">
</div>
<img class="video" ref="imgData" src="" @load="setImageWidth(i)"
<img class="video" ref="imgData" :src="item.image" @load="setImageWidth(i)"
@error="setImageWidth(i)" alt="">
</div>
<div class="img" v-if="item > 1"
<div class="img" v-if="item && item.thumbnail"
:style="{ 'background': i % 2 === 0 ? '#000' : '#eee' }">
<img class="img" ref="imgData" src="" @load="setImageWidth(i)"
<img class="img" ref="imgData" :src="item.thumbnail" @load="setImageWidth(i)"
@error="setImageWidth(i)" alt="">
</div>
</div>
@ -127,46 +148,65 @@
</span>
</div>
<div class="info-box-s">
<div class="info">
<span>
<div class="info dis-f al-item">
<div class="title-box">
房屋类型
</span>
</div>
<span class="text">
洋楼
{{
indexData['data'] && indexData['data']['config']['property'][housingInfo['data'] &&
housingInfo['data'].info.property]
}}
</span>
</div>
<div class="info">
<span>
<div class="info dis-f al-item">
<div class="title-box">
所在楼层
</span>
</div>
<span class="text">
28
</span>|<span class="text" style="margin-left:0;">
有电梯
{{ housingInfo['data'] && housingInfo['data'].info.floor }}
</span>
|
<span class="text" style="margin-left:0;">
{{
indexData['data'] && indexData['data']['config']['elevator'][housingInfo['data'] &&
housingInfo['data'].info.elevator]
}}
</span>
</div>
<div class="info">
<span>
<div class="info dis-f al-item">
<div class="title-box">
晾晒区
</span>
</div>
<span class="text">
阳台
{{
indexData['data'] && housingInfo['data'] && housingInfo['data'].info.sunshinearea
!== -1 ?
indexData['data']['config']['sunshinearea'][housingInfo['data'] &&
housingInfo['data'].info.sunshinearea] : ''
}}
</span>
</div>
<div class="info" style="margin-top:30px;">
<span>
<div class="info dis-f al-item" style="margin-top:30px;">
<div class="title-box">
面积
</span>
</div>
<span class="text">
680 平方呎
{{
housingInfo['data'] && housingInfo['data'].info.acreage ? housingInfo['data'] &&
housingInfo['data'].info.acreage : 0
}} 平方呎
</span>
</div>
<div class="info" style="margin-top:30px;">
<span>
<div class="info dis-f al-item" style="margin-top:30px;">
<div class="title-box">
性别要求
</span>
</div>
<span class="text">
男女皆可
{{
indexData['data'] && indexData['data']['config']['gender'][housingInfo['data'] &&
housingInfo['data'].info.gender]
}}
</span>
</div>
</div>
@ -199,33 +239,28 @@
<span class="title">房源距离院校</span>
<img src="../assets/img/detail/close.png" class="close-icon" alt="">
</div>
<div class="distance-info-data dis-f">
<!-- <div class="dis-f al-item school-info">
<div class="icon-box dis-f al-item jus-x">
<img src="../assets/img/detail/school.png" class="icon" v-show="false"
alt="">
<img src="../assets/img/detail/home.png" class="icon" alt="">
</div>
123
<span></span>
</div> -->
<div class="distance-info-data dis-f" v-if="distanceList.length > 0">
<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">
<div class="icon-box dis-f al-item jus-x"
:class="{ 'home-icon': item.address }">
<div class="line" v-show="index > 0"></div>
<img src="../assets/img/detail/school.png" class="icon" v-show="false"
<img src="../assets/img/detail/school.png" class="icon"
v-show="item.address" alt="">
<img src="../assets/img/detail/home.png" class="icon" v-show="!item.address"
alt="">
<img src="../assets/img/detail/home.png" class="icon" alt="">
</div>
123
<div>
{{ item && item.name }}
<div v-for="(items,i) in item.point" :key="i">
<span class="address-info">
北门
{{ items.title }}
</span>
<span class="distance-text">
<span
v-html="setDistanceList(items &&`${items.distance}`)">
</span>
<!-- <span class="distance-text">
1.1公里
</span>
</span> -->
</div>
</div>
@ -235,17 +270,22 @@
<!-- <img src="../assets/img/detail/line.svg" class="line-img" alt=""> -->
<div class="dis-f al-item s-w-100" style="position:absolute;">
<div class="line-school-box dis-f al-item" style="justify-content:space-around;">
<div v-for="item in schoolArr" class="box-text">
<div :class="{ 'far-s': item.num > 4 }">
{{ item.num }}km
<div v-for="(item, i) in distanceList" class="box-text" :key="item && item.id">
<div :class="{ 'far-s': item && item.recently_distance > 4 }"
v-if="!item.address" class="text-c">
{{ item && item.recently_distance }}km
</div>
<div class="dis-f jus-x">
<img src="../assets/img/detail/markIcon.svg" v-if="item.num <= 4"
class="marker-icon" alt="">
<img src="../assets/img/detail/markIconNot.svg" v-if="item.num > 4"
class="marker-icon" alt="">
<div class="dis-f jus-x" v-if="!item.address">
<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.num > 4 }">{{ item.title }}</div>
<div :class="{ 'far-s': item && item.recently_distance > 4 }" class="text-c"
v-if="!item.address">{{
item && item.alias }}</div>
</div>
</div>
</div>
@ -265,30 +305,35 @@
<img src="../assets/img/detail/moreBoxIcon.png" class="more-icon" alt="">
<span class="title">更多介绍</span>
</div>
<div class="introduce-text">
123
<div class="introduce-text" v-html="housingInfo['data']&&housingInfo['data'].info.introduction">
</div>
</div>
<div class="houseing-info-box dis-f al-item jus-bet">
<div class="dis-f al-item houseing-info-box-s">
房源ID: <span class="houseing-id" @click="clone('123456789')">123456789</span>
房源ID: <span class="houseing-id" @click="clone('123456789')">{{ housingInfo['data'] && housingInfo['data'].info.uid }}</span>
<span class="browse-box">
浏览: <span class="text">123</span>
浏览: <span class="text">{{ housingInfo['data'] && housingInfo['data'].info.count_view }}</span>
</span>
</div>
<div class="dis-f al-item houseing-info-box-s">
<span>
收藏: <span class="text">9</span>
收藏: <span class="text">
{{ housingInfo['data'] && housingInfo['data'].info.count_fav }}
</span>
</span>
</div>
<div class="dis-f al-item houseing-info-box-s">
<span>
发布: <span class="text">2022.08.10 19:00</span>
发布: <span class="text">
{{ housingInfo['data'] && housingInfo['data'].info.timestamp }}
</span>
</span>
</div>
<div class="dis-f al-item houseing-info-box-s" style="border-right:0px">
<span>
更新: <span class="text">2022.08.10 19:00</span>
更新: <span class="text">
{{ housingInfo['data'] && housingInfo['data'].info.updatetime }}
</span>
</span>
</div>
</div>
@ -301,12 +346,12 @@
<div>
如房源信息中有内容侵犯了您的合法权益，可点击屏幕右侧的举报或联系寄托方同学（微信号
<el-dropdown>
<span class="text-line" @click="clone('gternet2')">gternet2</span>
<span class="text-line" @click="clone('gternet2')">{{ concatInfo.data&&concatInfo.data.wechat }}</span>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item>
<div class="wx-qrcode-s">
<img src="../assets/img/detail/wxQrcode.jpg"
<img :src="concatInfo.data&&concatInfo.data.wechatqrcode"
style="width:130px;height:130px" alt="">
</div>
</el-dropdown-item>
@ -317,28 +362,35 @@
</div>
</div>
<div class="mg-t-30">
公寓/酒店/中介房源推广合作请联系：<span class="text-line" @click="clone('456789')">123456</span>
公寓/酒店/中介房源推广合作请联系：<span class="text-line" @click="clone('ad@gter.net')">ad@gter.net</span>
</div>
</div>
</div>
<div>
<div class="right-tool-box">
<div class="dis-f jus-x">
<img src="" class="user-img" alt="">
<img :src="housingInfo['data'] && housingInfo['data'].info.avatar" class="user-img" alt="">
</div>
<div class="user-name">
123
{{ housingInfo['data'] && housingInfo['data'].info.author }}
</div>
<div class="dis-f jus-x">
<div class="user-type">
房东
{{
indexData['data'] && indexData['data']['config']['intermediary'][housingInfo['data'] &&
housingInfo['data'].info.intermediary]
}}
</div>
</div>
<div class="dis-f al-item jus-x time-box">
<img src="../assets/img/detail/timeIcon.svg" class="icon" alt="">
<span>
456789
</span>
{{
(new Date().getTime() - new
Date().getTime(housingInfo['data'] && housingInfo['data'].info.updatetime)) / 3600000
< 3600000 ? '一小时内' : `${Math.floor((new Date().getTime() - new
Date().getTime(housingInfo['data'] && housingInfo['data'].info.updatetime)) /
3600000)}` }} </span>
</div>
<div class="dis-f jus-x">
<div class="contact-btn">
@ -370,7 +422,7 @@
</div>
<div class="dis-f jus-x ">
<div class="crowd-box dis-f jus-x al-item">
<img src="../assets/img/detail/crowdImg.jpg" class="img" alt="">
<img :src="concatInfo.data&&concatInfo.data.wechatqrcode" class="img" alt="">
</div>
</div>
<div class="dis-f jus-x s-w-100">
@ -386,7 +438,7 @@
</div>
</div>
<footerTool></footerTool>
<div class="pop-box">
<div class="pop-box" v-show="showConcat" @click="showConcat = !showConcat">
<!-- 两种信息 -->
<!-- third-concat -->
<div class="pop-big-box ">
@ -394,7 +446,7 @@
<div class="pop-big-bg dis-f jus-x al-item">
<div class="user-liner-box dis-f al-item">
<!-- class='s-w-100' -->
<div style="padding:0 0 30px 0;">
<div style="padding:0 0 30px 0;">
<div class="liner-title">
联系方式
</div>
@ -548,7 +600,7 @@
</div> -->
</div>
</div>
<!-- <watchImage></watchImage> -->
<watchImage :show="imageShow" :close="cloaseImageShow" :list="imgList"></watchImage>
<!-- 右下角咨询 -->
<circle-btn></circle-btn>
</template>
@ -562,15 +614,21 @@ import footerTool from '@/components/footer/footer.vue'
import watchImage from '../components/detail/imageWatch.vue'
import breadcrumb from '../components/detail/breadcrumb.vue'
import { ElMessage } from 'element-plus'
import store from '@/store';
//
let loadMore = ref(true)
let pages = ref(1)
//查看图片
let imageShow= ref(false)
let cloaseImageShow=()=>{
imageShow.value=false
}
//视频实例
let imageList = ref(null)
let imgList = ref([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20])
//图片数组
let imgList = ref([])
let imgListTab = ref(0)
//计时器
@ -579,7 +637,7 @@ let interval = ''
let moveImageList = (type) => {
if ((type === 'left' && imgListTab.value === 0) || (imgListTab.value === imgList.value.length - 1 && type === 'right')) return
type === 'left' ? imgListTab.value-- : imgListTab.value++
setOffsetWidth(imgList.value[imgListTab.value] * imgListTab.value, type)
setOffsetWidth(imgList.value[imgListTab.value]['value'] * imgListTab.value, type)
}
//设置滚动
let setOffsetWidth = (num, type) => {
@ -595,57 +653,24 @@ let setOffsetWidth = (num, type) => {
let imgData = ref(null)
//获取图片宽度
let setImageWidth = (num) => {
imgList.value[num] = imgData.value[num].offsetWidth + 10
imgList.value[num]['value'] = imgData.value[num] && imgData.value[num].offsetWidth + 10
}
//地名数据
let schoolArr = ref([
{
title: '理大',
num: 4
},
{
title: '理大',
num: 4.2
},
{
title: '理大',
num: 5
},
{
title: '理大',
num: 8
},
{
title: '理大',
num: 6
},
{
title: '理大',
num: 7
},
{
title: '理大',
num: 6
},
{
title: '理大',
num: 8
},
{
title: '理大',
num: 8
}, {
title: '理大',
num: 8
}, {
title: '理大',
num: 8
}
])
//学校地址数据
let distanceList = ref([1, 2, 3, 4, 5])
let distanceList = ref([])
//地址数字高亮
let setDistanceList = (text = '') => {
if (!text) return text
let oRegExp = new RegExp(/\d+\.\d+/, "g");
text = text.replace(/\d+\.\d+/g, `<span style="font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;font-style: normal;
font-size: 14px;
color: #62B1FF;
margin-left: 5px;">${text.match(oRegExp) ? text.match(oRegExp)[0] : ''}公里</span>`)
return text
}
//显示详情
let showDistance = ref(false)
//学校地址详情
@ -683,6 +708,66 @@ let clone = (text) => {
})
}
//显示联系方式
let showConcat = ref(false)
//数据包
let indexData = reactive({})
//房源详情
let housingInfo = reactive({})
//联系
let concatInfo= reactive({})
let setHousingArr = () => {
let arr = []
arr = housingInfo['data'].info.video?arr.concat(housingInfo['data'] && housingInfo['data'].info.video):[]
arr = arr.concat(housingInfo['data'] && housingInfo['data'].info.picturegroup)
imgList.value = imgList.value.concat(arr)
// console.log('imgList',imgList.value)
}
//设置顶部导航
let setNavigation = () => {
let location = store.state.indexData.config && store.state.indexData.config.location
let type = store.state.indexData.config && store.state.indexData.config.type
indexData['data'] = store.state.indexData
// console.log(123, indexData['data'])
store.state.routeList['thirdIndex'] = {
path: "",
title: `${location[housingInfo['data']['info'].location.substring(0, 1)]}${type[housingInfo['data']['info'].type.substring(0, 1)]}房源`
}
if (housingInfo['data']['info'].location.length > 0)
store.state.routeList['fourthIndex'] = {
path: "",
title: `${location[housingInfo['data']['info'].location]}${type[housingInfo['data']['info'].type]}`
}
}
//获取房源详情
let getHousingInfo = () => {
api.details({
uniqid: '44qeSnfmf9GD'
}).then(res => {
console.log(res)
if (res.code === 200) {
housingInfo['data'] = res.data
setHousingArr()
setNavigation()
distanceList.value = distanceList.value.concat(housingInfo['data']['info'].pointData)
distanceList.value.unshift({
address: true,
name: housingInfo['data']['info'].address,
})
concatInfo['data']=store.state.indexData.wechat
console.log(distanceList.value)
} else {
ElMessage({
message: res.message
})
}
})
}
//监听滚动条
const onPageSrcoll = (e) => {
let body = document.documentElement ? document.documentElement : document.body ?
@ -699,6 +784,7 @@ const onPageSrcoll = (e) => {
}
}
onMounted(() => {
getHousingInfo()
setTimeout(() => {
window.addEventListener('scroll', onPageSrcoll, true);
}, 1000)
@ -796,11 +882,12 @@ img {
justify-content: center;
align-items: center;
.third-concat{
height:560px !important;
.third-concat {
height: 560px !important;
}
.third-bg{
height:480px !important;
.third-bg {
height: 480px !important;
}
.pop-big-box {
@ -1292,8 +1379,6 @@ img {
.user-type {
margin-top: 15px;
width: 43px;
height: 24px;
background: inherit;
background-color: rgba(98, 177, 255, 1);
border: none;
@ -1307,6 +1392,7 @@ img {
color: #FFFFFF;
text-align: center;
line-height: 24px;
padding: 2px 3px;
}
.time-box {
@ -1435,7 +1521,7 @@ img {
padding: 0 20px;
position: relative;
overflow: hidden;
height: 110px;
height: 115px;
width: 100%;
cursor: pointer;
margin-top: 20px;
@ -1457,6 +1543,7 @@ img {
width: 100px;
height: 100px;
border-radius: 10px;
z-index: 66;
.icon {
width: 30px;
@ -1517,6 +1604,10 @@ img {
color: #7F7F7F;
font-size: 14px;
.title-box {
width: 65px;
}
.text {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
@ -1756,7 +1847,7 @@ img {
flex-direction: column;
.home-icon {
background: #ffcc17;
background: #ffcc17 !important;
}
.icon-box {
@ -1764,7 +1855,7 @@ img {
height: 32px;
border-radius: 50%;
background: #50e3c2;
margin-right: 10px;
margin-right: 15px;
position: relative;
}
@ -1800,15 +1891,6 @@ img {
color: #333;
margin-left: 30px;
}
.distance-text {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #62B1FF;
margin-left: 5px;
}
}
}
@ -1865,6 +1947,10 @@ img {
color: #000000;
}
.text-c {
text-align: center
}
.far-s {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;