首页轮播图加判断渲染图片，首页瀑布流广告图片加加载后再修改瀑布流
This commit is contained in:
A1300399510
parent
89b261b0bb
commit
7fdd7434af
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
dist/index.html
vendored
2
dist/index.html
vendored
@ -1,4 +1,4 @@
|
||||
<!doctype html><html lang=""><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1"/><link rel="icon" href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/favicon.ico"/><title>港校租房</title><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/chunk-vendors.6d96b969.js"></script><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/app.eba1abfa.js"></script><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/chunk-vendors.7885d77e.css" rel="stylesheet"><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/app.0151fe42.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but zufang doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><script src="https://app.gter.net/bottom?tpl=header&menukey=fang"></script><div id="app"></div><div style="display: none;"><script src="//v1.cnzz.com/z_stat.php?id=1281224882&web_id=1281224882"></script><script>var _hmt = _hmt || []
|
||||
<!doctype html><html lang=""><head><meta charset="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1"/><link rel="icon" href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/favicon.ico"/><title>港校租房</title><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/chunk-vendors.6d96b969.js"></script><script defer="defer" src="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/js/app.f0f383e7.js"></script><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/chunk-vendors.7885d77e.css" rel="stylesheet"><link href="https://ansnid.oss-cn-shenzhen.aliyuncs.com/fang/css/app.94ae0c09.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but zufang doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><script src="https://app.gter.net/bottom?tpl=header&menukey=fang"></script><div id="app"></div><div style="display: none;"><script src="//v1.cnzz.com/z_stat.php?id=1281224882&web_id=1281224882"></script><script>var _hmt = _hmt || []
|
||||
;(function () {
|
||||
var hm = document.createElement("script")
|
||||
hm.src = "//hm.baidu.com/hm.js?4bd66cbe45a640b607fe46c48f658746"
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
dist/js/app.eba1abfa.js
vendored
1
dist/js/app.eba1abfa.js
vendored
File diff suppressed because one or more lines are too long
1
dist/js/app.f0f383e7.js
vendored
Normal file
1
dist/js/app.f0f383e7.js
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -88,7 +88,7 @@
|
||||
|
||||
<!-- 广告 -->
|
||||
</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" @load="imgload" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -102,7 +102,16 @@ const props = defineProps({
|
||||
return {}
|
||||
},
|
||||
},
|
||||
listMasonryInstance: {
|
||||
type: Object,
|
||||
},
|
||||
})
|
||||
|
||||
const imgload = () => {
|
||||
props.listMasonryInstance.reloadItems();
|
||||
props.listMasonryInstance.layout();
|
||||
}
|
||||
|
||||
let itemData = props.data
|
||||
let location = reactive({ data: {} })
|
||||
location.data = store.state.indexData.config.location
|
||||
@ -293,7 +302,6 @@ watchEffect(() => {
|
||||
display: -webkit-box;
|
||||
line-height: 28px;
|
||||
|
||||
|
||||
.type {
|
||||
width: 34px;
|
||||
height: 20px;
|
||||
@ -445,7 +453,8 @@ watchEffect(() => {
|
||||
.live-img {
|
||||
width: 285px;
|
||||
/* height: 349px; */
|
||||
min-height: 370px;
|
||||
/* min-height: 370px; */
|
||||
min-height: 193px;
|
||||
border-radius: 16px;
|
||||
margin-bottom: 20px;
|
||||
cursor: pointer;
|
||||
|
||||
@ -40,10 +40,10 @@
|
||||
<!-- <div class="dis-f jus-x al-item" style="margin-top:20px;" v-if="bannerLists.data.length"> -->
|
||||
<div class="dis-f jus-x al-item" v-if="bannerLists.data.length">
|
||||
<div class="body-maxWidth">
|
||||
<el-carousel :interval="5000" arrow="always" height="330" style="height: 330px;">
|
||||
<el-carousel-item v-for="item in bannerLists.data" :key="item.feedId">
|
||||
<el-carousel :interval="5000" arrow="always" height="330" style="height: 330px;" @change="carouselChange">
|
||||
<el-carousel-item v-for="(item, i) in bannerLists.data" :key="item.feedId">
|
||||
<div style="width: 100%; height: 100%;" class="dis-f jus-x al-item">
|
||||
<img class="carousel-img" :src="item.imageurl" alt="" :title="item.title" @click="openInfo(item)" />
|
||||
<img v-if="i >= carouselIndex - 1 && i <= carouselIndex + 1" class="carousel-img" :src="item.imageurl" alt="" :title="item.title" @click="openInfo(item)" />
|
||||
</div>
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
@ -53,9 +53,7 @@
|
||||
<div class="body-maxWidth dis-f" style="height: 40px;">
|
||||
<div class="tab-btn dis-f al-item jus-x" :class="{ 'tab-btn-click': item.path === tabBtnType }" v-for="(item, i) in seachTab.data" :key="i" @click="changeTabBtnType(item)">
|
||||
<el-badge v-if="item['path'] == '/user' && user.data['messagenum'] != 0" :value="user.data['messagenum']">
|
||||
<div style="padding: 0 10px;">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
<div style="padding: 0 10px;">{{ item.name }}</div>
|
||||
</el-badge>
|
||||
<div v-else>{{ item.name }}</div>
|
||||
</div>
|
||||
@ -160,13 +158,19 @@ const loginBtn = type => {
|
||||
const goIndex = () => router.push("/")
|
||||
|
||||
watchEffect(() => {
|
||||
if (routePath.value == "/needHousing") bannerLists.data = store.state.bannerData.needHousing || []
|
||||
if (routePath.value == "/needHousing") bannerLists.data = store.state.bannerData.needHousing || []
|
||||
else if (routePath.value == "/intermediaryHousing") bannerLists.data = store.state.bannerData.intermediaryHousing || []
|
||||
else if (routePath.value == "/personHousing") bannerLists.data = store.state.bannerData.personHousing || []
|
||||
else if (routePath.value == "/apartment") bannerLists.data = store.state.bannerData.apartment || []
|
||||
else if (routePath.value == "/") bannerLists.data = store.state.bannerData.home || []
|
||||
|
||||
})
|
||||
|
||||
let carouselIndex = ref(0) // 轮播图的索引
|
||||
|
||||
const carouselChange = value => {
|
||||
console.log("value", value)
|
||||
carouselIndex.value = value
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.pos-r {
|
||||
|
||||
@ -139,7 +139,9 @@ router.beforeEach((to, from, next) => {
|
||||
//随机增加进度
|
||||
NProgress.inc();
|
||||
|
||||
|
||||
next()
|
||||
|
||||
let meta = to['meta'] || {}
|
||||
let title = meta['title']
|
||||
if (title) setSeoTitle(title)
|
||||
|
||||
@ -137,7 +137,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<indexWaterfallBox v-for="(item, i) in waterfallList" :data="item" :key="i"></indexWaterfallBox>
|
||||
<indexWaterfallBox v-for="(item, i) in waterfallList" :data="item" :key="i" :listMasonryInstance="listMasonryInstance"></indexWaterfallBox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -243,9 +243,10 @@ let loadText = ref('下拉加载更多')
|
||||
//瀑布流数据
|
||||
let getRecommendList = () => {
|
||||
loadText.value = '加载中.....'
|
||||
const limit = 30
|
||||
api.recommendList({
|
||||
page: pages.value,
|
||||
limit: 30,
|
||||
limit,
|
||||
type: ListSelectBtn.selectType,
|
||||
pagevalue: pagevalue.value
|
||||
}).then(res => {
|
||||
@ -257,7 +258,7 @@ let getRecommendList = () => {
|
||||
pagevalue.value = res.data.pagevalue
|
||||
}
|
||||
|
||||
if (res.data.data.length >= 30) {
|
||||
if (res.data.data.length >= limit) {
|
||||
loadMore.value = true
|
||||
loadText.value = '下拉加载更多'
|
||||
} else {
|
||||
@ -265,7 +266,6 @@ let getRecommendList = () => {
|
||||
loadText.value = '到底了'
|
||||
}
|
||||
nextTick(() => {
|
||||
|
||||
listMasonryInstance.reloadItems();
|
||||
listMasonryInstance.layout();
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user