1
This commit is contained in:
@ -62,21 +62,21 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="line" />
|
||||
<view class="itemWrapper" @click="toDogTraining">
|
||||
<text class="titlWrapper">狗狗训练</text>
|
||||
<view class="content">上门服务</view>
|
||||
<view class="tips">上门训犬、寄养、喂猫、遛狗</view>
|
||||
<view class="itemWrapper" @click="toPublicBenefit">
|
||||
<text class="titlWrapper">关爱宠物,传递温情</text>
|
||||
<view class="content">公益助力</view>
|
||||
<view class="tips">帮我找个家</view>
|
||||
<view class="itemImg">
|
||||
<image class="menu-img-sm" :src="`${imgPrefix}home-dogTraining.png`" mode="aspectFill" />
|
||||
<image class="menu-img-sm" :src="`${imgPrefix}h-public.png`" mode="aspectFill" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="secondMenu">
|
||||
<scroll-view class="scrollWrapper" :scroll-x="secondMenuItemList.length > 4" enable-flex
|
||||
<scroll-view class="scrollWrapper" scroll-x enable-flex
|
||||
:scroll-with-animation="false"
|
||||
@scroll="onSecondMenuScroll">
|
||||
<view class="secondMenuInner" :class="{ 'no-scroll': secondMenuItemList.length <= 4 }">
|
||||
<view class="secondMenuInner">
|
||||
<view class="itemWrapper" v-for="(item, i) in secondMenuItemList" :key="i"
|
||||
@click="handleNav(item)">
|
||||
<view class="imgWrapper">
|
||||
@ -92,19 +92,19 @@
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="custom-indicator" v-if="secondMenuItemList.length > 4">
|
||||
<view class="custom-indicator">
|
||||
<view class="itemLine" :class="{ active: secondMenuIndicatorIndex === 0 }"></view>
|
||||
<view class="itemLine" :class="{ active: secondMenuIndicatorIndex === 1 }"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="thirdMenu">
|
||||
<view class="itemWrapper" @click="toPublicBenefit">
|
||||
<view class="itemWrapper" @click="toDogTraining">
|
||||
<view>
|
||||
<view class="title">公益助力</view>
|
||||
<view class="tips">帮我找个家</view>
|
||||
<view class="title">上门服务</view>
|
||||
<view class="tips">训犬寄养、喂猫遛狗</view>
|
||||
</view>
|
||||
<image class="third-icon" :src="`${imgPrefix}home-publicBenefit.png`" mode="aspectFill" />
|
||||
<image class="third-icon1" :src="`${imgPrefix}h-door.png`" mode="aspectFill" />
|
||||
</view>
|
||||
<view class="itemWrapper" @click="toJoin">
|
||||
<view>
|
||||
@ -188,6 +188,11 @@ export default {
|
||||
img: `${imgPrefix}home-openVip.png`,
|
||||
naviUrl: "/pages/richText/member-interests"
|
||||
},
|
||||
{
|
||||
title: "健康顾问",
|
||||
tips: "宠物健康智能助手",
|
||||
img: `${imgPrefix}healthConsultant.png`,
|
||||
},
|
||||
],
|
||||
walletInfo: {}, // 钱包信息
|
||||
secondMenuIndicatorIndex: 0, // 第二排菜单指示器当前页 0=第一页 1=第二页
|
||||
@ -245,9 +250,14 @@ export default {
|
||||
});
|
||||
},
|
||||
toDogTraining() {
|
||||
uni.navigateTo({
|
||||
url: '/pageHome/service/index'
|
||||
});
|
||||
uni.showToast({
|
||||
title: '敬请期待',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
// uni.navigateTo({
|
||||
// url: '/pageHome/service/index'
|
||||
// });
|
||||
},
|
||||
// 我的钱包
|
||||
buyService() {
|
||||
@ -375,8 +385,13 @@ export default {
|
||||
}
|
||||
|
||||
.menu-img-sm {
|
||||
width: 120rpx;
|
||||
height: 164rpx;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
.third-icon1{
|
||||
width: 96rpx;
|
||||
height: 120rpx;
|
||||
|
||||
}
|
||||
|
||||
.second-icon,
|
||||
@ -601,13 +616,9 @@ export default {
|
||||
|
||||
.scrollWrapper {
|
||||
width: 100%;
|
||||
height: auto; /* 由内容撑开;小程序 scroll-view 横向滚动时默认可能不随内容计算高度 */
|
||||
min-height: 220rpx; /* 兜底:约等于 padding-top + 图标 + 标题 + 副标题 */
|
||||
display: flex;
|
||||
align-items: flex-start; /* 不拉伸子项,高度由内容决定 */
|
||||
white-space: nowrap;
|
||||
padding-top: 24rpx;
|
||||
padding-bottom: 24rpx;
|
||||
padding: 32rpx 0 20rpx 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.secondMenuInner {
|
||||
@ -615,16 +626,6 @@ export default {
|
||||
flex-wrap: nowrap;
|
||||
flex-shrink: 0;
|
||||
width: 937.5rpx; /* 5 * 187.5 一屏4个共5项 */
|
||||
|
||||
&.no-scroll {
|
||||
width: 100%; /* 四项时一屏排满,不滚动 */
|
||||
|
||||
.itemWrapper {
|
||||
flex: 1;
|
||||
width: 0; /* 均分宽度,避免被 menuBody padding 裁切 */
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.itemWrapper {
|
||||
@ -653,7 +654,7 @@ export default {
|
||||
|
||||
.custom-indicator {
|
||||
display: flex;
|
||||
margin-top: 12rpx;
|
||||
margin-top:-150rpx;
|
||||
justify-content: center;
|
||||
margin-bottom: 20rpx;
|
||||
gap: 12rpx;
|
||||
|
||||
Reference in New Issue
Block a user