kaifabu/RentWeAppFront
2
0
Fork 0
mirror of http://36.133.248.69:3088/admin/RentWeAppFront.git synced 2026-07-26 14:32:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

调整ui

Browse Source
This commit is contained in:
RuicyWu
2026-06-24 09:52:59 +08:00
parent ba0585c8aa
commit 070f3bab4f
9 changed files with 101 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
pages/index/index.vue
View File

@@ -3,23 +3,39 @@
<image :src="staticHost + '/public/static/index/index_bg.png'" mode="aspectFill" class="bg"></image>
<float-guide :initX="280" :initY="400" :videoSrc="staticHost + '/public/static/index/guide.mp4'" />
<!-- 搜索栏 -->
<view class="index-title">
伍家国投
<view class="index-title" :style="{ top: capsuleTop + 'px', height: capsuleHeight + 'px', lineHeight: capsuleHeight + 'px' }">
新望资产
</view>
<view class="content-wrapper">
<view class="content-wrapper" :style="{ paddingTop: (capsuleTop + capsuleHeight + 20) + 'px' }">
<view class="search-wrapper">
<search-bar :city="vuex_city==''?'选择':vuex_city" placeholder="你想住在哪儿" @chooseCity="location"
@search="search" />
</view>
<!-- 轮播图 -->
<view class="banner-wrap">
<swiper
class="banner-swiper"
:autoplay="true"
:interval="3000"
:circular="true"
:indicator-dots="true"
indicator-color="rgba(255,255,255,0.4)"
indicator-active-color="#fff"
>
<swiper-item v-for="(item, index) in bannerList" :key="index">
<image class="banner-img" :src="item.src" mode="aspectFill" @tap="onBannerTap(item)" />
</swiper-item>
</swiper>
</view>
<!-- 房源信息导航栏 -->
<view class="nav-area">
<view class="rowClass">
<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="aspectFill"></image>
<view class="u-padding-10" @tap="clickNav(item, index)" hover-class="hoverClass">
<image :src="staticHost + item.src " style="width: 80rpx;height: 80rpx;"
mode="aspectFill"></image>
<view class="tabName" :style="{color:'#FFFFFF'}">{{item.name}}</view>
</view>
</u-col>
@@ -29,7 +45,7 @@
<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;"
<image :src="staticHost + '/public' + item.src" style="width: 64rpx;height: 64rpx;"
mode="aspectFill"></image>
<view class="tabName" :style="{color:'#222222'}">{{item.name}}</view>
</view>
@@ -124,24 +140,29 @@
filterActiveConditions: [],
defaultImgUrl: '/public/static/index/assets.jpg',
navList: [{
name: "住房",
src: "/static/index/house.png",
type: "住房"
name: "房屋",
src: "/public/static/index/house.png",
type: "房屋"
},
{
name: "商铺",
src: "/static/index/shop.png",
type: "住房"
name: "安置房",
src: "/public/static/index/azhouse.png",
type: "安置房"
},
{
name: "厂房",
src: "/static/index/factory.png",
type: "厂房"
name: "公租房",
src: "/public/static/index/gzhouse.png",
type: "公租房"
},
{
name: "停车场",
src: "/static/index/parking.png",
type: "停车场"
name: "产业园",
src: "/public/static/index/cyy.png",
type: "产业园"
},
{
name: "土地",
src: "/public/static/index/land.png",
type: "土地"
}
],
gridList: [{
@@ -189,10 +210,21 @@
}
],
flowList: [],
uvCode: uni.getStorageSync('uvCode')
uvCode: uni.getStorageSync('uvCode'),
capsuleTop: 0,
capsuleHeight: 32,
bannerList: [
{ src: 'https://7478-tx-cloud-mix-mall-d6944c-1302673523.tcb.qcloud.la/5bfbd58b18200d8e16f6b17a02e6ed9.png' },
]
}
},
onLoad() {
// 获取胶囊位置，使标题与胶囊同行
const menuButton = wx.getMenuButtonBoundingClientRect ? wx.getMenuButtonBoundingClientRect() : null;
if (menuButton) {
this.capsuleTop = menuButton.top;
this.capsuleHeight = menuButton.height;
}
this.getNoticecList();
this.resetAndLoad()
uni.$on('findIndexHouseList', (obj) => {
@@ -368,6 +400,11 @@
console.log("获取招商公告失败：", err)
});
},
onBannerTap(item) {
if (item.url) {
uni.navigateTo({ url: item.url })
}
},
location() {
this.$u.route('/pages-biz/location/location')
}
@@ -387,19 +424,17 @@
top: 0;
left: 0;
width: 100%;
height: 550rpx;
height: 960rpx;
z-index: 0;
}
.index-title {
position: absolute;
z-index: 1;
top: 5%;
left: 50%;
transform: translateX(-50%);
z-index: 2;
left: 30rpx;
font-family: Noto Sans S Chinese;
font-weight: 400;
font-size: 34rpx;
font-weight: 500;
font-size: 54rpx;
color: #FFFFFF;
}
@@ -410,8 +445,29 @@
.search-wrapper {}
.banner-wrap {
display: flex;
justify-content: center;
margin-top: 22rpx;
.banner-swiper {
width: 656rpx;
height: 218rpx;
border-radius: 16rpx;
overflow: hidden;
}
.banner-img {
width: 100%;
height: 100%;
border-radius: 16rpx;
}
}
.content-wrapper {
padding: 197rpx 30rpx 22rpx 30rpx;
padding-left: 30rpx;
padding-right: 30rpx;
padding-bottom: 22rpx;
}
.navbox2 {
@@ -505,8 +561,8 @@
}
.tab-item.active {
color: #FF2F31;
border-bottom: 4rpx solid #FF2F31;
color: #258AE6;
border-bottom: 4rpx solid #258AE6;
}
.filter-tabs {
@@ -528,8 +584,8 @@
}
.filter-item.active {
background: #FFECEC;
color: #FF2F31;
background: #d4e2ef;
color: #258AE6;
}
.demo-warter {
@@ -557,7 +613,7 @@
.item-price {
font-size: 32rpx;
color: #FF2F31;
color: #258AE6;
margin-bottom: 10rpx;
}
@@ -613,7 +669,7 @@
width: 100%;
height: 88rpx;
line-height: 88rpx;
background: linear-gradient(135deg, #FF2F31, #FF9379);
background: linear-gradient(135deg, #258AE6, #79b5ff);
color: #fff;
font-size: 30rpx;
font-weight: 500;