lmm45037/wagoo-douy3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
初心
2026-03-27 10:15:51 +08:00
parent 230bb76f63
commit 2c00299634
19 changed files with 1001 additions and 1172 deletions
Download Patch File Download Diff File Expand all files Collapse all files

280
src/pages/client/home/index.vue
View File

@ -3,6 +3,9 @@
<!-- 微信复制弹窗 -->
<WeChatCopyModal ref="wechatCopyModal" />
<!-- 可拖动联系客服组件 -->
<DraggableContact ref="draggableContact" :onClick="handleContactClick" />
<scroll-view class="homeContainer" scroll-y :show-scrollbar="false" :enhanced="true">
<view class="swiperWrapper">
<swiper indicator-dots="true" autoplay="true" interval="3000" duration="500" circular="true"
@ -15,17 +18,18 @@
<view class="userInfoWrapper">
<view class="userInfo" @click="handleUserInfo">
<view class="userContent">
<image
:src=" userInfo.avatar ? userInfo.avatar : `${imgPrefix}home-head.png`"
class="userAvatar" mode="aspectFill" />
<view class="user-info-wrapper">
<view class="userName">
{{ userInfo.username ? userInfo.username : "嗨，你好呀" }}
</view>
<view class="userTips" v-if="!userInfo.userID">
登陆享受更多精彩内容
</view>
<view v-else class="user-membership-row">
<view class="vipWrapper">
<image class="lableImg" :src="`${imgPrefix}home-vipLabel.png`" />
v{{ userInfo.vipLevel ? userInfo.vipLevel : 0 }}会员
</view>
<!-- <view v-else class="user-membership-row">
<view
v-if="userInfo.membershipTier && userInfo.membershipTier > 0"
class="membership-tier-badge"
@ -37,98 +41,38 @@
>
<text class="membership-tier-text">{{ getMembershipTierText(userInfo.membershipTier) }}</text>
</view>
</view>
</view> -->
</view>
</view>
</view>
<view class="loginBtn" @click="toLogin" v-if="!userInfo.userID">
注册/登陆
</view>
<view class="loginBtn flexClass" v-else @click="toCouponList">
<view class="couponText">{{ userInfo.couponCount ? userInfo.couponCount : 0 }}张优惠券</view>
<image :src="`${imgPrefix}home-rightWhite Arrow.png`" class="discountCoupon" />
</view>
</view>
<view class="shadowBackground" />
</view>
<view class="menuBody">
<view class="firstMenu">
<view class="itemWrapper" @click="toReservation">
<text class="titlWrapper" style="transform: translateY(-4rpx);">你们在哪我们去哪</text>
<view class="content">预约洗护</view>
<view class="tips">随时随地上车洗澡</view>
<view class="itemImg">
<image class="menu-img-lg" :src="`${imgPrefix}home-menuBath.png`" mode="aspectFill" />
</view>
<view class="recommand-goods-wrapper">
<!-- <view class="fs-36 app-font-bold app-fc-main recommand-title">
推荐商品
</view> -->
<view class="goods-list">
<view class="goods-list-item left">
<good-item v-for="(good, i) in leftColumnGoods" :index="2 * i" :key="2 * i" :data="good"
@addToCar="addToCar" />
</view>
<view class="line" />
<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}h-public.png`" mode="aspectFill" />
</view>
<view class="goods-list-item">
<good-item v-for="(good, i) in rightColumnGoods" :index="2 * i + 1" :key="2 * i + 1"
:data="good" @addToCar="addToCar" />
</view>
</view>
<view class="secondMenu">
<scroll-view class="scrollWrapper" :scroll-x="secondMenuItemList.length > 4" enable-flex
:scroll-with-animation="false"
@scroll="onSecondMenuScroll">
<view class="secondMenuInner" :class="{ 'no-scroll': secondMenuItemList.length <= 4 }">
<view class="itemWrapper" v-for="(item, i) in secondMenuItemList" :key="i"
@click="handleNav(item)">
<view class="imgWrapper">
<image class="second-icon" :src="item.img" mode="aspectFill" />
</view>
<view class="itemTitle">
{{ item.title }}
</view>
<view class="itemTips">
{{ item.tips }}
</view>
</view>
</view>
</scroll-view>
<view class="custom-indicator" v-if="secondMenuItemList.length > 4">
<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="toDogTraining">
<view>
<view class="title">上门服务</view>
<view class="tips">邀请好友得好礼</view>
</view>
<image class="third-icon" :src="`${imgPrefix}h-door.png`" mode="aspectFill" />
</view>
<view class="itemWrapper" @click="toJoin">
<view>
<view class="title">加盟咨询</view>
<view class="tips">立即加盟咨询</view>
</view>
<image class="third-icon" :src="`${imgPrefix}home-joinIn.png`" mode="aspectFill" />
</view>
</view>
<view class="serviceMenu" @click="jumpToWeChat">
<view class="left">
<image class="service-icon" :src="`${imgPrefix}supportStaff.png`" mode="aspectFill" />
<view class="content">
<view class="title">在线客服</view>
<view class="tips">遇到什么问题您尽管说哦～</view>
</view>
</view>
<view>
<image :src="`${imgPrefix}right-arrow.png`" class="rightArrow" />
</view>
<view v-if="isLoadingGoods" class="loading-wrapper flex-center">
<uni-load-more status="loading" :show-text="false" />
</view>
</view>
</scroll-view>
</view>
</template>
@ -142,25 +86,39 @@ import {
userWllet
} from "../../../api/login";
import WeChatCopyModal from "@/components/WeChatCopyModal.vue";
import GoodItem from "../shop/components/GoodItem.vue";
import DraggableContact from "@/components/DraggableContact.vue";
import {
getGoodsClassify,
getGoodsListData
} from "@/api/shop";
export default {
name: "HomePage",
components: {
WeChatCopyModal
GoodItem,
WeChatCopyModal,
DraggableContact
},
data() {
return {
imgPrefix,
couponCount: 1,
swiperDataList: [
{
image: `${imgPrefix}banner1.png`
},
{
image: `${imgPrefix}bannerShare.png`
}
],
secondMenuItemList: [{
data() {
return {
imgPrefix,
couponCount: 1,
goodsList: [], // 商品列表
goodsTotal: 0, // 商品总数
goodPage: 1, // 当前页码
isLoadingGoods: false, // 是否正在加载商品
refreshTriggered: false, // 刷新是否已触发
cartCount: 0, // 购物车数量
swiperDataList: [
{
image: `${imgPrefix}banner1.png`
},
{
image: `${imgPrefix}bannerShare.png`
}
],
secondMenuItemList: [{
title: "邀请有礼",
tips: "邀请好友得好礼",
img: `${imgPrefix}home-invite .png`,
@ -202,13 +160,39 @@ export default {
},
userInfo() {
return this.$store.state?.user?.userInfo || {};
}
},
leftColumnGoods() {
return this.goodsList.filter((v, i) => i % 2 === 0);
},
rightColumnGoods() {
return this.goodsList.filter((v, i) => i % 2 === 1);
},
cartShowCount() {
return this.cartCount > 9 ? "9+" : this.cartCount;
}
},
created() {
this.buyService()
this.getGoodsList()
},
methods: {
getGoodsList() {
if (this.isLoadingGoods) return;
this.isLoadingGoods = true;
const params = {
type: 0
}
getGoodsListData(params)
.then((res) => {
const list = res?.data || [];
this.goodsList =
this.goodPage === 1 ? list : [...this.goodsList, ...list];
this.goodsTotal = res?.count || 0;
})
.finally(() => {
this.isLoadingGoods = false;
this.refreshTriggered = false;
});
},
toLogin() {
uni.navigateTo({
url: "/pages/client/auth/index",
@ -258,24 +242,6 @@ export default {
// url: '/pageHome/service/index'
// });
},
// 我的钱包
buyService() {
const value = JSON.parse(uni.getStorageSync('vuex'));
console.log(value, '??')
this.userId = value.user.userInfo.userID
this.nick_name = value.user.userInfo.username
// this.yaoqing_code = value.user.userInfo.yaoqing_code
// console.log(value,'--')
userWllet(value.user.userInfo.userID).then((res) => {
uni.setStorage({ //存入Storage
key: 'userInfo',
data: { //存的数据（可以是多条）
'user_id': res.data.user_id,
'wallet_id': res.data.id
}
})
});
},
onSecondMenuScroll(e) {
const scrollLeft = e.detail.scrollLeft || 0;
const sysInfo = uni.getSystemInfoSync();
@ -352,6 +318,30 @@ export default {
});
},
// 立即购买
addToCar(goodsData) {
console.log(goodsData,'--=')
uni.navigateTo({
url: `/pages/client/order/create`,
success: (res) => {
// 通过eventChannel向被打开页面传送数据
res.eventChannel.emit("createOrder", {
goodList: [{
...this.goodsData,
goods_id:goodsData.product_id,
price_id:goodsData.prices[0].price_id,
number:1,
goods_name: goodsData.product_name,
price_name: goodsData?.product_name,
goods_price: goodsData.prices[0].actual_price,
product_pic:goodsData.product_pic
}, ],
});
},
});
},
// 跳转微信客服 - 使用自定义弹窗
jumpToWeChat() {
if (this.$refs.wechatCopyModal) {
@ -361,6 +351,16 @@ export default {
});
}
},
// 可拖动联系客服组件点击回调
handleContactClick() {
if (this.$refs.wechatCopyModal) {
this.$refs.wechatCopyModal.show({
title: '请添加客服号',
weChatCode: 'Wagoo2025'
});
}
},
},
};
</script>
@ -371,6 +371,33 @@ export default {
background-color: #ffecf3;
}
.recommand-goods-wrapper {
.recommand-title {
margin-bottom: 10rpx;
}
.goods-list {
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: flex-start;
margin-top: 16rpx;
.goods-list-item {
flex: 1;
min-width: 0;
&.left {
margin-right: 20rpx;
}
}
}
.loading-wrapper {
padding: 10rpx 0;
}
}
.homeContainer {
height: calc(100vh - #{$app_tabbar_height + 36});
background-color: #ffecf3;
@ -431,7 +458,22 @@ export default {
align-items: center;
.userContent {
margin-left: 16rpx;
display: flex;
align-items: center;
gap: 16rpx;
.userAvatar {
width: 92rpx;
height: 92rpx;
border-radius: 50%;
flex-shrink: 0;
}
.user-info-wrapper {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.userName {
font-weight: 500;