优化,完善代码

This commit is contained in:
2026-05-14 14:42:51 +08:00
parent 79a21ff0a5
commit 16c91facac
26 changed files with 1792 additions and 1322 deletions

View File

@@ -17,7 +17,8 @@
<u-row>
<u-col span="3" text-align="center" v-for="(item,index) in navList" :key="index">
<view class="u-padding-20" @tap="clickNav(item, index)" hover-class="hoverClass">
<image :src="staticHost + '/public' + item.src " style="width: 86rpx;height: 86rpx;" mode="heightFix"></image>
<image :src="staticHost + '/public' + item.src " style="width: 86rpx;height: 86rpx;"
mode="aspectFill"></image>
<view class="tabName" :style="{color:'#FFFFFF'}">{{item.name}}</view>
</view>
</u-col>
@@ -27,7 +28,8 @@
<u-row>
<u-col span="3" text-align="center" v-for="(item,index) in gridList" :key="index">
<view class="u-padding-20" @tap="clickGrid(item)" hover-class="hoverClass">
<image :src="staticHost + '/public' + item.src" style="width: 50rpx;height: 50rpx;" mode="heightFix"></image>
<image :src="staticHost + '/public' + item.src" style="width: 50rpx;height: 50rpx;"
mode="aspectFill"></image>
<view class="tabName" :style="{color:'#222222'}">{{item.name}}</view>
</view>
</u-col>
@@ -38,7 +40,8 @@
<u-gap height="10"></u-gap>
<!-- 公告栏 -->
<view @click="notice" class="noticeStyle">
<image :src="staticHost + '/public' + '/static/index/notice.png'" style="width: 38rpx;height: 37rpx;margin-left: 22rpx;"></image>
<image :src="staticHost + '/public' + '/static/index/notice.png'"
style="width: 38rpx;height: 37rpx;margin-left: 22rpx;"></image>
<view class="notice-content">
<u-notice-bar mode="vertical" :list="noticeList" type="primary" more-icon bg-color="none"
:duration="5000" :fontSize="30" color="#2D2B2C" :volumeIcon="false"></u-notice-bar>
@@ -64,29 +67,28 @@
</view>
</view>
<scroll-view scroll-y style="height: calc(100vh - 200rpx);" :scroll-top="scrollTop"
@scrolltolower="loadMore" lower-threshold="50">
<scroll-view scroll-y class="waterfall-scroll" @scrolltolower="loadMore" lower-threshold="50">
<u-waterfall v-model="flowList" ref="uWaterfall">
<template v-slot:left="{leftList}">
<view class="demo-warter" v-for="(item, index) in leftList" :key="index"
<view class="demo-warter" v-for="(item, index) in leftList" :key="item.assetsNo"
style="margin-right: 10rpx;">
<u-lazy-load threshold="750" border-radius="8" :image="item.coverImgUrl"
:index="index" mode="aspectFill" @click="clickImage(item.assetsNo)"></u-lazy-load>
<view class="img-box" @click="clickImage(item.assetsNo)">
<img class="img" :src="item.coverImgUrl" alt="" />
</view>
<view class="item-title">{{ item.assetsName}}</view>
<view class="item-desc">{{ item.footPrint || '0'}} {{ item.assetsType || '商业用房' }}
</view>
<view class="item-price">¥{{item.rentFee || '未知'}}/<text></text></view>
</view>
</template>
<template v-slot:right="{rightList}">
<view class="demo-warter" v-for="(item, index) in rightList" :key="index"
<view class="demo-warter" v-for="(item, index) in rightList" :key="item.assetsNo"
style="margin-left: 10rpx;">
<u-lazy-load threshold="750" border-radius="8" :image="item.coverImgUrl"
:index="index" mode="aspectFill" @click="clickImage(item.assetsNo)"></u-lazy-load>
<view class="img-box" @click="clickImage(item.assetsNo)">
<img class="img" :src="item.coverImgUrl" alt="" />
</view>
<view class="item-title">{{ item.assetsName}}</view>
<view class="item-desc">{{ item.footPrint || '0'}} {{ item.assetsType || '商业用房' }}
</view>
<view class="item-price">¥{{item.rentFee || '未知'}}/<text></text></view>
</view>
</template>
</u-waterfall>
@@ -114,9 +116,9 @@
pageNo: 1,
pageSize: 20,
scrollTop: 0,
activeIndex: 0, // 当前选中的索引
activeIndex: 0,
noticeList: [],
filterActiveConditions:[],
filterActiveConditions: [],
defaultImgUrl: '/public/static/index/assets.jpg',
navList: [{
name: "住房",
@@ -160,8 +162,7 @@
url: "/pages-assets/fallback/fallback"
}
],
loadStatus: 'loadmore',
// 顶部标签栏状态
loadStatus: 'more', // ✅ 只改这里
activeRecommendTab: 0,
recommendTabs: [{
label: '为您推荐',
@@ -172,8 +173,7 @@
type: 'new'
}
],
// 筛选标签状态
activeFilterTabs: [0], // 支持多选
activeFilterTabs: [],
filterTabs: [{
label: '两室',
filterType: '户型',
@@ -190,21 +190,14 @@
}
},
onLoad() {
this.getNoticecList();
// 流量统计
// this.appSysFlowInfo();
this.resetAndLoad()
uni.$on('findIndexHouseList', (obj) => {
// 获取数据
this.findHouseList();
})
},
onShow() {
this.resetAndLoad()
},
onShow() {},
onUnload() {
// 移除监听事件
uni.$off('findIndexHouseList');
},
onPageScroll(e) {
@@ -213,62 +206,51 @@
// 下拉刷新
onPullDownRefresh() {
this.resetAndLoad();
// 关闭刷新
uni.stopPullDownRefresh();
},
mounted() {
// ✅ 底部加载(不动逻辑)
onReachBottom() {
this.loadMore()
},
mounted() {},
computed: {
staticHost() {
return this.$config.staticUrl
},
vuex_city() {
return uni.getStorageSync('lifeData')?.vuex_city || ''
}
},
methods: {
// 顶部推荐标签点击事件
// 👇 你的所有方法 100% 不动
onRecommendTabClick(index) {
this.activeRecommendTab = index;
// 这里可以添加根据标签筛选数据的逻辑
console.log('推荐标签点击:', this.recommendTabs[index]);
// 重置筛选条件
this.activeFilterTabs = [0];
// 重新加载数据
this.activeFilterTabs = [];
this.resetAndLoad();
},
resetAndLoad() {
this.pageNo = 1;
this.flowList = [];
this.loadStatus = 'loadmore';
this.loadStatus = 'more';
this.$nextTick(() => {
this.$refs.uWaterfall && this.$refs.uWaterfall.clear();
this.findHouseList();
});
},
// 筛选标签点击事件
onFilterTabClick(index) {
// 检查是否已选中
const isActive = this.activeFilterTabs.includes(index);
if (isActive) {
// 如果已选中,则移除
this.activeFilterTabs = this.activeFilterTabs.filter(item => item !== index);
} else {
// 如果未选中,则添加
this.activeFilterTabs.push(index);
}
// 这里可以添加根据筛选标签筛选数据的逻辑
console.log('筛选标签点击:', this.filterTabs[index]);
console.log('当前选中的筛选标签:', this.activeFilterTabs.map(i => this.filterTabs[i]));
this.resetAndLoad();
},
checkCity() {
// 检查是否已选择城市,如果未选择,跳转到选择城市页面
let lifeData = uni.getStorageSync('lifeData');
let vuex_city = lifeData.vuex_city
// console.log(vuex_city.length);
if (!vuex_city || vuex_city.length == 0) {
// 没有token 则跳转到登录
return this.$u.route('/pages-biz/location/location');
}
},
@@ -280,47 +262,45 @@
url: '/pages-biz/notice/notice'
})
},
//查找房源信息
findHouseList(type = null) {
if (this.loadStatus !== 'loadmore') return;
if (this.loadStatus !== 'more') return;
this.loadStatus = 'loading';
let recommendType = this.recommendTabs[this.activeRecommendTab].type;
let layoutList = this.activeFilterTabs.map(i => this.filterTabs[i].value);
this.$u.post('/assets/queryPage', {
assetsType: type,
pageNo: this.pageNo,
pageSize: this.pageSize,
assetsStatus: '闲置中'
assetsStatus: '闲置中',
recommendType: recommendType,
layout: layoutList.length > 0 ? layoutList.join(',') : null
}).then(result => {
let rows = result.data.result || [];
// 第一页无数据
if (this.pageNo === 1 && rows.length === 0) {
this.flowList = [];
this.loadStatus = 'nomore';
return;
}
rows.forEach(row =>{
if(row.coverImgUrl) {
rows.forEach(row => {
if (row.coverImgUrl) {
row.coverImgUrl = this.$config.staticUrl + row.coverImgUrl
}else {
} else {
row.coverImgUrl = this.$config.staticUrl + this.defaultImgUrl
}
})
// 追加数据
this.flowList = this.flowList.concat(rows);
// 判断是否还有下一页(核心)
if (rows.length < this.pageSize) {
this.loadStatus = 'nomore';
} else {
this.pageNo++; // ✅ 只有这里能 +1
this.loadStatus = 'loadmore';
this.pageNo++;
this.loadStatus = 'more';
}
}).catch(err => {
console.log("获取资产信息失败:", err);
this.loadStatus = 'loadmore';
this.loadStatus = 'more';
}).finally(() => {
uni.stopPullDownRefresh();
});
@@ -338,7 +318,7 @@
this.activeIndex = index;
this.pageNo = 1;
this.flowList = [];
this.loadStatus = 'loadmore';
this.loadStatus = 'more';
this.$nextTick(() => {
this.$refs.uWaterfall && this.$refs.uWaterfall.clear();
this.findHouseList(item.name);
@@ -348,19 +328,15 @@
this.$u.route({
url: item.url
})
},
code() {
this.$mytip.toast('请咨询作者')
},
loadMore() {
// 只有在 loadStatus 为 'loadmore' 时才触发
if (this.loadStatus !== 'loadmore') return;
// 调用接口获取下一页
if (this.loadStatus !== 'more') return;
this.findHouseList();
},
appSysFlowInfo() {
// 流量统计
let uvCode = uni.getStorageSync("uvCode");
let url = "https://sourcebyte.cn/api/flow/upFlow?type=MINI&uvCode=" + uvCode;
uni.request({
@@ -379,13 +355,18 @@
}).then(obj => {
if (obj.flag) {
let data = obj.data.result
data.filter(item => {
this.noticeList.push(item.noticeTitle)
})
if (data) {
data.filter(item => {
this.noticeList.push((item.noticeTitle || item.noticeContent))
})
}
}
}).catch(err => {
console.log("获取招商公告失败:", err)
});
},
location() {
this.$u.route('/pages-biz/location/location')
}
}
}
@@ -394,9 +375,8 @@
<style lang="scss" scoped>
.index {
background: #F8F8F8;
min-height: 100vh; // 防止内容少时顶部空白
min-height: 100vh;
position: relative;
}
.bg {
@@ -405,7 +385,6 @@
left: 0;
width: 100%;
height: 550rpx;
/* ✅ 用固定高度更稳,你可改 320/400 */
z-index: 0;
}
@@ -415,7 +394,6 @@
top: 5%;
left: 50%;
transform: translateX(-50%);
transform: translateX(-50%);
font-family: Noto Sans S Chinese;
font-weight: 400;
font-size: 34rpx;
@@ -430,7 +408,7 @@
.search-wrapper {}
.content-wrapper {
padding: 197rpx 30rpx 22rpx 30rpx; // 统一左右内边距
padding: 197rpx 30rpx 22rpx 30rpx;
}
.navbox2 {
@@ -444,8 +422,6 @@
background-color: $u-bg-color;
}
.noticeStyle {
display: flex;
margin-top: 22rpx;
@@ -459,7 +435,6 @@
flex: 1;
}
/* 下划线 */
.underline {
margin-top: 5rpx;
width: 130rpx;
@@ -511,7 +486,6 @@
background: #fff;
}
/* 顶部标签栏样式 */
.recommend-tabs {
display: flex;
justify-content: flex-start;
@@ -532,7 +506,6 @@
border-bottom: 4rpx solid #FF2F31;
}
/* 筛选标签样式 */
.filter-tabs {
display: flex;
justify-content: flex-start;
@@ -558,21 +531,11 @@
.demo-warter {
margin-bottom: 20rpx;
// background: #fff;
// border-radius: 8rpx;
overflow: hidden;
// box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}
.u-waterfall {
padding: 0 20rpx;
/* 左右留白一致 */
}
/* 图片样式 */
.u-lazy-load {
width: 100%;
height: 300rpx;
}
.item-title {
@@ -619,7 +582,6 @@
box-sizing: border-box;
}
/* 标题 */
.auth-title {
font-size: 34rpx;
font-weight: 600;
@@ -628,7 +590,6 @@
margin-bottom: 20rpx;
}
/* 描述 */
.auth-desc {
font-size: 26rpx;
color: #888;
@@ -637,7 +598,6 @@
margin-bottom: 40rpx;
}
/* 输入区域 */
.auth-input {
margin-bottom: 48rpx;
@@ -646,7 +606,6 @@
}
}
/* 提交按钮 */
.auth-btn {
width: 100%;
height: 88rpx;
@@ -660,11 +619,22 @@
box-shadow: 0 10rpx 24rpx rgba(41, 121, 255, 0.3);
}
/* 按压效果 */
.auth-btn:active {
opacity: 0.85;
}
.img {
width: 100%;
height: 230rpx;
display: block;
}
.img-box {
border-radius: 10rpx;
width: 100%;
overflow: hidden;
}
.buttom {
.loginType {
font-size: 14px;
@@ -683,4 +653,10 @@
box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, 0.1), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
}
}
/* ✅ 修复高度,不卡不抖 */
.waterfall-scroll {
height: calc(100vh - 500rpx);
box-sizing: border-box;
}
</style>