mirror of
http://36.133.248.69:3088/admin/RentWeAppFront.git
synced 2026-07-26 14:32:26 +08:00
768 lines
18 KiB
Vue
768 lines
18 KiB
Vue
<template>
|
|
<view class="index">
|
|
<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" :style="{ top: capsuleTop + 'px', height: capsuleHeight + 'px', lineHeight: capsuleHeight + 'px' }">
|
|
新望资产
|
|
</view>
|
|
<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-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>
|
|
</u-row>
|
|
</view>
|
|
<view class="rowClass navbox2">
|
|
<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: 64rpx;height: 64rpx;"
|
|
mode="aspectFill"></image>
|
|
<view class="tabName" :style="{color:'#222222'}">{{item.name}}</view>
|
|
</view>
|
|
</u-col>
|
|
</u-row>
|
|
</view>
|
|
</view>
|
|
|
|
<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>
|
|
<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>
|
|
</view>
|
|
</view>
|
|
|
|
<u-gap height="5"></u-gap>
|
|
|
|
<view class="tab-content">
|
|
<!-- 顶部标签栏 -->
|
|
<view class="recommend-tabs">
|
|
<view class="tab-item" :class="{ active: activeRecommendTab === index }"
|
|
v-for="(tab, index) in recommendTabs" :key="index" @click="onRecommendTabClick(index)">
|
|
{{ tab.label }}
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 筛选标签 -->
|
|
<view class="filter-tabs">
|
|
<view class="filter-item" :class="{ active: activeFilterTabs.includes(index) }"
|
|
v-for="(tab, index) in filterTabs" :key="index" @click="onFilterTabClick(index)">
|
|
{{ tab.label}}
|
|
</view>
|
|
</view>
|
|
|
|
<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="item.assetsNo"
|
|
style="margin-right: 10rpx;">
|
|
<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>
|
|
</template>
|
|
<template v-slot:right="{rightList}">
|
|
<view class="demo-warter" v-for="(item, index) in rightList" :key="item.assetsNo"
|
|
style="margin-left: 10rpx;">
|
|
<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>
|
|
</template>
|
|
</u-waterfall>
|
|
<u-loadmore :status="loadStatus" />
|
|
</scroll-view>
|
|
|
|
</view>
|
|
|
|
<u-back-top :scroll-top="scrollTop" top="1000"></u-back-top>
|
|
<u-no-network></u-no-network>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import SearchBar from '../../components/searchBar/SearchBar.vue';
|
|
import floatGuide from '../../components/floatGuide/floatGuide.vue';
|
|
export default {
|
|
components: {
|
|
SearchBar,
|
|
floatGuide
|
|
},
|
|
data() {
|
|
return {
|
|
keyword: '',
|
|
pageNo: 1,
|
|
pageSize: 20,
|
|
scrollTop: 0,
|
|
activeIndex: 0,
|
|
noticeList: [],
|
|
filterActiveConditions: [],
|
|
defaultImgUrl: '/public/static/index/assets.jpg',
|
|
navList: [{
|
|
name: "房屋",
|
|
src: "/public/static/index/house.png",
|
|
type: "房屋"
|
|
},
|
|
{
|
|
name: "安置房",
|
|
src: "/public/static/index/azhouse.png",
|
|
type: "安置房"
|
|
},
|
|
{
|
|
name: "公租房",
|
|
src: "/public/static/index/gzhouse.png",
|
|
type: "公租房"
|
|
},
|
|
{
|
|
name: "产业园",
|
|
src: "/public/static/index/cyy.png",
|
|
type: "产业园"
|
|
},
|
|
{
|
|
name: "土地",
|
|
src: "/public/static/index/land.png",
|
|
type: "土地"
|
|
}
|
|
],
|
|
gridList: [{
|
|
name: "看房预约",
|
|
src: "/static/index/reserve.png",
|
|
url: "/pages-biz/reserve/reserveRecords"
|
|
},
|
|
{
|
|
name: "合同签约",
|
|
src: "/static/index/contract.png",
|
|
url: "/pages-biz/contract/contract"
|
|
},
|
|
{
|
|
name: "退租申请",
|
|
src: "/static/index/discharge.png",
|
|
url: "/pages-assets/discharge/leaseCancelList"
|
|
},
|
|
{
|
|
name: "留言板",
|
|
src: "/static/index/fallback.png",
|
|
url: "/pages-assets/fallback/fallback"
|
|
}
|
|
],
|
|
loadStatus: 'more', // ✅ 只改这里
|
|
activeRecommendTab: 0,
|
|
recommendTabs: [{
|
|
label: '为您推荐',
|
|
type: 'recommend'
|
|
},
|
|
{
|
|
label: '上新',
|
|
type: 'new'
|
|
}
|
|
],
|
|
activeFilterTabs: [],
|
|
filterTabs: [{
|
|
label: '两室',
|
|
filterType: '户型',
|
|
value: '两室'
|
|
},
|
|
{
|
|
label: '一室',
|
|
filterType: '户型',
|
|
value: '一室'
|
|
}
|
|
],
|
|
flowList: [],
|
|
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) => {
|
|
this.findHouseList();
|
|
})
|
|
},
|
|
onShow() {},
|
|
onUnload() {
|
|
uni.$off('findIndexHouseList');
|
|
},
|
|
onPageScroll(e) {
|
|
this.scrollTop = e.scrollTop;
|
|
},
|
|
// 下拉刷新
|
|
onPullDownRefresh() {
|
|
this.resetAndLoad();
|
|
uni.stopPullDownRefresh();
|
|
},
|
|
// ✅ 底部加载（不动逻辑）
|
|
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;
|
|
this.activeFilterTabs = [];
|
|
this.resetAndLoad();
|
|
},
|
|
resetAndLoad() {
|
|
this.pageNo = 1;
|
|
this.flowList = [];
|
|
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);
|
|
}
|
|
this.resetAndLoad();
|
|
},
|
|
checkCity() {
|
|
let lifeData = uni.getStorageSync('lifeData');
|
|
let vuex_city = lifeData.vuex_city
|
|
if (!vuex_city || vuex_city.length == 0) {
|
|
return this.$u.route('/pages-biz/location/location');
|
|
}
|
|
},
|
|
search() {
|
|
this.$u.route('/pages-biz/search/search');
|
|
},
|
|
notice() {
|
|
this.$u.route({
|
|
url: '/pages-biz/notice/notice'
|
|
})
|
|
},
|
|
findHouseList(type = null) {
|
|
if (this.loadStatus !== 'more') return;
|
|
|
|
this.loadStatus = 'loading';
|
|
|
|
// TODO: 接口联调时取消注释，删除 mock 数据
|
|
// 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: '闲置中',
|
|
// 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) {
|
|
// row.coverImgUrl = this.$config.staticUrl + row.coverImgUrl
|
|
// } 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++;
|
|
// this.loadStatus = 'more';
|
|
// }
|
|
// }).catch(err => {
|
|
// console.log("获取资产信息失败：", err);
|
|
// this.loadStatus = 'more';
|
|
// }).finally(() => {
|
|
// uni.stopPullDownRefresh();
|
|
// });
|
|
|
|
// Mock 静态数据
|
|
const mockData = [
|
|
{
|
|
assetsNo: 'ASSET-001',
|
|
assetsName: '东山大道435-2-1-104号',
|
|
assetsType: '住宅',
|
|
footPrint: 120,
|
|
coverImgUrl: this.$config.staticUrl + this.defaultImgUrl
|
|
},
|
|
{
|
|
assetsNo: 'ASSET-002',
|
|
assetsName: '夷陵大道418号商铺',
|
|
assetsType: '商铺',
|
|
footPrint: 85,
|
|
coverImgUrl: this.$config.staticUrl + this.defaultImgUrl
|
|
},
|
|
{
|
|
assetsNo: 'ASSET-003',
|
|
assetsName: '解放路88号写字楼',
|
|
assetsType: '写字楼',
|
|
footPrint: 200,
|
|
coverImgUrl: this.$config.staticUrl + this.defaultImgUrl
|
|
},
|
|
{
|
|
assetsNo: 'ASSET-004',
|
|
assetsName: '沿江大道168号住房',
|
|
assetsType: '住宅',
|
|
footPrint: 95,
|
|
coverImgUrl: this.$config.staticUrl + this.defaultImgUrl
|
|
}
|
|
];
|
|
|
|
setTimeout(() => {
|
|
if (this.pageNo === 1) this.flowList = [];
|
|
this.flowList = this.flowList.concat(mockData);
|
|
this.loadStatus = 'nomore';
|
|
uni.stopPullDownRefresh();
|
|
}, 500);
|
|
},
|
|
clickImage(assetsNo) {
|
|
console.log(assetsNo)
|
|
this.$u.route({
|
|
url: '/pages-assets/assets/assetsDetail',
|
|
params: {
|
|
assetsNo: assetsNo
|
|
}
|
|
})
|
|
},
|
|
clickNav(item, index) {
|
|
this.activeIndex = index;
|
|
this.pageNo = 1;
|
|
this.flowList = [];
|
|
this.loadStatus = 'more';
|
|
this.$nextTick(() => {
|
|
this.$refs.uWaterfall && this.$refs.uWaterfall.clear();
|
|
this.findHouseList(item.name);
|
|
});
|
|
},
|
|
clickGrid(item) {
|
|
this.$u.route({
|
|
url: item.url
|
|
})
|
|
},
|
|
code() {
|
|
this.$mytip.toast('请咨询作者')
|
|
},
|
|
loadMore() {
|
|
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({
|
|
url: url,
|
|
method: "POST",
|
|
success: (res) => {
|
|
uni.setStorageSync("uvCode", res.data.data);
|
|
},
|
|
});
|
|
},
|
|
getNoticecList() {
|
|
// TODO: 接口联调时取消注释，删除 mock 数据
|
|
// let url = "/notice/pageQuery";
|
|
// this.$u.post(url, {
|
|
// pageNo: 1,
|
|
// pageSize: 10
|
|
// }).then(obj => {
|
|
// if (obj.flag) {
|
|
// let data = obj.data.result
|
|
// if (data) {
|
|
// data.filter(item => {
|
|
// this.noticeList.push((item.noticeTitle || item.noticeContent))
|
|
// })
|
|
// }
|
|
// }
|
|
// }).catch(err => {
|
|
// console.log("获取招商公告失败：", err)
|
|
// });
|
|
|
|
// Mock 静态数据
|
|
this.noticeList = [
|
|
'东山大道435号房屋招租公告',
|
|
'夷陵大道418号商铺招租',
|
|
'2026年第三季度资产招租计划'
|
|
];
|
|
},
|
|
onBannerTap(item) {
|
|
if (item.url) {
|
|
uni.navigateTo({ url: item.url })
|
|
}
|
|
},
|
|
location() {
|
|
this.$u.route('/pages-biz/location/location')
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.index {
|
|
background: #F8F8F8;
|
|
min-height: 100vh;
|
|
position: relative;
|
|
}
|
|
|
|
.bg {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 960rpx;
|
|
z-index: 0;
|
|
}
|
|
|
|
.index-title {
|
|
position: absolute;
|
|
z-index: 2;
|
|
left: 30rpx;
|
|
font-family: Noto Sans S Chinese;
|
|
font-weight: 500;
|
|
font-size: 54rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.content-wrapper {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.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-left: 30rpx;
|
|
padding-right: 30rpx;
|
|
padding-bottom: 22rpx;
|
|
}
|
|
|
|
.navbox2 {
|
|
height: 170rpx;
|
|
padding-top: 2%;
|
|
background: #FFFFFF;
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
.nomore {
|
|
background-color: $u-bg-color;
|
|
}
|
|
|
|
.noticeStyle {
|
|
display: flex;
|
|
margin-top: 22rpx;
|
|
height: 86rpx;
|
|
background-color: #FFFFFF;
|
|
border-radius: 10rpx;
|
|
align-items: center;
|
|
}
|
|
|
|
.notice-content {
|
|
flex: 1;
|
|
}
|
|
|
|
.underline {
|
|
margin-top: 5rpx;
|
|
width: 130rpx;
|
|
height: 6rpx;
|
|
border-radius: 5rpx;
|
|
transition: all 0.25s ease;
|
|
}
|
|
|
|
.rowClass {
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.rowBgColor {
|
|
background-color: rgb(248, 248, 248);
|
|
}
|
|
|
|
.leftOffSetRow {
|
|
margin-left: 20%;
|
|
}
|
|
|
|
.hoverClass {
|
|
background-color: #E4E7ED;
|
|
}
|
|
|
|
.tabName {
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.u-close {
|
|
position: absolute;
|
|
top: 20rpx;
|
|
right: 20rpx;
|
|
}
|
|
|
|
.item-cover {
|
|
font-size: 55rpx;
|
|
color: $u-type-warning;
|
|
}
|
|
|
|
.item-tag {
|
|
font-size: 24rpx;
|
|
color: $u-tips-color;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.tab-content {
|
|
padding: 0 20rpx;
|
|
margin-top: 22rpx;
|
|
background: #fff;
|
|
}
|
|
|
|
.recommend-tabs {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
padding: 20rpx 0;
|
|
background: #fff;
|
|
font-size: 32rpx;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.tab-item {
|
|
margin-right: 40rpx;
|
|
padding: 10rpx 0;
|
|
color: #333;
|
|
}
|
|
|
|
.tab-item.active {
|
|
color: #258AE6;
|
|
border-bottom: 4rpx solid #258AE6;
|
|
}
|
|
|
|
.filter-tabs {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
padding: 0 0 20rpx 0;
|
|
background: #fff;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.filter-item {
|
|
margin-right: 20rpx;
|
|
margin-bottom: 10rpx;
|
|
padding: 12rpx 24rpx;
|
|
background: #f5f5f5;
|
|
border-radius: 20rpx;
|
|
font-size: 26rpx;
|
|
color: #666;
|
|
}
|
|
|
|
.filter-item.active {
|
|
background: #d4e2ef;
|
|
color: #0088FE;
|
|
}
|
|
|
|
.demo-warter {
|
|
margin-bottom: 20rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.u-waterfall {
|
|
padding: 0 20rpx;
|
|
}
|
|
|
|
.item-title {
|
|
font-size: 28rpx;
|
|
font-weight: 600;
|
|
margin-top: 14rpx;
|
|
padding: 0 10rpx;
|
|
color: #333;
|
|
line-height: 40rpx;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
|
|
.item-price {
|
|
font-size: 32rpx;
|
|
color: #0088FE;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
|
|
.item-price text {
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.item-desc {
|
|
font-weight: normal;
|
|
font-size: 24rpx;
|
|
color: #999;
|
|
}
|
|
|
|
.item-desc,
|
|
.item-price {
|
|
padding: 0 10rpx;
|
|
margin-top: 8rpx;
|
|
}
|
|
|
|
.auth-popup {
|
|
width: 600rpx;
|
|
padding: 48rpx 40rpx 40rpx;
|
|
background-color: #fff;
|
|
border-radius: 24rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.auth-title {
|
|
font-size: 34rpx;
|
|
font-weight: 600;
|
|
color: #1a1a1a;
|
|
text-align: center;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.auth-desc {
|
|
font-size: 26rpx;
|
|
color: #888;
|
|
text-align: center;
|
|
line-height: 1.6;
|
|
margin-bottom: 40rpx;
|
|
}
|
|
|
|
.auth-input {
|
|
margin-bottom: 48rpx;
|
|
|
|
::v-deep .u-input {
|
|
padding-bottom: 12rpx;
|
|
}
|
|
}
|
|
|
|
.auth-btn {
|
|
width: 100%;
|
|
height: 88rpx;
|
|
line-height: 88rpx;
|
|
background: linear-gradient(135deg, #0088FE, #79b5ff);
|
|
color: #fff;
|
|
font-size: 30rpx;
|
|
font-weight: 500;
|
|
border-radius: 44rpx;
|
|
border: none;
|
|
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;
|
|
position: fixed;
|
|
right: 30rpx;
|
|
bottom: 300rpx;
|
|
width: 60px;
|
|
height: 60px;
|
|
padding: 4px;
|
|
cursor: pointer;
|
|
background: #FFF;
|
|
text-align: center;
|
|
line-height: 60px;
|
|
border-radius: 100%;
|
|
-webkit-box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, 0.1), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.1);
|
|
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> |