对接AI
This commit is contained in:
1212
pages/ai-house/index.vue
Normal file
1212
pages/ai-house/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
@@ -1,351 +1,505 @@
|
||||
<template>
|
||||
<view class="page">
|
||||
<u-navbar placeholder fixed>
|
||||
<template slot="left">
|
||||
<view style="display: flex;align-items: center;height: 44px;">
|
||||
<image style="height: 30px;" src="@/static/logo-chang.jpg" mode="heightFix"></image>
|
||||
</view>
|
||||
</template>
|
||||
</u-navbar>
|
||||
<!-- 搜索 -->
|
||||
<u-sticky :offset-top="stickyTop" zIndex="999">
|
||||
<view class="search-fix fixed" v-if="scrollTop < 30">
|
||||
<view class="search">
|
||||
<u-notice-bar bgColor="#ffffff" direction="column" :text="hotKeywords" speed="250" @click="onNoticeBar"></u-notice-bar>
|
||||
<!-- <uni-data-select class="select-width" v-model="where.region" :localdata="region"
|
||||
placeholder="所在区域"></uni-data-select> -->
|
||||
<view class="input">
|
||||
<u-search placeholder="您想找哪里" bgColor="#ffffff" v-model="where.keywords" :showAction="false" :animation="true" @search="onSearch"></u-search>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="search-fix" v-else>
|
||||
<view class="search">
|
||||
<u-notice-bar bgColor="#ffffff" direction="column" :text="hotKeywords" speed="250"></u-notice-bar>
|
||||
<!-- <uni-data-select class="select-width" v-model="where.region" :localdata="region"
|
||||
placeholder="所在区域"></uni-data-select> -->
|
||||
<view class="input">
|
||||
<u-search placeholder="您想找哪里" bgColor="#ffffff" v-model="where.keywords" :showAction="false" :animation="true" @search="onSearch"></u-search>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-sticky>
|
||||
<!-- 幻灯片 -->
|
||||
<view class="swiper">
|
||||
<u-swiper :list="swiperList" :height="180" :radius="0" @click="click"></u-swiper>
|
||||
</view>
|
||||
<!-- 选项卡 -->
|
||||
<view class="tabs">
|
||||
<u-tabs :list="menu" @click="onClick"></u-tabs>
|
||||
</view>
|
||||
<uv-waterfall ref="waterfall" v-model="list" left-gap="10" right-gap="10" column-gap="8"
|
||||
@changeList="changeList">
|
||||
<!-- 第一列数据 -->
|
||||
<template v-slot:list1>
|
||||
<!-- 为了磨平部分平台的BUG，必须套一层view -->
|
||||
<view class="house-list">
|
||||
<block v-for="(item,index) in list1" :key="index">
|
||||
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
|
||||
<image :src="item.files[0].url" mode="widthFix">
|
||||
</image>
|
||||
<view class="info">
|
||||
<view class="title">{{ item.houseTitle }}</view>
|
||||
<view class="desc"><text>{{ item.extent }}m²|{{ item.toward }}</text></view>
|
||||
<view class="price">{{ item.monthlyRent }}元/月</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
<!-- 第二列数据 -->
|
||||
<template v-slot:list2>
|
||||
<!-- 为了磨平部分平台的BUG，必须套一层view -->
|
||||
<view class="house-list">
|
||||
<block v-for="(item,index) in list2" :key="index">
|
||||
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
|
||||
<image :src="item.files[0].url" mode="widthFix">
|
||||
</image>
|
||||
<view class="info">
|
||||
<view class="title">{{ item.houseTitle }}</view>
|
||||
<view class="desc"><text>{{ item.extent }}m²|{{ item.toward }}</text></view>
|
||||
<view class="price">{{ item.monthlyRent }}元/月</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
</uv-waterfall>
|
||||
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="list.length == 0">
|
||||
</u-empty>
|
||||
<!-- <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
|
||||
@scrolltolower="lower" @scroll="onScroll">
|
||||
<view class="house-list" v-if="list.length > 0">
|
||||
<block v-for="(item,index) in list" :key="index">
|
||||
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
|
||||
<image :src="item.files[0].url" mode="widthFix">
|
||||
</image>
|
||||
<view class="info">
|
||||
<view class="title">{{ item.houseTitle }}</view>
|
||||
<view class="desc"><text>{{ item.extent }}m²|{{ item.toward }}</text></view>
|
||||
<view class="price">{{ item.rent }}元/月</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="list.length == 0">
|
||||
</u-empty>
|
||||
</scroll-view> -->
|
||||
</view>
|
||||
<view class="page">
|
||||
<u-navbar placeholder fixed>
|
||||
<template slot="left">
|
||||
<view style="display: flex;align-items: center;height: 44px;">
|
||||
<image style="height: 30px;" src="@/static/logo-chang.jpg" mode="heightFix"></image>
|
||||
</view>
|
||||
</template>
|
||||
</u-navbar>
|
||||
<!-- 搜索 -->
|
||||
<u-sticky :offset-top="stickyTop" zIndex="999">
|
||||
<view class="search-fix fixed" v-if="scrollTop < 30">
|
||||
<view class="search">
|
||||
<u-notice-bar bgColor="#ffffff" direction="column" :text="hotKeywords" speed="250"
|
||||
@click="onNoticeBar"></u-notice-bar>
|
||||
<!-- <uni-data-select class="select-width" v-model="where.region" :localdata="region"
|
||||
placeholder="所在区域"></uni-data-select> -->
|
||||
<view class="input">
|
||||
<u-search placeholder="您想找哪里" bgColor="#ffffff" v-model="where.keywords" :showAction="false"
|
||||
:animation="true" @search="onSearch"></u-search>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="search-fix" v-else>
|
||||
<view class="search">
|
||||
<u-notice-bar bgColor="#ffffff" direction="column" :text="hotKeywords" speed="250"></u-notice-bar>
|
||||
<!-- <uni-data-select class="select-width" v-model="where.region" :localdata="region"
|
||||
placeholder="所在区域"></uni-data-select> -->
|
||||
<view class="input">
|
||||
<u-search placeholder="您想找哪里" bgColor="#ffffff" v-model="where.keywords" :showAction="false"
|
||||
:animation="true" @search="onSearch"></u-search>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-sticky>
|
||||
<!-- 幻灯片 -->
|
||||
<view class="swiper">
|
||||
<u-swiper :list="swiperList" :height="180" :radius="0" @click="click"></u-swiper>
|
||||
</view>
|
||||
<view class="ai-entry" @click="goAiHouse">
|
||||
<view class="ai-entry-left">
|
||||
<image class="ai-avatar"
|
||||
:src="aiEntryImage"
|
||||
mode="aspectFill"></image>
|
||||
<view class="ai-entry-text">
|
||||
<view class="ai-entry-title">AI 找房</view>
|
||||
<view class="ai-entry-desc">输入需求，自动筛选匹配房源</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="ai-entry-btn">AI找房</view>
|
||||
</view>
|
||||
<!-- 选项卡 -->
|
||||
<view class="tabs">
|
||||
<u-tabs :list="menu" @click="onClick"></u-tabs>
|
||||
</view>
|
||||
<uv-waterfall ref="waterfall" v-model="list" left-gap="10" right-gap="10" column-gap="8"
|
||||
@changeList="changeList">
|
||||
<!-- 第一列数据 -->
|
||||
<template v-slot:list1>
|
||||
<!-- 为了磨平部分平台的BUG，必须套一层view -->
|
||||
<view class="house-list">
|
||||
<block v-for="(item,index) in list1" :key="index">
|
||||
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
|
||||
<image :src="item.files[0].url" mode="widthFix">
|
||||
</image>
|
||||
<view class="info">
|
||||
<view class="title">{{ item.houseTitle }}</view>
|
||||
<view class="desc">
|
||||
<text>{{ item.extent }}m²|{{ item.toward }}</text>
|
||||
</view>
|
||||
<view class="price">{{ item.monthlyRent }}元/月</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
<!-- 第二列数据 -->
|
||||
<template v-slot:list2>
|
||||
<!-- 为了磨平部分平台的BUG，必须套一层view -->
|
||||
<view class="house-list">
|
||||
<block v-for="(item,index) in list2" :key="index">
|
||||
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
|
||||
<image :src="item.files[0].url" mode="widthFix">
|
||||
</image>
|
||||
<view class="info">
|
||||
<view class="title">{{ item.houseTitle }}</view>
|
||||
<view class="desc">
|
||||
<text>{{ item.extent }}m²|{{ item.toward }}</text>
|
||||
</view>
|
||||
<view class="price">{{ item.monthlyRent }}元/月</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
</uv-waterfall>
|
||||
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="list.length == 0">
|
||||
</u-empty>
|
||||
<view class="ai-float-entry" v-if="showAiFloatEntry" @click="goAiHouse">
|
||||
<image
|
||||
class="ai-float-image"
|
||||
:src="aiFloatImage"
|
||||
mode="aspectFill"
|
||||
></image>
|
||||
</view>
|
||||
<!-- <scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
|
||||
@scrolltolower="lower" @scroll="onScroll">
|
||||
<view class="house-list" v-if="list.length > 0">
|
||||
<block v-for="(item,index) in list" :key="index">
|
||||
<view class="item" @click="$push('sub_pages/house/detail?houseId=' + item.houseId)">
|
||||
<image :src="item.files[0].url" mode="widthFix">
|
||||
</image>
|
||||
<view class="info">
|
||||
<view class="title">{{ item.houseTitle }}</view>
|
||||
<view class="desc"><text>{{ item.extent }}m²|{{ item.toward }}</text></view>
|
||||
<view class="price">{{ item.rent }}元/月</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="list.length == 0">
|
||||
</u-empty>
|
||||
</scroll-view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as Util from '@/utils/util.js'
|
||||
import store from '@/store'
|
||||
import storage from '@/utils/storage'
|
||||
import * as DictApi from '@/api/dict.js'
|
||||
import * as HouseInfoApi from '@/api/house-info.js'
|
||||
import * as Util from '@/utils/util.js'
|
||||
import store from '@/store'
|
||||
import storage from '@/utils/storage'
|
||||
import * as DictApi from '@/api/dict.js'
|
||||
import * as HouseInfoApi from '@/api/house-info.js'
|
||||
import * as HouseAiConfigApi from '@/api/house-ai-config.js'
|
||||
|
||||
const menu = [{
|
||||
name: '推荐',
|
||||
reset: true
|
||||
},
|
||||
{
|
||||
name: '特价好房',
|
||||
reset: false
|
||||
}
|
||||
];
|
||||
const loginUserId = uni.getStorageSync('userId')
|
||||
const DEFAULT_AI_ENTRY_IMAGE = 'https://oss.wsdns.cn/20260626/f5f7d5996e4f45ce8bb24c7c455d07d4.png?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90'
|
||||
const DEFAULT_AI_FLOAT_IMAGE = 'https://oss.wsdns.cn/20260626/e666a52de6724578b6df007fcacbbe21.gif?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90'
|
||||
const menu = [{
|
||||
name: '为您推荐',
|
||||
reset: true
|
||||
},
|
||||
{
|
||||
name: '特价好房',
|
||||
reset: false
|
||||
}
|
||||
];
|
||||
const loginUserId = uni.getStorageSync('userId')
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
list1: [],
|
||||
list2: [],
|
||||
loadMore: true,
|
||||
status: '加载更多',
|
||||
page: 1,
|
||||
where: {
|
||||
recommend: 1,
|
||||
status: 0
|
||||
},
|
||||
region: [],
|
||||
// 控制onShow事件是否刷新订单列表
|
||||
canReset: false,
|
||||
disabled: false,
|
||||
swiperList: [
|
||||
'https://oss.wsdns.cn/20240708/9e1f58e7fc7b4bad92edd852ff34dbcb.png?x-oss-process=image/resize,w_750/quality,Q_90',
|
||||
'https://oss.wsdns.cn/20240708/c95838b78b5746eb934daffb12a2efdc.png?x-oss-process=image/resize,w_750/quality,Q_90',
|
||||
],
|
||||
hotKeywords: [
|
||||
'五象航洋城',
|
||||
'富雅国际金融中心'
|
||||
],
|
||||
menu,
|
||||
scrollTop: 0,
|
||||
old: {
|
||||
scrollTop: 0
|
||||
},
|
||||
stickyTop: 60
|
||||
};
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
list1: [],
|
||||
list2: [],
|
||||
loadMore: true,
|
||||
status: '加载更多',
|
||||
page: 1,
|
||||
where: {
|
||||
recommend: 1,
|
||||
status: 0
|
||||
},
|
||||
region: [],
|
||||
// 控制onShow事件是否刷新订单列表
|
||||
canReset: false,
|
||||
disabled: false,
|
||||
swiperList: [
|
||||
'https://oss.wsdns.cn/20240708/9e1f58e7fc7b4bad92edd852ff34dbcb.png?x-oss-process=image/resize,w_750/quality,Q_90',
|
||||
'https://oss.wsdns.cn/20240708/c95838b78b5746eb934daffb12a2efdc.png?x-oss-process=image/resize,w_750/quality,Q_90',
|
||||
],
|
||||
hotKeywords: [
|
||||
'五象航洋城',
|
||||
'富雅国际金融中心'
|
||||
],
|
||||
menu,
|
||||
scrollTop: 0,
|
||||
old: {
|
||||
scrollTop: 0
|
||||
},
|
||||
stickyTop: 60,
|
||||
aiEntryBottom: 0,
|
||||
showAiFloatEntry: false,
|
||||
aiEntryImage: DEFAULT_AI_ENTRY_IMAGE,
|
||||
aiFloatImage: DEFAULT_AI_FLOAT_IMAGE
|
||||
};
|
||||
|
||||
},
|
||||
onLoad() {
|
||||
this.getDict()
|
||||
this.list = []
|
||||
this.onRefreshList()
|
||||
uni.$u.mpShare = {
|
||||
title: '爱尚家找房'
|
||||
}
|
||||
|
||||
uni.getSystemInfo({
|
||||
success: (res) => {
|
||||
this.stickyTop = res.statusBarHeight + 44 + 20
|
||||
}
|
||||
})
|
||||
},
|
||||
onShow() {},
|
||||
onBackPress() {},
|
||||
onUnload() {
|
||||
},
|
||||
onLoad() {
|
||||
this.loadAiConfig()
|
||||
this.getDict()
|
||||
this.list = []
|
||||
this.onRefreshList()
|
||||
uni.$u.mpShare = {
|
||||
title: '爱尚家找房'
|
||||
}
|
||||
|
||||
},
|
||||
onPageScroll(e) {
|
||||
this.scrollTop = e.scrollTop
|
||||
},
|
||||
// 触底函数
|
||||
onReachBottom() {
|
||||
console.log("触底函数: ");
|
||||
const app = this
|
||||
if (app.loadMore) {
|
||||
app.page = ++app.page;
|
||||
app.onRefreshList()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeList(e) {
|
||||
this[e.name].push(e.value);
|
||||
},
|
||||
getDict() {
|
||||
DictApi.getDictionaryOptions({
|
||||
dictCode: 'region'
|
||||
}).then(res => {
|
||||
this.region = res.data.map(d => {
|
||||
return {
|
||||
value: d.dictDataCode,
|
||||
text: d.dictDataName
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
onRefreshList() {
|
||||
const app = this
|
||||
const userId = uni.getStorageSync('userId')
|
||||
app.where.page = app.page
|
||||
return new Promise((resolve, reject) => {
|
||||
HouseInfoApi.pageHouseInfo(app.where)
|
||||
.then(result => {
|
||||
const list = result.data.list.map(d => {
|
||||
d.files = JSON.parse(d.files) || []
|
||||
return d
|
||||
})
|
||||
// 合并新数据
|
||||
app.list.push.apply(app.list,list);
|
||||
if (result.data.count > app.list.length) {
|
||||
app.canReset = true
|
||||
} else {
|
||||
app.canReset = false
|
||||
}
|
||||
resolve(list)
|
||||
})
|
||||
})
|
||||
},
|
||||
onClick(e){
|
||||
const index = e.index
|
||||
this.where = {}
|
||||
if(index == 0){
|
||||
this.where.recommend = 1
|
||||
this.where.status = 0
|
||||
}
|
||||
if(index == 1){
|
||||
this.where.mustSee = 1
|
||||
this.where.status = 0
|
||||
}
|
||||
this.onSearch()
|
||||
},
|
||||
onNoticeBar(index){
|
||||
// console.log('this.hotKeywords[index]: ',this.hotKeywords[index]);
|
||||
this.where.keywords = this.hotKeywords[index]
|
||||
this.onSearch()
|
||||
},
|
||||
onSearch() {
|
||||
this.list = [];
|
||||
this.$refs.waterfall.clear();
|
||||
this.list1 = [];
|
||||
this.list2 = [];
|
||||
this.page = 1
|
||||
this.onRefreshList()
|
||||
// this.$push('/sub_pages/member/member', this.where)
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
uni.getSystemInfo({
|
||||
success: (res) => {
|
||||
this.stickyTop = res.statusBarHeight + 44 + 20
|
||||
}
|
||||
})
|
||||
},
|
||||
onShow() {
|
||||
},
|
||||
onReady() {
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
this.updateAiEntryPosition()
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
onBackPress() {
|
||||
},
|
||||
onUnload() {
|
||||
|
||||
}
|
||||
};
|
||||
},
|
||||
onPageScroll(e) {
|
||||
this.scrollTop = e.scrollTop
|
||||
this.updateAiFloatEntry()
|
||||
},
|
||||
// 触底函数
|
||||
onReachBottom() {
|
||||
console.log("触底函数: ");
|
||||
const app = this
|
||||
if (app.loadMore) {
|
||||
app.page = ++app.page;
|
||||
app.onRefreshList()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeList(e) {
|
||||
this[e.name].push(e.value);
|
||||
},
|
||||
getDict() {
|
||||
DictApi.getDictionaryOptions({
|
||||
dictCode: 'region'
|
||||
}).then(res => {
|
||||
this.region = res.data.map(d => {
|
||||
return {
|
||||
value: d.dictDataCode,
|
||||
text: d.dictDataName
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
async loadAiConfig() {
|
||||
try {
|
||||
const result = await HouseAiConfigApi.getCurrentHouseAiConfig()
|
||||
const data = result && result.data ? result.data : result
|
||||
this.aiEntryImage = data?.aiEntryImage || DEFAULT_AI_ENTRY_IMAGE
|
||||
this.aiFloatImage = data?.aiFloatImage || DEFAULT_AI_FLOAT_IMAGE
|
||||
} catch (error) {
|
||||
this.aiEntryImage = DEFAULT_AI_ENTRY_IMAGE
|
||||
this.aiFloatImage = DEFAULT_AI_FLOAT_IMAGE
|
||||
}
|
||||
},
|
||||
onRefreshList() {
|
||||
const app = this
|
||||
const userId = uni.getStorageSync('userId')
|
||||
app.where.page = app.page
|
||||
return new Promise((resolve, reject) => {
|
||||
HouseInfoApi.pageHouseInfo(app.where)
|
||||
.then(result => {
|
||||
const list = result.data.list.map(d => {
|
||||
d.files = JSON.parse(d.files) || []
|
||||
return d
|
||||
})
|
||||
// 合并新数据
|
||||
app.list.push.apply(app.list, list);
|
||||
if (result.data.count > app.list.length) {
|
||||
app.canReset = true
|
||||
} else {
|
||||
app.canReset = false
|
||||
}
|
||||
resolve(list)
|
||||
})
|
||||
})
|
||||
},
|
||||
onClick(e) {
|
||||
const index = e.index
|
||||
this.where = {}
|
||||
if (index == 0) {
|
||||
this.where.recommend = 1
|
||||
this.where.status = 0
|
||||
}
|
||||
if (index == 1) {
|
||||
this.where.mustSee = 1
|
||||
this.where.status = 0
|
||||
}
|
||||
this.onSearch()
|
||||
},
|
||||
onNoticeBar(index) {
|
||||
// console.log('this.hotKeywords[index]: ',this.hotKeywords[index]);
|
||||
this.where.keywords = this.hotKeywords[index]
|
||||
this.onSearch()
|
||||
},
|
||||
goAiHouse() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/ai-house/index'
|
||||
})
|
||||
},
|
||||
updateAiEntryPosition() {
|
||||
uni.createSelectorQuery()
|
||||
.in(this)
|
||||
.select('.ai-entry')
|
||||
.boundingClientRect(rect => {
|
||||
if (!rect) return
|
||||
this.aiEntryBottom = rect.top + rect.height + this.scrollTop
|
||||
this.updateAiFloatEntry()
|
||||
})
|
||||
.exec()
|
||||
},
|
||||
updateAiFloatEntry() {
|
||||
this.showAiFloatEntry = this.aiEntryBottom > 0 && this.scrollTop >= this.aiEntryBottom
|
||||
},
|
||||
onSearch() {
|
||||
this.list = [];
|
||||
this.$refs.waterfall.clear();
|
||||
this.list1 = [];
|
||||
this.list2 = [];
|
||||
this.page = 1
|
||||
this.onRefreshList()
|
||||
// this.$push('/sub_pages/member/member', this.where)
|
||||
},
|
||||
},
|
||||
watch: {}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
.search-fix {
|
||||
width: 600rpx;
|
||||
margin: auto;
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
border-radius: 100rpx;
|
||||
box-shadow: 0 3rpx 10rpx 0px #cccccc;
|
||||
.page {
|
||||
.search-fix {
|
||||
width: 600rpx;
|
||||
margin: auto;
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
border-radius: 100rpx;
|
||||
box-shadow: 0 3rpx 10rpx 0px #cccccc;
|
||||
|
||||
.search {
|
||||
width: 580rpx;
|
||||
margin: 15rpx auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.search {
|
||||
width: 580rpx;
|
||||
margin: 15rpx auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.region {
|
||||
width: 170rpx;
|
||||
color: #666666;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.input{
|
||||
width: 330rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.region {
|
||||
width: 170rpx;
|
||||
color: #666666;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.fixed {
|
||||
position: fixed;
|
||||
top: 300rpx;
|
||||
left: 75rpx;
|
||||
}
|
||||
.input {
|
||||
width: 330rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.no-fixed {
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
left: 75rpx;
|
||||
}
|
||||
.fixed {
|
||||
position: fixed;
|
||||
top: 300rpx;
|
||||
left: 75rpx;
|
||||
}
|
||||
|
||||
.tabs {
|
||||
margin-top: 80rpx;
|
||||
}
|
||||
.no-fixed {
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
left: 75rpx;
|
||||
}
|
||||
|
||||
.house-list {
|
||||
// width: 700rpx;
|
||||
// margin: 20rpx auto;
|
||||
// display: flex;
|
||||
// flex-wrap: wrap;
|
||||
// justify-content: space-between;
|
||||
.tabs {
|
||||
//margin-top: 80rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
margin-bottom: 40rpx;
|
||||
border-radius: 20rpx;
|
||||
// box-shadow: 0 3rpx 10rpx 0px #cccccc;
|
||||
background-color: #ffffff;
|
||||
width: 338rpx;
|
||||
.ai-entry {
|
||||
width: calc(100% - 88rpx);
|
||||
margin: 26rpx 20rpx;
|
||||
padding: 22rpx 24rpx;
|
||||
border-radius: 999rpx;
|
||||
border: 2rpx solid transparent;
|
||||
background: #ffffff;
|
||||
background-origin: border-box;
|
||||
background-clip: padding-box;
|
||||
background-image: linear-gradient(#ffffff, #ffffff), linear-gradient(135deg, #4f7cff, #32c5a6);
|
||||
background-clip: padding-box, border-box;
|
||||
box-shadow: 0 10rpx 28rpx rgba(63, 114, 244, 0.12);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
image {
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
height: 420rpx;
|
||||
width: 338rpx;
|
||||
}
|
||||
.ai-entry-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.info {
|
||||
padding: 20rpx 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.ai-avatar {
|
||||
width: 92rpx;
|
||||
height: 92rpx;
|
||||
border-radius: 50%;
|
||||
background: #ffffff;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 30rpx;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden; //溢出内容隐藏
|
||||
text-overflow: ellipsis; //文本溢出部分用省略号表示
|
||||
display: -webkit-box; //特别显示模式
|
||||
-webkit-line-clamp: 2; //行数
|
||||
line-clamp: 2;
|
||||
-webkit-box-orient: vertical; //盒子中内容竖直排列
|
||||
}
|
||||
.ai-entry-text {
|
||||
margin-left: 18rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.desc {
|
||||
color: #999999;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.ai-entry-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #1f2a37;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #ff0000;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.select-width{
|
||||
width: 200rpx;
|
||||
}
|
||||
</style>
|
||||
.ai-entry-desc {
|
||||
margin-top: 8rpx;
|
||||
font-size: 24rpx;
|
||||
color: #667085;
|
||||
}
|
||||
}
|
||||
|
||||
.ai-entry-btn {
|
||||
min-width: 160rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
border-radius: 999rpx;
|
||||
background: linear-gradient(to right, #3f72f4, #7a9cf3);
|
||||
box-shadow: 0 10rpx 20rpx rgba(63, 114, 244, 0.22);
|
||||
}
|
||||
}
|
||||
|
||||
.ai-float-entry {
|
||||
position: fixed;
|
||||
right: 28rpx;
|
||||
bottom: calc(48rpx + env(safe-area-inset-bottom));
|
||||
z-index: 1000;
|
||||
width: 132rpx;
|
||||
height: 132rpx;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 12rpx 32rpx rgba(31, 42, 55, 0.2);
|
||||
}
|
||||
|
||||
.ai-float-image {
|
||||
display: block;
|
||||
width: 132rpx;
|
||||
height: 132rpx;
|
||||
}
|
||||
|
||||
.house-list {
|
||||
// width: 700rpx;
|
||||
// margin: 20rpx auto;
|
||||
// display: flex;
|
||||
// flex-wrap: wrap;
|
||||
// justify-content: space-between;
|
||||
|
||||
.item {
|
||||
margin-bottom: 40rpx;
|
||||
border-radius: 20rpx;
|
||||
// box-shadow: 0 3rpx 10rpx 0px #cccccc;
|
||||
background-color: #ffffff;
|
||||
width: 338rpx;
|
||||
|
||||
image {
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
height: 420rpx;
|
||||
width: 338rpx;
|
||||
}
|
||||
|
||||
.info {
|
||||
padding: 20rpx 20rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.title {
|
||||
font-size: 30rpx;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden; //溢出内容隐藏
|
||||
text-overflow: ellipsis; //文本溢出部分用省略号表示
|
||||
display: -webkit-box; //特别显示模式
|
||||
-webkit-line-clamp: 2; //行数
|
||||
line-clamp: 2;
|
||||
-webkit-box-orient: vertical; //盒子中内容竖直排列
|
||||
}
|
||||
|
||||
.desc {
|
||||
color: #999999;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #ff0000;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.select-width {
|
||||
width: 200rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user