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

no message

Browse Source
This commit is contained in:
A1300399510
2023-12-01 18:08:11 +08:00
parent e163d2c195
commit 5077fd5538
23 changed files with 233 additions and 230 deletions
Download Patch File Download Diff File Expand all files Collapse all files

145
src/components/indexWaterfallBox/indexWaterfallBox.vue
View File

@@ -1,43 +1,40 @@
<template>
<div class="item" v-if="itemData.type !== 'adv'"
:class="{ 'waterfall-box-housing': itemData.type === 'housing' }" @click="watchInfo">
<div class="item" v-if="itemData.type !== 'adv'" :class="{'waterfall-box-housing': itemData.type === 'housing'}" @click="watchInfo">
<div class="flexflex pos-r">
<div class="box-tab-type" v-if="itemData.intermediarytext">
<img class="intermediary-type" v-if="itemData.isintermediary" src="@/assets/homeImage/intermediaryTabImg.png" />
<div class="box-tab-type" v-else-if="itemData.intermediarytext">
{{ itemData.intermediarytext }}
</div>
<div class="intermediary-type" v-if="itemData.isintermediary">
<!-- <div class="intermediary-type" v-if="itemData.isintermediary">
认证中介
</div>
<img class="apartment-img" v-lazy="itemData.imageLocal || itemData.image"
v-if="itemData.type === 'housing' || itemData.type === 'apartment'" />
<div class="authentication-box"
v-if="(itemData && itemData.type === 'housing' && itemData && itemData.verified) || (itemData && itemData.type === 'apartment' && itemData && itemData.isintermediary)">
<img src="../../assets/homeImage/authenticationLogo.png" class="logo" alt="">
<img src="../../assets/homeImage/authenticationBg.svg" class="authentication-bg" alt="">
<img src="../../assets/homeImage/authenticationText.png" class="authentication-text" alt="">
</div> -->
<img class="apartment-img" v-lazy="itemData.imageLocal || itemData.image" v-if="itemData.type === 'housing' || itemData.type === 'apartment'" />
<div class="authentication-box" v-if="(itemData && itemData.type === 'housing' && itemData && itemData.verified) || (itemData && itemData.type === 'apartment' && itemData && itemData.isintermediary)">
<img src="../../assets/homeImage/authenticationLogo.png" class="logo" alt="" />
<img src="../../assets/homeImage/authenticationBg.svg" class="authentication-bg" alt="" />
<img src="../../assets/homeImage/authenticationText.png" class="authentication-text" alt="" />
</div>
</div>
<div class="long-title">
<span class="type" v-if="itemData.type === 'housing'">{{ itemData.gptype }}</span>{{ itemData && itemData.title
}}
<span class="type" v-if="itemData.type === 'housing'">{{ itemData.gptype }}</span
>{{ itemData && itemData.title }}
</div>
<div class="type-tab">
<span v-if="itemData.type === 'housing'">
{{ itemData.housingtype }}
{{ itemData.elevator === -1 || !itemData.elevator ? '' : `· ${itemData.elevator}` }}
{{ itemData.sunshinearea === -1 || !itemData.sunshinearea ? '' : `· ${itemData.sunshinearea}` }}
{{ itemData.elevator === -1 || !itemData.elevator ? "" : `· ${itemData.elevator}` }}
{{ itemData.sunshinearea === -1 || !itemData.sunshinearea ? "" : `· ${itemData.sunshinearea}` }}
{{ `· ${itemData.gender}` }}
{{ itemData.leaseterm ? `· ${itemData.leaseterm}` : '' }}
{{ itemData.leaseterm ? `· ${itemData.leaseterm}` : "" }}
</span>
<span v-if="itemData.type === 'apartment'">{{ itemData.propaganda }}</span>
</div>
<div style="padding: 0 10px;margin-top:15px;" class="dis-f al-item" v-if="itemData.type === 'housing'">
<img src="../../assets/homeImage/addMarker.png" class="add-marker" alt="">
<span class="address-text">{{ location.data && location.data[itemData.location && itemData.location.substring(0,
1)]
}} > {{ location.data && location.data[itemData.location] }}</span>
<div style="padding: 0 10px; margin-top: 15px;" class="dis-f al-item" v-if="itemData.type === 'housing'">
<img src="../../assets/homeImage/addMarker.png" class="add-marker" alt="" />
<span class="address-text">{{ location.data && location.data[itemData.location && itemData.location.substring(0, 1)] }} > {{ location.data && location.data[itemData.location] }}</span>
</div>
<div style="padding:0 10px;margin-top:12px;align-items: end;" class="rent-box dis-f" v-if="itemData.type === 'housing'">
<div style="padding: 0 10px; margin-top: 12px; align-items: end;" class="rent-box dis-f" v-if="itemData.type === 'housing'">
<div class="unit">HK$</div>
<div class="price">{{ itemData.rent }}</div>
<div class="date">/月</div>
@@ -55,7 +52,7 @@
<div class="suite-type">
{{ item.title }}
</div>
<div class="dis-f" style="align-items: end;line-height:20px;">
<div class="dis-f" style="align-items: end; line-height: 20px;">
<span class="unit">HK$</span>
<span class="price">{{ item.value }}</span>
<span class="date">/月</span>
@@ -77,11 +74,8 @@
</div> -->
</div>
<div class="corner-box">
<img src="../../assets/homeImage/corner.svg" v-if="itemData.type === 'housing' && itemData.intermediary !== 1"
class="corner-img" alt="">
<img src="../../assets/homeImage/intermediaryCorner.svg"
v-if="itemData.type === 'housing' && itemData.intermediary === 1" style="transform: rotate(90deg);margin: 0 -1px 0 0;"
class="tab-img" alt="">
<img src="../../assets/homeImage/corner.svg" v-if="itemData.type === 'housing' && itemData.intermediary !== 1" class="corner-img" alt="" />
<img src="../../assets/homeImage/intermediaryCorner.svg" v-if="itemData.type === 'housing' && itemData.intermediary === 1" style="transform: rotate(90deg); margin: 0 -1px 0 0;" class="tab-img" alt="" />
</div>
<!-- <div class="apartment-price-more flexcenter">更多</div> -->
@@ -94,29 +88,28 @@
<!-- 广告 -->
</div>
<img :src="itemData.imageLocal || itemData.image" :class="{'no-click':!itemData.path&&!itemData.url}" class="live-img item" v-if="itemData.type === 'adv'" alt=""
@click="watchAdv">
<img :src="itemData.imageLocal || itemData.image" :class="{'no-click': !itemData.path && !itemData.url}" class="live-img item" v-if="itemData.type === 'adv'" alt="" @click="watchAdv" />
</template>
<script setup>
import { defineProps, reactive,watchEffect } from 'vue'
import store from '../../store/index';
import { useRouter } from 'vue-router'
import {defineProps, reactive, watchEffect} from "vue"
import store from "../../store/index"
import {useRouter} from "vue-router"
const props = defineProps({
data: {
type: Object,
default: function () {
return {}
}
}
},
},
})
let itemData = props.data
let location = reactive({ data: {} })
let location = reactive({data: {}})
location.data = store.state.indexData.config.location
let router = useRouter()
let watchInfo = () => {
window.open(`${document.location.origin}/${itemData.type === 'apartment' ? 'apartmentDetail' : 'detail'}?${itemData.type == 'apartment' ? "uniqid" : "id"}=${itemData.type == 'apartment' ? itemData.id : itemData.uniqid}`)
window.open(`${document.location.origin}/${itemData.type === "apartment" ? "apartmentDetail" : "detail"}?${itemData.type == "apartment" ? "uniqid" : "id"}=${itemData.type == "apartment" ? itemData.id : itemData.uniqid}`)
// router.push({
// path: itemData.type === 'apartment' ? '/apartmentDetail' : '/detail',
// query: {
@@ -130,12 +123,12 @@ let watchAdv = () => {
if (itemData.url) {
window.open(itemData.url)
} else {
if(!itemData.path)return
if (!itemData.path) return
watchInfo()
}
}
watchEffect(()=>{
watchEffect(() => {
itemData = props.data
})
</script>
@@ -157,24 +150,24 @@ watchEffect(()=>{
}
.unit {
font-family: 'Arial-Black', 'Arial Black', sans-serif;
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
color: #000000;
font-size: 13px;
line-height:19px;
line-height: 19px;
}
.price {
font-family: 'Arial-Black', 'Arial Black', sans-serif;
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
font-size: 20px;
color: #F95D5D;
color: #f95d5d;
margin-left: 3px;
line-height:23px;
line-height: 23px;
}
.date {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 13px;
@@ -190,11 +183,11 @@ watchEffect(()=>{
border-radius: 16px 16px 16px 16px !important;
}
.no-click{
cursor:default !important;
.no-click {
cursor: default !important;
}
.item:hover{
.item:hover {
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
@@ -251,7 +244,7 @@ watchEffect(()=>{
transform: rotate(90deg);
width: 33px;
height: 33px;
margin:0 -1px 0 0;
margin: 0 -1px 0 0;
}
}
@@ -262,21 +255,21 @@ watchEffect(()=>{
}
.type-tab {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #AAAAAA;
color: #aaaaaa;
margin-top: 15px;
padding: 0 10px;
word-wrap: break-word;
}
.rent-box{
line-height:20px;
.rent-box {
line-height: 20px;
}
.address-text {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
@@ -284,7 +277,7 @@ watchEffect(()=>{
}
.long-title {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 15px;
@@ -297,22 +290,19 @@ watchEffect(()=>{
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
margin-top: 8px;
overflow: hidden;
margin-top: 4px;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
line-height:28px;
line-height: 28px;
.type {
width: 34px;
height: 20px;
display: flex;
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 13px;
color: #FFFFFF;
color: #ffffff;
text-align: center;
line-height: 20px;
background-color: rgba(51, 51, 51, 1);
@@ -325,11 +315,11 @@ watchEffect(()=>{
}
.box-tab-type {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #FFFFFF;
color: #ffffff;
height: 24px;
border-radius: 5px;
position: absolute;
@@ -338,28 +328,28 @@ watchEffect(()=>{
background-color: rgba(51, 51, 51, 0.56078431372549);
text-align: center;
line-height: 24px;
padding:0 6px;
padding: 0 6px;
}
.intermediary-type {
position: absolute;
top: 15px;
right: 15px;
width: 66px;
height: 24px;
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
width: 85px;
height: 20px;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 13px;
color: #FFFFFF;
background: #6081d5;
color: #ffffff;
// background: #6081d5;
line-height: 24px;
text-align: center;
border-radius: 5px;
}
.title {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 18px;
@@ -370,11 +360,11 @@ watchEffect(()=>{
}
.info-text {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #AAAAAA;
color: #aaaaaa;
text-align: left;
padding: 0 15px;
margin-top: 12px;
@@ -386,7 +376,7 @@ watchEffect(()=>{
margin-bottom: 30px;
.suite-type {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 14px;
@@ -455,7 +445,7 @@ watchEffect(()=>{
.live-img {
width: 285px;
/* height: 349px; */
min-height:370px;
min-height: 370px;
border-radius: 16px;
margin-bottom: 20px;
cursor: pointer;
@@ -467,4 +457,3 @@ watchEffect(()=>{
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);
}
</style>

2
src/components/public/backToTop.vue
View File

@@ -40,7 +40,7 @@ const screenroll = () => {
.returnTop {
position: fixed;
right: calc((100vw - 1200px) / 2 - 75px);
bottom: 18px;
bottom: 88px;
width: 60px;
height: 60px;
background-color: #323232;

4
src/components/public/phoneQRcode.vue
View File

@@ -43,8 +43,8 @@ const props = defineProps({
padding: 40px 0;
.mini-program-title {
width: 201px;
height: 24px;
width: 168px;
height: 20px;
margin-bottom: 28px;
}

237
src/views/apartmentDetail.vue
View File

@@ -56,7 +56,7 @@
<img class="header-bj" alt="头部的地图背景" src="@/assets/img/apartmentDetail/apartmentDetail-header-bj.jpg" />
<!-- <img class="header-shade" src="@/assets/img/apartmentDetail/apartmentDetail-header-shade.svg"> -->
<div class="tab-box flexflex" v-if="info['tags'] && info['tags'].length != 0">
<div class="tab-item wordbreak flexcenter" v-for="(item,index) in info['tags']" :key="index">{{ item }}</div>
<div class="tab-item wordbreak flexcenter" v-for="(item, index) in info['tags']" :key="index">{{ item }}</div>
</div>
<div class="apartment-name wordbreak" v-if="info['title']">{{ info["title"] }}</div>
<div class="synopsis wordbreak">{{ info["introduction"] }}</div>
@@ -84,17 +84,19 @@
</div>
</div>
<div class="operate-box flexacenter" aria-label="详情的导航栏">
<div class="nav-box flexacenter">
<div class="nav-item flexcenter" :class="{pitch: navTab == item.value}" :aria-label="`${item['name']}-按钮`" v-for="(item, index) in navList" :key="index" @click="handleClickNav(item.value)">{{ item["value"] == "roomEle" ? `${item["name"]} ${roomList.length}` : item["name"] }}</div>
</div>
<div class="btn-box flexacenter">
<div class="btn-item transmit-btn flexcenter" @click="handleTransmit">
<img alt="转发图标" class="transmit-icon" src="@/assets/img/publicImage/transmit-icon.png" />
转发
<transmit-btn :qrcode="qrcode" :title="info['title']" type="apartment"></transmit-btn>
<div class="operate-box-bj flexcenter">
<div class="operate-box flexacenter" aria-label="详情的导航栏">
<div class="nav-box flexacenter">
<div class="nav-item flexcenter" :class="{pitch: navTab == item.value}" :aria-label="`${item['name']}-按钮`" v-for="(item, index) in navList" :key="index" @click="handleClickNav(item.value)">{{ item["value"] == "roomEle" ? `${item["name"]} ${roomList.length}` : item["name"] }}</div>
</div>
<div class="btn-box flexacenter">
<div class="btn-item transmit-btn flexcenter" @click="handleTransmit">
<img alt="转发图标" class="transmit-icon" src="@/assets/img/publicImage/transmit-icon.png" />
转发
<transmit-btn :qrcode="qrcode" :title="info['title']" type="apartment"></transmit-btn>
</div>
<div class="btn-item consult-btn flexcenter" @click="modificationContact">咨询</div>
</div>
<div class="btn-item consult-btn flexcenter" @click="modificationContact">咨询</div>
</div>
</div>
<div class="details-box flexflex">
@@ -102,13 +104,15 @@
<!-- 房间类型 -->
<div class="type-box" v-if="roomList.length != 0" ref="roomEle">
<div class="type-item flexacenter" v-for="(item, index) in roomList" :key="index">
<img class="type-icon" alt="房间类型-角图片" v-if="item['status'] == 1" src="@/assets/img/apartmentDetail/apartment-have.svg" />
<img class="type-icon" v-else src="@/assets/img/apartmentDetail/apartment-not.svg" />
<!-- <img class="type-icon" alt="房间类型-角图片" v-if="item['status'] == 1" src="@/assets/img/apartmentDetail/apartment-have.svg" /> -->
<!-- <img class="type-icon" v-else src="@/assets/img/apartmentDetail/apartment-not.svg" /> -->
<div class="type-left flex1">
<div class="type-name">{{ item["name"] }}</div>
<div class="type-tags flexacenter">
<div class="type-tags flexacenter" v-if="item.allowance || item.tags.length != 0">
<div class="tags-item flexcenter first" v-if="item.allowance">仅剩{{ item.allowance }}间</div>
<div class="tags-item flexcenter" v-for="(it, ii) in item.tags" :key="ii">{{ it }}</div>
<template v-if="item.tags.length != 0">
<div class="tags-item flexcenter" v-for="(it, ii) in item.tags" :key="ii">{{ it }}</div>
</template>
</div>
<div class="media-box flexflex" v-if="item.videos.length != 0 || item.images.length != 0">
@@ -667,6 +671,13 @@ const publicJump = path => router.push(path)
</script>
<style lang="less" scoped>
/deep/ .returnTop {
bottom: 88px;
}
/deep/ body {
padding-bottom: 70px;
}
.content {
margin: -36px auto 0;
position: relative;
@@ -997,82 +1008,95 @@ const publicJump = path => router.push(path)
}
}
.operate-box {
width: 1200px;
height: 70px;
background-color: rgba(255, 255, 255, 1);
.operate-box-bj {
position: fixed;
bottom: 0;
z-index: 1002;
min-width: 1200px;
width: 100vw;
left: 0;
border: 1px solid rgba(235, 235, 235, 1);
border-radius: 16px;
background: #fff;
-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;
padding: 0 30px;
margin-bottom: 20px;
justify-content: space-between;
position: sticky;
top: 0px;
z-index: 1002;
.operate-box {
width: 1200px;
height: 70px;
// 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;
padding: 0 30px;
// margin-bottom: 20px;
justify-content: space-between;
// position: sticky;
// top: 0px;
.nav-box {
.nav-item {
height: 40px;
background-color: rgba(246, 246, 246, 1);
border-radius: 8px;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-size: 14px;
color: #7f7f7f;
padding: 0 17px;
cursor: pointer;
&:hover {
color: #494848;
}
&.pitch {
background-color: #000;
font-weight: 650;
color: #fff;
}
&:not(:last-of-type) {
margin-right: 10px;
}
}
}
.btn-box {
.btn-item {
width: 100px;
height: 40px;
border-radius: 50px;
cursor: pointer;
&.transmit-btn {
border: 1px solid rgba(235, 235, 235, 1);
color: #333333;
margin-right: 10px;
// position: relative;
.transmit-icon {
width: 20px;
height: 20px;
margin-right: 4px;
}
}
&.consult-btn {
background: -webkit-linear-gradient(324.854454500294deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
background: -moz-linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
background: linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
font-size: 16px;
color: #ffffff;
.nav-box {
.nav-item {
height: 40px;
background-color: rgba(246, 246, 246, 1);
border-radius: 8px;
font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
font-weight: 400;
font-size: 14px;
color: #7f7f7f;
padding: 0 17px;
cursor: pointer;
&:hover {
background: -webkit-linear-gradient(324.854454500294deg, rgba(128, 255, 255, 1) -11%, rgba(98, 177, 255, 1) 135%);
background: -moz-linear-gradient(125.145545499706deg, rgba(128, 255, 255, 1) -11%, rgba(98, 177, 255, 1) 135%);
background: linear-gradient(125.145545499706deg, rgba(128, 255, 255, 1) -11%, rgba(98, 177, 255, 1) 135%);
color: #494848;
}
&.pitch {
background-color: #000;
font-weight: 650;
color: #fff;
}
&:not(:last-of-type) {
margin-right: 10px;
}
}
}
.btn-box {
.btn-item {
width: 100px;
height: 40px;
border-radius: 50px;
cursor: pointer;
&.transmit-btn {
border: 1px solid rgba(235, 235, 235, 1);
color: #333333;
margin-right: 10px;
// position: relative;
.transmit-icon {
width: 20px;
height: 20px;
margin-right: 4px;
}
}
&.consult-btn {
background: -webkit-linear-gradient(324.854454500294deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
background: -moz-linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
background: linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
font-size: 16px;
color: #ffffff;
&:hover {
background: -webkit-linear-gradient(324.854454500294deg, rgba(128, 255, 255, 1) -11%, rgba(98, 177, 255, 1) 135%);
background: -moz-linear-gradient(125.145545499706deg, rgba(128, 255, 255, 1) -11%, rgba(98, 177, 255, 1) 135%);
background: linear-gradient(125.145545499706deg, rgba(128, 255, 255, 1) -11%, rgba(98, 177, 255, 1) 135%);
}
}
}
}
@@ -1085,19 +1109,24 @@ const publicJump = path => router.push(path)
.details-left {
.type-box {
border-radius: 16px;
background-color: rgba(255, 255, 255, 1);
width: 876px;
margin-bottom: 20px;
.type-item {
width: 876px;
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);
// width: 876px;
// 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;
padding: 30px;
margin-bottom: 20px;
// margin-bottom: 20px;
border-bottom: 1px solid #ebebeb;
position: relative;
.type-icon {
position: absolute;
top: 0;
@@ -1108,15 +1137,19 @@ const publicJump = path => router.push(path)
}
.type-left {
display: flex;
flex-direction: column;
justify-content: center;
.type-name {
font-weight: 650;
font-size: 20px;
font-size: 18px;
color: #000000;
margin-bottom: 16px;
// margin-bottom: 16px;
}
.type-tags {
margin-bottom: 20px;
margin-top: 16px;
// margin-bottom: 20px;
.tags-item {
height: 24px;
@@ -1137,6 +1170,8 @@ const publicJump = path => router.push(path)
}
.media-box {
margin-top: 20px;
.media-list {
max-width: 460px;
overflow: auto;
@@ -1198,13 +1233,13 @@ const publicJump = path => router.push(path)
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
color: #000000;
font-size: 16px;
font-size: 13px;
}
.cost {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
font-size: 24px;
font-size: 20px;
color: #f95d5d;
margin: 0 6px;
}
@@ -1217,7 +1252,7 @@ const publicJump = path => router.push(path)
.consult-btn {
width: 90px;
height: 40px;
height: 36px;
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%);
@@ -1303,7 +1338,7 @@ const publicJump = path => router.push(path)
.text {
font-weight: 400;
font-size: 16px;
font-size: 15px;
color: #555555;
line-height: 30px;
padding: 20px 30px;
@@ -1319,7 +1354,7 @@ const publicJump = path => router.push(path)
}
font-weight: 400;
font-size: 16px;
font-size: 15px;
color: #555555;
line-height: 30px;
white-space: pre-line;

29
src/views/detail.vue
View File

@@ -1989,11 +1989,11 @@ img {
width: 200px !important;
}
.contact-btn:hover {
background: -webkit-linear-gradient(0, rgba(168, 209, 247, 1) -4%, rgba(213, 232, 249, 1) 102%);
background: -moz-linear-gradient(0, rgba(168, 209, 247, 1) -4%, rgba(213, 232, 249, 1) 102%);
background: linear-gradient(0, rgba(168, 209, 247, 1) -4%, rgba(213, 232, 249, 1) 102%);
}
// .contact-btn:hover {
// background: -webkit-linear-gradient(0, rgba(168, 209, 247, 1) -4%, rgba(213, 232, 249, 1) 102%);
// background: -moz-linear-gradient(0, rgba(168, 209, 247, 1) -4%, rgba(213, 232, 249, 1) 102%);
// background: linear-gradient(0, rgba(168, 209, 247, 1) -4%, rgba(213, 232, 249, 1) 102%);
// }
.contact-btn {
width: 260px;
@@ -2299,9 +2299,9 @@ img {
.user-type {
margin-top: 15px;
background: inherit;
background-color: rgba(98, 177, 255, 1);
border: none;
// background: inherit;
// background-color: rgba(98, 177, 255, 1);
// border: none;
border-radius: 42px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
@@ -2309,10 +2309,13 @@ img {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
font-style: normal;
color: #FFFFFF;
// color: #FFFFFF;
text-align: center;
line-height: 24px;
padding: 0px 6px;
font-size: 14px;
color: #555;
border: 1px solid rgba(215, 215, 215, 1);
}
.time-box {
@@ -2538,7 +2541,7 @@ img {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 16px;
font-size: 15px;
color: #000000;
.mg-t-15 {
@@ -2582,7 +2585,7 @@ img {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 16px;
font-size: 15px;
color: #333;
padding: 10px 0;
border-bottom: 1px dashed rgba(237, 237, 237, 1);
@@ -2621,7 +2624,7 @@ img {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 16px;
font-size: 15px;
color: #333;
margin-left: 25px;
}
@@ -2738,7 +2741,7 @@ img {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400;
font-style: normal;
font-size: 16px;
font-size: 15px;
color: #333;
margin-top: 20px;
word-wrap: break-word;