feat: 优化我的页面功能 1. 修复未登录状态文本显示 2. 优化头像上传功能 3. 添加门店ID复制功能
This commit is contained in:
davy
parent
b70b87cdb6
commit
c4c140bd07
@ -190,7 +190,8 @@
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "活动详情",
|
||||
"navigationStyle": "custom"
|
||||
"navigationBarBackgroundColor": "#FFFFFF",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<view class="page">
|
||||
<view class="page-content flex-col">
|
||||
<!-- 筛选导航 -->
|
||||
<view class="filter-tabs">
|
||||
<view class="tabs-content">
|
||||
@ -24,13 +23,14 @@
|
||||
<!-- 列表内容区域 -->
|
||||
<view class="list-container">
|
||||
<scroll-view
|
||||
style="height: 100%;"
|
||||
scroll-y="true"
|
||||
@scrolltolower="changePage"
|
||||
refresher-enabled="true"
|
||||
:refresher-triggered="isRefreshing"
|
||||
@refresherrefresh="onRefresh"
|
||||
class="scroll-view"
|
||||
>
|
||||
<view class="activity-wrapper">
|
||||
<activity-item
|
||||
v-for="(item, index) in activeList"
|
||||
:key="index"
|
||||
@ -38,14 +38,15 @@
|
||||
@click="toDetail"
|
||||
@review="toReview"
|
||||
/>
|
||||
</view>
|
||||
<view class="cu-load" :class="loading?'loading': activeList.length == total ? 'over' :'more'"></view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<!-- 弹窗组件 -->
|
||||
<login-popup ref="loginRef"></login-popup>
|
||||
<!-- 品牌筛选组件 -->
|
||||
<brand-filter ref="brandFilterRef" @confirm="onBrandFilterConfirm"></brand-filter>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -118,11 +119,19 @@
|
||||
|
||||
console.log('最终显示的数据：', arr);
|
||||
|
||||
// 过滤掉招募剩余天数为负数的活动
|
||||
const filteredRows = arr.filter(item => {
|
||||
if (item.activityStatus === 1) { // 招募中状态
|
||||
return item.remainingDays >= 0
|
||||
}
|
||||
return true
|
||||
});
|
||||
|
||||
// 更新显示列表
|
||||
if (this.queryForm.pageNum === 1) {
|
||||
this.activeList = arr;
|
||||
this.activeList = filteredRows;
|
||||
} else {
|
||||
this.activeList = [...this.activeList, ...arr];
|
||||
this.activeList = [...this.activeList, ...filteredRows];
|
||||
}
|
||||
} else {
|
||||
if (this.queryForm.pageNum === 1) {
|
||||
@ -226,26 +235,25 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #F9F9F9;
|
||||
}
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.filter-tabs {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
.filter-tabs {
|
||||
background: #FFFFFF;
|
||||
// border-bottom: 1rpx solid #F5F5F5
|
||||
padding: 0;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 99;
|
||||
|
||||
.tabs-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 32rpx;
|
||||
height: 112rpx;
|
||||
width: 100%;
|
||||
padding: 20rpx 24rpx;
|
||||
height: 88rpx;
|
||||
|
||||
.tab-item {
|
||||
width: 144rpx;
|
||||
@ -259,7 +267,6 @@
|
||||
text-align: center;
|
||||
|
||||
&.active-tag {
|
||||
// 选中状态的样式
|
||||
color: #FFF;
|
||||
background: #D42E78;
|
||||
}
|
||||
@ -271,18 +278,17 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 64rpx;
|
||||
min-width: 144rpx; // 最小宽度
|
||||
padding: 0 24rpx; // 左右内边距
|
||||
min-width: 144rpx;
|
||||
padding: 0 24rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #FFFFFF;
|
||||
border: 1rpx solid #D42E78;
|
||||
transition: all 0.3s; // 添加过渡效果
|
||||
|
||||
text {
|
||||
color: #D42E78;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
margin-right: 8rpx; // 文字和图标的间距
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
.filter-icon {
|
||||
@ -290,7 +296,6 @@
|
||||
height: 32rpx;
|
||||
}
|
||||
|
||||
// 激活状态
|
||||
&.active {
|
||||
background: #D42E78;
|
||||
border-color: #D42E78;
|
||||
@ -300,15 +305,43 @@
|
||||
}
|
||||
|
||||
.filter-icon {
|
||||
filter: brightness(0) invert(1); // 将图标改为白色
|
||||
filter: brightness(0) invert(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-container {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.scroll-view {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.list-container {
|
||||
margin-top: 104rpx; // 筛选栏高度
|
||||
padding: 24rpx 32rpx;
|
||||
.activity-wrapper {
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.cu-load {
|
||||
text-align: center;
|
||||
padding: 24rpx;
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
|
||||
&.loading::after {
|
||||
content: "加载中...";
|
||||
}
|
||||
|
||||
&.over::after {
|
||||
content: "没有更多了";
|
||||
}
|
||||
|
||||
&.more::after {
|
||||
content: "上拉加载更多";
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -8,8 +8,13 @@
|
||||
</view>
|
||||
<view class="flex-direction flex">
|
||||
<text class="text-bold text-xxl margin-bottom">{{ barInfo.nickName || barInfo.barContactPhone }}</text>
|
||||
<text class="text-sm margin-bottom-sm" style="color:#A0A5BA">店铺名称：{{ barInfo.barName || '-'}}</text>
|
||||
<text class="text-sm" style="color:#A0A5BA">店铺ID：{{ barInfo.barNumber || '-' }}</text>
|
||||
<text class="text-sm margin-bottom-sm" style="color:#A0A5BA">门店名称：{{ barInfo.barName || '-'}}</text>
|
||||
<view class="flex align-center">
|
||||
<text class="text-sm" style="color:#A0A5BA">门店ID：{{ barInfo.barNumber || '-' }}</text>
|
||||
<view class="copy-btn" @click.stop="copyBarNumber">
|
||||
<text class="cuIcon-copy"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="user-box flex align-center justify-start" :style="{'padding-top': statusBaeHeight + 60 + 'px'}" @click="handleUserBoxClick">
|
||||
@ -83,7 +88,7 @@
|
||||
<view class="flex justify-between align-center margin-bottom" @click="toPage(5)">
|
||||
<view class="flex align-center">
|
||||
<image src="@/static/wenhao.png" class="icon"></image>
|
||||
<text class="text-lg">添加枝点小助手</text>
|
||||
<text class="text-lg">添加啤啤猩球小助手</text>
|
||||
</view>
|
||||
<text class="cuIcon-right"></text>
|
||||
</view>
|
||||
@ -143,6 +148,10 @@
|
||||
if (!this.barInfo || this.barInfo.authState === 0) return 'unverified' // 未认证
|
||||
if (this.barInfo.authState === 1) return 'verifying' // 认证中
|
||||
return 'verified' // 认证通过
|
||||
},
|
||||
maskedPhone() {
|
||||
if (!this.barInfo.barContactPhone) return '';
|
||||
return this.barInfo.barContactPhone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
@ -412,6 +421,120 @@
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/registration'
|
||||
})
|
||||
},
|
||||
// 显示修改头像提示
|
||||
showChangeAvatar() {
|
||||
uni.showActionSheet({
|
||||
itemList: ['修改头像'],
|
||||
success: () => {
|
||||
this.toSetting();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 跳转到设置页面
|
||||
toSetting() {
|
||||
uni.navigateTo({
|
||||
url: '/pagesMy/setting'
|
||||
});
|
||||
},
|
||||
|
||||
// 获取用户信息
|
||||
getUserInfo() {
|
||||
const barInfo = uni.getStorageSync('barInfo');
|
||||
const token = uni.getStorageSync('token');
|
||||
this.isLoggedIn = !!token;
|
||||
if (barInfo) {
|
||||
this.barInfo = barInfo;
|
||||
// 如果没有昵称，设置默认昵称
|
||||
if (!this.barInfo.nickName) {
|
||||
this.barInfo.nickName = this.barInfo.barName + '01';
|
||||
}
|
||||
}
|
||||
},
|
||||
// 复制门店ID
|
||||
copyBarNumber() {
|
||||
if (!this.barInfo || !this.barInfo.barNumber) {
|
||||
uni.showToast({
|
||||
title: '暂无门店ID',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.setClipboardData({
|
||||
data: this.barInfo.barNumber,
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: '复制成功',
|
||||
icon: 'success'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
// 选择头像
|
||||
async onChooseAvatar() {
|
||||
try {
|
||||
// 调用微信选择头像接口
|
||||
const res = await uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['compressed'],
|
||||
sourceType: ['album', 'camera']
|
||||
})
|
||||
|
||||
if (res.tempFilePaths && res.tempFilePaths.length > 0) {
|
||||
uni.showLoading({
|
||||
title: '上传中...'
|
||||
})
|
||||
|
||||
// 上传头像
|
||||
const uploadRes = await uni.uploadFile({
|
||||
url: '/bar/barinfo', // 使用编辑酒吧信息接口
|
||||
filePath: res.tempFilePaths[0],
|
||||
name: 'barLogo', // 修改为正确的参数名
|
||||
header: {
|
||||
'Authorization': uni.getStorageSync('token')
|
||||
},
|
||||
formData: {
|
||||
// 添加其他必要的参数
|
||||
barNumber: this.barInfo.barNumber
|
||||
}
|
||||
})
|
||||
|
||||
// 解析响应数据
|
||||
let result
|
||||
try {
|
||||
result = JSON.parse(uploadRes.data)
|
||||
} catch (e) {
|
||||
result = uploadRes.data
|
||||
}
|
||||
|
||||
if (result.code === 200 && result.data) {
|
||||
// 更新本地存储的门店信息
|
||||
const barInfo = uni.getStorageSync('barInfo')
|
||||
barInfo.barLogo = result.data
|
||||
uni.setStorageSync('barInfo', barInfo)
|
||||
|
||||
// 更新页面显示
|
||||
this.barInfo = barInfo
|
||||
|
||||
uni.showToast({
|
||||
title: '更新成功',
|
||||
icon: 'success'
|
||||
})
|
||||
} else {
|
||||
throw new Error(result.msg || '上传失败')
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('选择头像失败:', error)
|
||||
uni.showToast({
|
||||
title: error.message || '选择头像失败',
|
||||
icon: 'none'
|
||||
})
|
||||
} finally {
|
||||
uni.hideLoading()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -514,4 +637,20 @@
|
||||
border-radius: 30rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.copy-btn {
|
||||
margin-left: 16rpx;
|
||||
padding: 4rpx 12rpx;
|
||||
background: #F5F5F5;
|
||||
border-radius: 8rpx;
|
||||
|
||||
.cuIcon-copy {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -549,16 +549,16 @@
|
||||
// 设置查询状态
|
||||
switch(key) {
|
||||
case 0: // 累计中
|
||||
this.queryForm.status = 'ACCUMULATING'
|
||||
this.queryForm.status = 1 // 使用整数类型
|
||||
break
|
||||
case 1: // 待兑付
|
||||
this.queryForm.status = 'PENDING_PAYMENT'
|
||||
this.queryForm.status = 2 // 使用整数类型
|
||||
break
|
||||
case 2: // 已兑付
|
||||
this.queryForm.status = 'PAID'
|
||||
this.queryForm.status = 3 // 使用整数类型
|
||||
break
|
||||
case 3: // 已完成
|
||||
this.queryForm.status = 'COMPLETED'
|
||||
this.queryForm.status = 4 // 使用整数类型
|
||||
break
|
||||
default:
|
||||
delete this.queryForm.status
|
||||
|
||||
@ -488,17 +488,38 @@
|
||||
}
|
||||
favorBeer(data).then(res => {
|
||||
if (status == 1) {
|
||||
this.isFavor = true
|
||||
uni.showToast({
|
||||
title: '收藏成功',
|
||||
icon: 'success'
|
||||
})
|
||||
} else {
|
||||
this.isFavor = false
|
||||
uni.showToast({
|
||||
title: '取消收藏',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
this.getBeerFavorStatusFun()
|
||||
}).catch(err => {
|
||||
if (err.code === 500 && err.msg.includes('门店未认证')) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请先认证门店',
|
||||
showCancel: true,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/registration'
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: err.msg || '操作失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点赞
|
||||
|
||||
@ -1,51 +1,58 @@
|
||||
<template>
|
||||
<view class="page-content">
|
||||
<!-- 自定义导航栏 -->
|
||||
<view class="custom-nav" :style="{ paddingTop: statusBaeHeight + 'px' }">
|
||||
<view class="nav-content">
|
||||
<view class="back-btn" @click="goBack">
|
||||
<text class="cuIcon-back"></text>
|
||||
<!-- 登录组件 -->
|
||||
<login-popup ref="loginPopup" @success="onLoginSuccess"></login-popup>
|
||||
<!-- 2. 进度展示区域 -->
|
||||
<view class="bg-white progress-box" style="border-radius: 0 0 12rpx 12rpx;">
|
||||
<!-- 标题文字 -->
|
||||
<view class="title-text section-title">活动招募即将结束</view>
|
||||
|
||||
<!-- 倒计时区域 -->
|
||||
<view class="countdown-container">
|
||||
<view class="countdown-item">
|
||||
<text class="number">{{activityInfo.remainingDays || '0'}}</text>
|
||||
<text class="unit">天</text>
|
||||
</view>
|
||||
<view class="countdown-item">
|
||||
<text class="number">{{countdownTime.hours || '00'}}</text>
|
||||
<text class="unit">时</text>
|
||||
</view>
|
||||
<view class="countdown-item">
|
||||
<text class="number">{{countdownTime.minutes || '00'}}</text>
|
||||
<text class="unit">分</text>
|
||||
</view>
|
||||
<view class="countdown-item">
|
||||
<text class="number">{{countdownTime.seconds || '00'}}</text>
|
||||
<text class="unit">秒</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bg-white progress-box margin-bottom-sm" style="height: 600rpx;border-radius: 0 0 36rpx 36rpx;"
|
||||
:style="{'margin-top': statusBaeHeight + 88 + 'px'}">
|
||||
<process v-if="activityInfo.stage == 1" :value="processNum" progress_width="360" bg_color="#E3E3E5" border_width="6" progress_height="350"
|
||||
start_color="#FEE034" end_color="#71F4B4" :total="activityInfo.duration"></process>
|
||||
<process v-else :value="0" progress_width="360" bg_color="#E3E3E5" border_width="6" progress_height="350"
|
||||
start_color="#FEE034" end_color="#71F4B4" :total="activityInfo.duration"></process>
|
||||
<view v-if="activityInfo.stage == 1" class="progress-text">
|
||||
<view class="margin-bottom-sm">活动招募还剩</view>
|
||||
<view class="text-red margin-bottom-lg">
|
||||
<text class="text-sl text-bold">{{ activityInfo.remainingDays}}</text>天
|
||||
<!-- 进度条区域 -->
|
||||
<view class="progress-bar">
|
||||
<view class="progress-track">
|
||||
<view class="progress-fill" :style="{ width: processNum + '%' }"></view>
|
||||
</view>
|
||||
<view>招募截止 {{ activityInfo.endDate }}</view>
|
||||
</view>
|
||||
<view v-if="activityInfo.stage == 0" class="progress-text">
|
||||
|
||||
<view class="margin-bottom-sm">活动未开始</view>
|
||||
</view>
|
||||
<view v-if="activityInfo.stage == 2 || activityInfo.stage == 3" class="progress-text">
|
||||
<view class="margin-bottom-sm">活动已结束</view>
|
||||
</view>
|
||||
<view v-if="activityInfo.stage == 4" class="progress-text">
|
||||
<view class="margin-bottom-sm">活动停止</view>
|
||||
<view class="progress-labels">
|
||||
<text class="start">0天</text>
|
||||
<text class="end">{{activityInfo.duration}}天</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bg-white padding margin-bottom-sm" style="border-radius:36rpx;">
|
||||
<view v-if="activityInfo.beers" class="flex justify-between align-center margin-bottom" @click="toBrand">
|
||||
<image :src="activityInfo.beers[0].breweryLogo" class="margin-right"
|
||||
style="width: 72rpx;height: 72rpx;border-radius: 30rpx;"></image>
|
||||
<view class="flex-1">
|
||||
<view style="color:#979797">活动发起方</view>
|
||||
<view class="word-all margin-bottom-sm" style="color:#1E2019">{{ activityInfo.beers[0].brandName}}</view>
|
||||
</view>
|
||||
<!-- 3. 活动信息区域 -->
|
||||
<view class="bg-white padding margin-bottom-sm activity-info-box" style="border-radius:12rpx;margin-top: 24rpx;">
|
||||
<view v-if="activityInfo.beers" class="brand-info" @click="toBrand">
|
||||
<image :src="activityInfo.beers[0].breweryLogo" class="brand-logo"></image>
|
||||
<view class="brand-text">
|
||||
<view class="initiator">活动发起方</view>
|
||||
<view class="section-title">{{ activityInfo.beers[0].brandName}}</view>
|
||||
</view>
|
||||
<view class="cuIcon-right"></view>
|
||||
</view>
|
||||
<template v-if="currentTab == 1">
|
||||
<view class="margin-bottom-xs" style="color:#0B0E26">首次扫码开始累计 <text style="color: #DE3C4B;">{{activityInfo.duration || '-'}} 天内</text></view>
|
||||
<view class="margin-bottom-xs" style="color:#0B0E26">以下酒款累计扫码 ≥ {{activityInfo.activityTarget || '-'}} 桶 </view>
|
||||
<view class="activity-duration">首次扫码开始累计 <text class="duration-value">{{activityInfo.activityDuration || '-'}} 天内</text></view>
|
||||
<view class="activity-target">
|
||||
{{ activityInfo.beer_scope === 0 ? '全系列酒款' : '以下酒款' }}累计扫码 ≥ {{activityInfo.activityTarget || '-'}} 桶
|
||||
</view>
|
||||
</template>
|
||||
<scroll-view v-if="currentTab == 1" scroll-x="true" class="scroll-container">
|
||||
<view v-for="(it, index) in activityInfo.beers" :key="index" style="display: inline-block;" class="row-box" @click="toReview(it)">
|
||||
@ -66,10 +73,10 @@
|
||||
</view>
|
||||
<!-- 1 商品 2 啤酒币 -->
|
||||
<view v-if="activityInfo.activityRewardType == 1 || currentTab == 1" class="bg-white padding margin-bottom-sm"
|
||||
style="border-radius:36rpx;">
|
||||
<view class="margin-bottom-sm">挑战奖励</view>
|
||||
style="border-radius:12rpx;">
|
||||
<view class="section-title margin-bottom-sm">挑战奖励</view>
|
||||
<view v-if="activityInfo.activityRewardGoods" class="flex align-center">
|
||||
<image :src="activityInfo.activityRewardGoods.goodsCover" style="width: 144rpx;height: 204rpx;margin-right:20rpx;"></image>
|
||||
<image :src="activityInfo.activityRewardGoods.goodsCover" style="width: 144rpx;height: 204rpx;margin-right:16rpx;border-radius: 12rpx;"></image>
|
||||
<view class="flex-1">
|
||||
<view class="flex flex-1 align-center">
|
||||
<view class="flex-1">
|
||||
@ -84,7 +91,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="activityInfo.activityRewardType == 2" class="bg-white padding margin-bottom-sm"
|
||||
style="border-radius:36rpx;">
|
||||
style="border-radius:12rpx;">
|
||||
<view class="margin-bottom-sm">奖励</view>
|
||||
<view class="flex align-center">
|
||||
<!-- <image src="@/static/img/icon-logo.png" class="margin-right"
|
||||
@ -97,26 +104,12 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view style="height: 200rpx;background-color: transparent;"></view> -->
|
||||
<view class="bg-white flex justify-center align-start padding-top"
|
||||
style="border-radius:36rpx 36rpx 0 0;height: 182rpx;width: 100%;position: fixed;bottom:0;gap:50rpx">
|
||||
<!-- 活动未开始 -->
|
||||
<template v-if="true">
|
||||
<view class="bg-zd2 padding text-center" style="border-radius: 30rpx;width: 434rpx;font-size: 36rpx;" @click="handleScan">
|
||||
<!-- 5. 底部操作栏 -->
|
||||
<view class="bg-white flex justify-center align-start padding-top bottom-bar">
|
||||
<view class="scan-btn" :class="{'btn-disabled': !isLoggedIn || !isVerified}" @click="handleButtonClick">
|
||||
<text class="cuIcon-qr_code margin-right-xs"></text>
|
||||
扫桶标自动开始累计
|
||||
</view>
|
||||
</template>
|
||||
<!-- <template v-if="false">
|
||||
<view class="flex flex-col justify-center align-start">
|
||||
<text style="color: #909090;font-size: 28rpx;">活动状态</text>
|
||||
<text style="color: #FFD52B;font-size: 36rpx;">累计中</text>
|
||||
</view>
|
||||
<view class="bg-zd2 padding text-center" style="border-radius: 30rpx;width: 434rpx;font-size: 36rpx;">
|
||||
<text class="cuIcon-qr_code margin-right-xs"></text>
|
||||
扫码累计
|
||||
</view>
|
||||
</template> -->
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@ -126,42 +119,136 @@
|
||||
getActivityInfo
|
||||
} from '@/api/bar.js'
|
||||
import process from './components/progress.vue';
|
||||
import loginPopup from '@/components/loginPopup.vue';
|
||||
export default {
|
||||
components: {
|
||||
process
|
||||
process,
|
||||
loginPopup
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
statusBaeHeight: 40,
|
||||
id: '',
|
||||
activityInfo: {},
|
||||
currentTab: 1,
|
||||
countdownTime: {
|
||||
hours: '00',
|
||||
minutes: '00',
|
||||
seconds: '00'
|
||||
},
|
||||
timer: null,
|
||||
isLoggedIn: false,
|
||||
isVerified: false
|
||||
};
|
||||
},
|
||||
onLoad({
|
||||
id
|
||||
}) {
|
||||
this.statusBaeHeight = uni.getWindowInfo.statusBarHeight
|
||||
this.id = id
|
||||
this.init()
|
||||
this.id = id;
|
||||
this.init();
|
||||
this.checkLoginStatus();
|
||||
},
|
||||
computed: {
|
||||
processNum() {
|
||||
if(this.activityInfo.duration) {
|
||||
return (this.activityInfo.duration - this.activityInfo.remainingDays) / this.activityInfo.duration * 100
|
||||
}else {
|
||||
return 0
|
||||
}
|
||||
if(this.activityInfo.endDate) {
|
||||
const endDate = new Date(this.activityInfo.endDate);
|
||||
const startDate = new Date(this.activityInfo.startDate || new Date());
|
||||
const currentDate = new Date();
|
||||
|
||||
// 计算总天数
|
||||
const totalDays = Math.ceil((endDate - startDate) / (1000 * 3600 * 24));
|
||||
// 计算已经过去的天数
|
||||
const passedDays = Math.ceil((currentDate - startDate) / (1000 * 3600 * 24));
|
||||
|
||||
// 确保进度在0-100之间
|
||||
return Math.min(Math.max(Math.floor((passedDays / totalDays) * 100), 0), 100);
|
||||
}
|
||||
return 0;
|
||||
},
|
||||
targetText() {
|
||||
const { beer_scope, activityTarget, beers } = this.activityInfo;
|
||||
if (!activityTarget) return '-';
|
||||
return beer_scope === 0 ? '全系列酒款' : '以下酒款';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
getActivityInfo(this.id).then(res => {
|
||||
this.activityInfo = res.data
|
||||
this.activityInfo.remainingDays = this.getRemainingDays(res.data.endDate)
|
||||
console.log('活动详情数据：', res.data);
|
||||
this.activityInfo = res.data;
|
||||
|
||||
// 检查关键数据是否存在
|
||||
if (!this.activityInfo.activityDuration) {
|
||||
console.warn('缺少活动累计天数：activityDuration');
|
||||
}
|
||||
if (!this.activityInfo.activityTarget) {
|
||||
console.warn('缺少活动目标数量：activityTarget');
|
||||
}
|
||||
if (typeof this.activityInfo.beer_scope === 'undefined') {
|
||||
console.warn('缺少活动产品范围：beer_scope');
|
||||
}
|
||||
|
||||
// 计算剩余天数
|
||||
this.activityInfo.remainingDays = this.getRemainingDays(res.data.endDate);
|
||||
|
||||
// 计算活动总持续时间（用于进度条显示）
|
||||
if(res.data.endDate && res.data.startDate) {
|
||||
const endDate = new Date(res.data.endDate);
|
||||
const startDate = new Date(res.data.startDate);
|
||||
this.activityInfo.duration = Math.ceil((endDate - startDate) / (1000 * 3600 * 24));
|
||||
}
|
||||
|
||||
// 启动倒计时
|
||||
this.startCountdown();
|
||||
}).catch(err => {
|
||||
console.error('获取活动详情失败：', err);
|
||||
uni.showToast({
|
||||
title: '获取活动信息失败',
|
||||
icon: 'none'
|
||||
});
|
||||
})
|
||||
},
|
||||
startCountdown() {
|
||||
if(this.timer) {
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
|
||||
const updateCountdown = () => {
|
||||
if(!this.activityInfo.endDate) return;
|
||||
|
||||
const now = new Date().getTime();
|
||||
const end = new Date(this.activityInfo.endDate).getTime();
|
||||
const diff = end - now;
|
||||
|
||||
if(diff <= 0) {
|
||||
clearInterval(this.timer);
|
||||
this.countdownTime = {
|
||||
hours: '00',
|
||||
minutes: '00',
|
||||
seconds: '00'
|
||||
};
|
||||
return;
|
||||
}
|
||||
|
||||
// 更新剩余天数
|
||||
this.activityInfo.remainingDays = this.getRemainingDays(this.activityInfo.endDate);
|
||||
|
||||
// 计算时分秒
|
||||
const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||
const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
|
||||
const seconds = Math.floor((diff % (1000 * 60)) / 1000);
|
||||
|
||||
this.countdownTime = {
|
||||
hours: hours.toString().padStart(2, '0'),
|
||||
minutes: minutes.toString().padStart(2, '0'),
|
||||
seconds: seconds.toString().padStart(2, '0')
|
||||
};
|
||||
};
|
||||
|
||||
// 立即执行一次
|
||||
updateCountdown();
|
||||
// 每秒更新一次
|
||||
this.timer = setInterval(updateCountdown, 1000);
|
||||
},
|
||||
changeTab(index) {
|
||||
this.currentTab = index
|
||||
},
|
||||
@ -173,12 +260,13 @@
|
||||
},
|
||||
|
||||
// 计算剩余天数
|
||||
getRemainingDays(date) {
|
||||
const targetDate = new Date(date);
|
||||
getRemainingDays(endDate) {
|
||||
if(!endDate) return 0;
|
||||
const targetDate = new Date(endDate);
|
||||
const currentDate = new Date();
|
||||
const timeDiff = targetDate.getTime() - currentDate.getTime();
|
||||
const remainingDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
|
||||
return remainingDays;
|
||||
return Math.max(remainingDays, 0); // 确保不会显示负数天数
|
||||
},
|
||||
handleScan() {
|
||||
uni.getSetting({
|
||||
@ -247,7 +335,109 @@
|
||||
},
|
||||
goBack() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
checkLoginStatus() {
|
||||
const token = uni.getStorageSync('token');
|
||||
const barInfo = uni.getStorageSync('barInfo');
|
||||
|
||||
this.isLoggedIn = !!token;
|
||||
this.isVerified = barInfo && barInfo.authState === 2;
|
||||
},
|
||||
handleButtonClick() {
|
||||
const token = uni.getStorageSync('token');
|
||||
if (!token) {
|
||||
this.$refs.loginPopup.open();
|
||||
return;
|
||||
}
|
||||
|
||||
// 检查认证状态
|
||||
const barInfo = uni.getStorageSync('barInfo');
|
||||
if (!barInfo) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请先认证门店',
|
||||
showCancel: true,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/registration'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 处理不同的认证状态
|
||||
if (barInfo.authState === 0) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请先认证门店',
|
||||
showCancel: true,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/registration'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
return;
|
||||
} else if (barInfo.authState === 1) {
|
||||
uni.showToast({
|
||||
title: '您的门店正在认证中，请耐心等待',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 都通过后执行扫码
|
||||
this.handleScan();
|
||||
},
|
||||
onLoginSuccess() {
|
||||
// 登录成功后重新检查状态
|
||||
this.checkLoginStatus();
|
||||
|
||||
// 检查认证状态
|
||||
const barInfo = uni.getStorageSync('barInfo');
|
||||
if (!barInfo || barInfo.authState === 0) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请先认证门店',
|
||||
showCancel: true,
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/registration'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
return;
|
||||
} else if (barInfo.authState === 1) {
|
||||
uni.showToast({
|
||||
title: '您的门店正在认证中，请耐心等待',
|
||||
icon: 'none'
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果已认证，直接执行扫码
|
||||
if (this.isVerified) {
|
||||
this.handleScan();
|
||||
}
|
||||
}
|
||||
},
|
||||
onUnload() {
|
||||
// 页面卸载时清除定时器
|
||||
if(this.timer) {
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
// 每次页面显示时检查登录状态
|
||||
this.checkLoginStatus();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -255,137 +445,157 @@
|
||||
<style lang="scss" scoped>
|
||||
.page-content {
|
||||
min-height: 100vh;
|
||||
color: #F9F9F9;
|
||||
padding-bottom: 200rpx;
|
||||
|
||||
.custom-nav {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
background: transparent;
|
||||
|
||||
.nav-content {
|
||||
height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 32rpx;
|
||||
|
||||
.back-btn {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
border-radius: 50%;
|
||||
|
||||
.cuIcon-back {
|
||||
font-size: 36rpx;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.nav-title {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
margin-right: 60rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.progress-box {
|
||||
position: relative;
|
||||
margin-top: v-bind('statusBaeHeight + 44 + "px"');
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx;
|
||||
|
||||
.progress-text {
|
||||
position: absolute;
|
||||
top: 200rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
text-align: center;
|
||||
.title-text {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.tab-box {
|
||||
position: absolute;
|
||||
width: 674rpx;
|
||||
top: 475rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 30rpx;
|
||||
background: #F2F2F2;
|
||||
padding: 8rpx;
|
||||
.countdown-container {
|
||||
display: flex;
|
||||
gap: 24rpx;
|
||||
margin-bottom: 32rpx;
|
||||
|
||||
.countdown-item {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
|
||||
.number {
|
||||
font-size: 48rpx;
|
||||
color: #D42E78;
|
||||
font-weight: bold;
|
||||
font-family: 'DIN';
|
||||
background: #F5F5F5;
|
||||
padding: 8rpx 12rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
.unit {
|
||||
font-size: 24rpx;
|
||||
color: #67677A;
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width: 100%;
|
||||
padding-left: 8rpx;
|
||||
|
||||
.progress-track {
|
||||
height: 16rpx;
|
||||
background: rgba(227, 227, 229, 0.6);
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
box-shadow: inset 0 2rpx 4rpx rgba(0, 0, 0, 0.05);
|
||||
margin-bottom: 12rpx;
|
||||
|
||||
.progress-fill {
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, #D42E78 0%, #19367A 100%);
|
||||
border-radius: 12rpx;
|
||||
transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
box-shadow: 0 2rpx 4rpx rgba(212, 46, 120, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
.progress-labels {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.defTab {
|
||||
width: 50%;
|
||||
border-radius: 30rpx;
|
||||
background: #F2F2F2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-family: Source Han Sans;
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #0B0E26;
|
||||
padding: 16rpx 48rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: #71F4B4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
white-space: nowrap;
|
||||
min-height: 505rpx;
|
||||
.row-box {
|
||||
&:nth-child(1) {
|
||||
margin-left: 32rpx;
|
||||
}
|
||||
}
|
||||
.beer-box {
|
||||
width: 208rpx;
|
||||
background: #FFFFFF;
|
||||
margin-right: 16rpx;
|
||||
margin-bottom: 36rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
|
||||
.cover {
|
||||
width: 208rpx;
|
||||
height: 300rpx;
|
||||
border-radius: 30rpx;
|
||||
margin-bottom: 18rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
color: #1E2019;
|
||||
margin-bottom: 12rpx;
|
||||
color: #19191B;
|
||||
font-family: Roboto;
|
||||
font-weight: 500;
|
||||
|
||||
&.start {
|
||||
color: #D42E78;
|
||||
}
|
||||
&.end {
|
||||
color: #19367A;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 横向滚动容器样式 */
|
||||
.scroll-container {
|
||||
display: flex; /* 使用弹性布局 */
|
||||
padding-top: 16rpx; /* 顶部内边距 */
|
||||
flex-direction: row; /* 水平方向排列 */
|
||||
white-space: nowrap; /* 防止内容换行 */
|
||||
min-height: 505rpx; /* 最小高度确保内容显示完整 */
|
||||
|
||||
/* 行容器样式 */
|
||||
.row-box {
|
||||
&:nth-child(1) { /* 第一个子元素特殊处理 */
|
||||
margin-left: 32rpx; /* 左侧外边距，与容器对齐 */
|
||||
}
|
||||
}
|
||||
|
||||
/* 啤酒卡片样式 */
|
||||
.beer-box {
|
||||
width: 208rpx; /* 卡片固定宽度 */
|
||||
background: #FFFFFF; /* 白色背景 */
|
||||
margin-right: 12rpx; /* 卡片间距 */
|
||||
margin-bottom: 36rpx; /* 底部外边距 */
|
||||
box-sizing: border-box; /* 盒模型计算方式 */
|
||||
display: flex; /* 弹性布局 */
|
||||
flex-direction: column; /* 垂直方向排列 */
|
||||
justify-content: flex-start; /* 内容从顶部开始排列 */
|
||||
|
||||
/* 啤酒图片封面样式 */
|
||||
.cover {
|
||||
width: 208rpx; /* 图片宽度 */
|
||||
height: 300rpx; /* 图片高度 */
|
||||
border-radius: 12rpx; /* 圆角效果 */
|
||||
margin-bottom: 16rpx; /* 与下方文字的间距 */
|
||||
}
|
||||
|
||||
/* 啤酒名称样式 */
|
||||
.title {
|
||||
font-size: 32rpx; /* 字体大小 */
|
||||
color: #030303; /* 文字颜色 */
|
||||
font-weight: 600; /* 字体粗细 */
|
||||
line-height: 48rpx; /* 行高 */
|
||||
margin-bottom: 8rpx; /* 底部间距 */
|
||||
white-space: nowrap; /* 不换行 */
|
||||
overflow: hidden; /* 溢出隐藏 */
|
||||
text-overflow: ellipsis; /* 文本溢出显示省略号 */
|
||||
}
|
||||
|
||||
/* 描述文本样式 */
|
||||
.desc {
|
||||
font-size: 24rpx;
|
||||
color: #A5A7B9;
|
||||
margin-bottom: 12rpx;
|
||||
color: #979797;
|
||||
font-family: Roboto; /* 字体 */
|
||||
font-size: 24rpx; /* 字体大小 */
|
||||
font-weight: normal; /* 字体粗细 */
|
||||
line-height: 32rpx; /* 行高 */
|
||||
color: #606060; /* 文字颜色 */
|
||||
margin-bottom: 8rpx; /* 底部间距 */
|
||||
white-space: nowrap; /* 不换行 */
|
||||
overflow: hidden; /* 溢出隐藏 */
|
||||
text-overflow: ellipsis; /* 文本溢出显示省略号 */
|
||||
}
|
||||
|
||||
/* 数量/评分样式 */
|
||||
.num {
|
||||
display: flex; /* 弹性布局 */
|
||||
align-items: center; /* 垂直居中 */
|
||||
font-size: 20rpx; /* 字体大小 */
|
||||
color: #606060; /* 文字颜色 */
|
||||
line-height: 32rpx; /* 行高 */
|
||||
|
||||
font-size: 20rpx;
|
||||
color: #5F5F63;
|
||||
image {
|
||||
margin-right: 10rpx; /* 图标右侧间距 */
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -397,5 +607,137 @@
|
||||
padding: 30rpx;
|
||||
margin-bottom: 36rpx;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
width: 100%;
|
||||
padding: 0 32rpx;
|
||||
|
||||
.progress-track {
|
||||
height: 12rpx;
|
||||
background: #E3E3E5;
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.progress-fill {
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, #D42E78 0%, #19367A 100%);
|
||||
border-radius: 6rpx;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
}
|
||||
|
||||
.progress-labels {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 12rpx;
|
||||
|
||||
text {
|
||||
font-size: 24rpx;
|
||||
color: #67677A;
|
||||
|
||||
&.start {
|
||||
color: #D42E78;
|
||||
}
|
||||
&.end {
|
||||
color: #19367A;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.activity-info-box {
|
||||
padding: 32rpx;
|
||||
min-height: 360rpx; /* 设置最小高度 */
|
||||
|
||||
.brand-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 24rpx;
|
||||
// padding-bottom: 24rpx;
|
||||
// border-bottom: 1rpx solid #F5F5F5;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.brand-logo {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 12rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.brand-text {
|
||||
flex: 1;
|
||||
|
||||
.initiator {
|
||||
color: #979797;
|
||||
font-size: 24rpx;
|
||||
font-weight: normal;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.activity-duration {
|
||||
color: #0B0E26;
|
||||
font-size: 28rpx;
|
||||
font-weight: normal;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 16rpx;
|
||||
|
||||
.duration-value {
|
||||
color: #D42E78;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.activity-target {
|
||||
color: #0B0E26;
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
margin-top: 16rpx;
|
||||
height: 505rpx; /* 固定高度确保滚动区域统一 */
|
||||
}
|
||||
}
|
||||
|
||||
.bottom-bar {
|
||||
border-radius: 12rpx;
|
||||
height: 182rpx;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
box-shadow: 0 -2rpx 8rpx rgba(0, 0, 0, 0.05);
|
||||
|
||||
.scan-btn {
|
||||
width: 686rpx;
|
||||
height: 96rpx;
|
||||
background: #19367A;
|
||||
border-radius: 12rpx;
|
||||
color: #FFFFFF;
|
||||
font-size: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&.btn-disabled {
|
||||
background: #E5E6EB;
|
||||
color: #86909C;
|
||||
}
|
||||
|
||||
.cuIcon-qr_code {
|
||||
font-size: 36rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #0B0E26;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -32,7 +32,7 @@
|
||||
</view>
|
||||
<template v-if="currentTab == 1">
|
||||
<view class="margin-bottom-xs" style="color:#0B0E26">首次扫码开始累计 · <text style="color: #DE3C4B;">{{activity.duration}} 天内</text></view>
|
||||
<view class="margin-bottom-xs" style="color:#0B0E26">以下酒款累计扫码 ≥ {{activity.activityTarget}} 桶 </view>
|
||||
<view class="margin-bottom-xs" style="color:#0B0E26">{{ activity.beer_scope === 0 ? '全系列酒款' : '以下酒款' }}累计扫码 ≥ {{activity.activityTarget}} 桶 </view>
|
||||
</template>
|
||||
|
||||
<rowBeer :beers="activity.beers" />
|
||||
|
||||
@ -102,9 +102,8 @@
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="title">{{ it.activityName }}</view>
|
||||
<view class="sub">时间：首次扫码开始累计 <text style="color:#DE3C4B">{{it.duration}}天内</text>
|
||||
</view>
|
||||
<view class="sub">目标：全系列酒款累积扫码 ≥ {{ it.activityTarget}}桶</view>
|
||||
<view class="sub">时间：首次扫码开始累计 <text style="color:#DE3C4B">{{it.duration}}天内</text></view>
|
||||
<view class="sub">目标：{{ it.beer_scope === 0 ? '全系列酒款' : '以下酒款' }}累积扫码 ≥ {{ it.activityTarget}}桶</view>
|
||||
<scroll-view v-if="it.beers" scroll-x="true" class="scroll-img">
|
||||
<view class="beer-box" v-for="(it, index) in it.beers" :key="index"
|
||||
@click="toReview(it)">
|
||||
@ -140,9 +139,8 @@
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="title">{{ it.activityName }}</view>
|
||||
<view class="sub">时间：首次扫码开始累计 <text style="color:#DE3C4B">{{it.duration}}天内</text>
|
||||
</view>
|
||||
<view class="sub">目标：全系列酒款累积扫码 ≥ {{ it.activityTarget}}桶</view>
|
||||
<view class="sub">时间：首次扫码开始累计 <text style="color:#DE3C4B">{{it.duration}}天内</text></view>
|
||||
<view class="sub">目标：{{ it.beer_scope === 0 ? '全系列酒款' : '以下酒款' }}累积扫码 ≥ {{ it.activityTarget}}桶</view>
|
||||
<scroll-view scroll-x="true" class="scroll-img">
|
||||
<view class="beer-box" v-for="(it, index) in it.beers" :key="index"
|
||||
@click="toReview(it)">
|
||||
|
||||
@ -48,7 +48,7 @@
|
||||
<view class="info-item">
|
||||
<text>所在地区</text>
|
||||
<view class="right-content">
|
||||
<text class="info-text">{{form.region}}</text>
|
||||
<text class="info-text">{{form.city || '--'}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-item" @click="toAddress">
|
||||
@ -67,7 +67,7 @@
|
||||
<view class="info-item">
|
||||
<text>门店ID</text>
|
||||
<view class="right-content">
|
||||
<text>N080202</text>
|
||||
<text class="info-text">{{ barInfo.barNumber || '--' }}</text>
|
||||
<text class="cuIcon-copy text-gray" @click="copyId"></text>
|
||||
</view>
|
||||
</view>
|
||||
@ -350,11 +350,12 @@
|
||||
storefrontPhoto: '', // 门头照
|
||||
position: '', // 职务
|
||||
openId: '',
|
||||
region: ''
|
||||
city: ''
|
||||
},
|
||||
userInfo: {},
|
||||
currentTab: 1,
|
||||
QQMap: null,
|
||||
barInfo: {},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -370,13 +371,20 @@
|
||||
// });
|
||||
this.getBarInfoFun()
|
||||
},
|
||||
onShow() {
|
||||
// 获取最新的门店信息
|
||||
const barInfo = uni.getStorageSync('barInfo');
|
||||
if (barInfo) {
|
||||
this.barInfo = barInfo;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
copyId() {
|
||||
uni.setClipboardData({
|
||||
data: 'N080202',
|
||||
data: this.barInfo.barNumber || '',
|
||||
success: () => {
|
||||
uni.showToast({
|
||||
title: '复制成功',
|
||||
@ -533,6 +541,9 @@
|
||||
// 只保留微信头像选择方法
|
||||
onChooseAvatar(e) {
|
||||
const avatarUrl = e.detail.avatarUrl;
|
||||
uni.showLoading({
|
||||
title: '上传中'
|
||||
});
|
||||
// 上传头像到服务器
|
||||
uni.uploadFile({
|
||||
url: base_url + '/bar/common/upload',
|
||||
@ -542,9 +553,36 @@
|
||||
type: 'image'
|
||||
},
|
||||
success: (uploadFileRes) => {
|
||||
this.form.barLogo = JSON.parse(uploadFileRes.data).url;
|
||||
try {
|
||||
let result;
|
||||
if (typeof uploadFileRes.data === 'string') {
|
||||
result = JSON.parse(uploadFileRes.data);
|
||||
} else {
|
||||
result = uploadFileRes.data;
|
||||
}
|
||||
|
||||
if (result && result.code === 200) {
|
||||
this.form.barLogo = result.data; // 使用data字段获取URL
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '上传成功',
|
||||
icon: 'success'
|
||||
});
|
||||
} else {
|
||||
throw new Error(result?.msg || '上传失败');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Upload response parsing error:', error);
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: error.message || '上传失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('Upload failed:', err);
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '头像上传失败',
|
||||
icon: 'none'
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user