完成红包模块功能
This commit is contained in:
赵毅
parent
62cc81168f
commit
718b3a2066
@ -82,7 +82,7 @@ page {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
box-shadow: 3rpx -3rpx 15rpx 0rpx rgba(255,27,27,0.05);
|
||||
box-shadow: 3rpx -3rpx 15rpx 0rpx rgba(255, 27, 27, 0.05);
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
@ -194,23 +194,23 @@ page {
|
||||
}
|
||||
|
||||
.Msg_con_img {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
margin-top: 15rpx;
|
||||
gap: 15rpx;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100%;
|
||||
margin-top: 15rpx;
|
||||
gap: 15rpx;
|
||||
}
|
||||
|
||||
.Msg_con_img image {
|
||||
width: calc(33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
width: calc(33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.Msg_con_video{
|
||||
width: calc(33.33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
.Msg_con_video {
|
||||
width: calc(33.33% - 11rpx);
|
||||
height: 225rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.Msg_iconList_leftIcon {
|
||||
@ -245,10 +245,184 @@ page {
|
||||
font-size: 26rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.Msg_iconList_right div{
|
||||
|
||||
.Msg_iconList_right div {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.mb32{
|
||||
.mb32 {
|
||||
margin-bottom: 32rpx;
|
||||
}
|
||||
|
||||
/* 优惠劵样式 */
|
||||
.coupon_container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow-x: auto;
|
||||
padding: 20rpx 0;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.coupon {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: auto;
|
||||
height: 100rpx;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 10rpx;
|
||||
padding: 0 20rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.coupon_used1 {
|
||||
background: #ffece7;
|
||||
border: 1rpx solid #FF5757;
|
||||
color: #ff3a0d;
|
||||
}
|
||||
|
||||
.coupon_amount {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.coupon_condition {
|
||||
font-size: 30rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.coupon_status {
|
||||
width: 60rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.more_coupon {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
color: #FF370B;
|
||||
font-size: 30rpx;
|
||||
position: sticky;
|
||||
right: 0;
|
||||
left: 750rpx;
|
||||
z-index: 1000;
|
||||
background-color: #fff;
|
||||
height: 122rpx;
|
||||
padding: 0 20rpx;
|
||||
border-left: 1rpx solid #cccc;
|
||||
}
|
||||
|
||||
.more_text {
|
||||
width: 70rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 优惠详情弹窗样式 */
|
||||
.coupon_popup {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: white;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.popup_header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
}
|
||||
|
||||
.popup_title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.popup_close {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.popup_content {
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.coupon_item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx;
|
||||
background: white;
|
||||
border-radius: 10rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.coupon_item_left {
|
||||
background: #FF5757;
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
color: white;
|
||||
text-align: center;
|
||||
min-width: 160rpx;
|
||||
}
|
||||
|
||||
.coupon_item_amount {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.coupon_item_condition {
|
||||
font-size: 20rpx;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.coupon_item_center {
|
||||
flex: 1;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.coupon_item_name {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.coupon_item_expire {
|
||||
font-size: 22rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.coupon_item_right {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.coupon_item_button {
|
||||
width: 120rpx;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
background: #FF370B;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 30rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.coupon_item_button::after {
|
||||
border: none;
|
||||
}
|
||||
@ -14,10 +14,25 @@
|
||||
<!-- <u-icon name="star-fill" color="#FFB84D" /> -->
|
||||
<view class="startList">
|
||||
<image v-for="index in 5" :key="index"
|
||||
:src="index < item.rating ? 'https://static.hshuishang.com/property-img-file/local_start1.png' : 'https://static.hshuishang.com/property-img-file/local_start2.png'"
|
||||
:src="index < info.rating ? 'https://static.hshuishang.com/property-img-file/local_start1.png' : 'https://static.hshuishang.com/property-img-file/local_start2.png'"
|
||||
mode="aspectFill"></image>
|
||||
</view>
|
||||
|
||||
<!-- 优惠劵区域 -->
|
||||
<view class="coupon_container" v-if="coupons.length > 0">
|
||||
<view class="coupon" :class="{ 'coupon_used1': coupon.is_received }" v-for="(coupon, index) in coupons"
|
||||
:key="index">
|
||||
<view class="coupon_amount">¥{{ coupon.money }}</view>
|
||||
<view class="coupon_condition" v-if="coupon.full_amount != 0">满{{ coupon.full_amount }}元可用</view>
|
||||
<view class="coupon_condition" v-else>无门槛</view>
|
||||
<view class="coupon_status" @click="handleCouponClick(coupon)">{{ coupon.is_received ? '已领' : '领取' }}</view>
|
||||
</view>
|
||||
<view class="more_coupon" @click="showCouponDetail">
|
||||
<view class="more_text">更多优惠</view>
|
||||
<u-icon name="arrow-right" color="#FF370B" size="28" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-line margin="46rpx 0 30rpx 0" />
|
||||
<view class="table">
|
||||
<view class="label">联系电话</view>
|
||||
@ -48,8 +63,8 @@
|
||||
<view class="Msg">
|
||||
<view class="Msg_Tit">
|
||||
<view class="Msg_Tit_left">
|
||||
<image src="https://static.hshuishang.com/property-img-file/user_ava.png"
|
||||
v-if="!item.user.avatar" mode="aspectFill"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/user_ava.png" v-if="!item.user.avatar"
|
||||
mode="aspectFill"></image>
|
||||
<image :src="picUrl + item.user.avatar" v-if="item.user.avatar" mode="aspectFill"></image>
|
||||
{{ item.user.nick_name }}
|
||||
</view>
|
||||
@ -73,17 +88,14 @@
|
||||
<view class="Msg_iconList">
|
||||
<view class="Msg_iconList_left">
|
||||
<view class="Msg_iconList_leftIcon">
|
||||
<image src="https://static.hshuishang.com/property-img-file/local_review.png"
|
||||
mode="widthFix"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/local_review.png" mode="widthFix"></image>
|
||||
{{ item.merchant_evaluation_reply_list ? item.merchant_evaluation_reply_list.length : 0 }}
|
||||
</view>
|
||||
|
||||
<view class="Msg_iconList_leftIcon">
|
||||
<image v-if="item.is_like == 2"
|
||||
src="https://static.hshuishang.com/property-img-file/com_likeIcon.png"
|
||||
<image v-if="item.is_like == 2" src="https://static.hshuishang.com/property-img-file/com_likeIcon.png"
|
||||
mode="widthFix" @click="like(item)"></image>
|
||||
<image v-if="item.is_like == 1"
|
||||
src="https://static.hshuishang.com/property-img-file/com_likeIcon2.png"
|
||||
<image v-if="item.is_like == 1" src="https://static.hshuishang.com/property-img-file/com_likeIcon2.png"
|
||||
mode="widthFix" @click="unlike(item)"></image>
|
||||
{{ item.merchant_evaluation_like_list ? item.merchant_evaluation_like_list.length : 0 }}
|
||||
</view>
|
||||
@ -101,14 +113,11 @@
|
||||
<view>导航</view>
|
||||
</view>
|
||||
<view class="left_label" @click="handlePhoneClick" v-if="info.phone">
|
||||
<image src="https://static.hshuishang.com/property-img-file/localLife_detail_Frame.png"
|
||||
mode="" />
|
||||
<image src="https://static.hshuishang.com/property-img-file/localLife_detail_Frame.png" mode="" />
|
||||
<view>电话</view>
|
||||
</view>
|
||||
<view class="left_label" @click="handleDiscussClick">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/localLife_shopList_Group_1334.png"
|
||||
mode="" />
|
||||
<image src="https://static.hshuishang.com/property-img-file/localLife_shopList_Group_1334.png" mode="" />
|
||||
<view>点评</view>
|
||||
</view>
|
||||
<view class="left_label" @click="handleKfClick">
|
||||
@ -119,6 +128,32 @@
|
||||
<button v-if="isShow && !isDisabled" class="btn" @click="handleQuickPayClick">快捷买单</button>
|
||||
<button v-if="isShow && isDisabled" class="btn_disabled" @click="handleQuickPayClick">快捷买单</button>
|
||||
</view>
|
||||
|
||||
<!-- 优惠详情弹窗 -->
|
||||
<u-popup :show="showCouponPopup" width="650rpx" height="800rpx" round="20rpx">
|
||||
<view class="coupon_popup">
|
||||
<view class="popup_header">
|
||||
<view class="popup_title">优惠详情</view>
|
||||
<view class="popup_close" @click="closeCouponPopup">取消</view>
|
||||
</view>
|
||||
<view class="popup_content">
|
||||
<view class="coupon_item" v-for="(item, index) in couponDetails" :key="index">
|
||||
<view class="coupon_item_left">
|
||||
<view class="coupon_item_amount">¥{{ item.money }}</view>
|
||||
<view class="coupon_item_condition" v-if="item.full_amount != 0">满{{ item.full_amount }}元可用</view>
|
||||
<view class="coupon_item_condition" v-else>无门槛</view>
|
||||
</view>
|
||||
<view class="coupon_item_center">
|
||||
<view class="coupon_item_name">{{ item.red_package_name }}</view>
|
||||
<view class="coupon_item_expire">{{ item.end_time }}到期</view>
|
||||
</view>
|
||||
<view class="coupon_item_right">
|
||||
<view class="coupon_item_button" @click="handleCouponClick(item)">{{ item.is_received ? '已领' : '领取' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -130,6 +165,7 @@ import {
|
||||
} from "../../../utils";
|
||||
|
||||
import { apiArr } from "../../../api/v2local";
|
||||
import { apiArr as apiArr2 } from "../../../api/user";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -142,6 +178,9 @@ export default {
|
||||
flag: false,
|
||||
isShow: false,
|
||||
isDisabled: false,
|
||||
coupons: [],
|
||||
couponDetails: [],
|
||||
showCouponPopup: false
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
@ -164,6 +203,7 @@ export default {
|
||||
this.getCommentList()
|
||||
}
|
||||
this.getMerchantInfo()
|
||||
this.getCouponList()
|
||||
},
|
||||
onReachBottom() {
|
||||
if (this.flag) {
|
||||
@ -172,6 +212,29 @@ export default {
|
||||
},
|
||||
|
||||
methods: {
|
||||
getCouponList() {
|
||||
const params = {
|
||||
mch_id: uni.getStorageSync("merchantInfo").id,
|
||||
}
|
||||
request(apiArr2.redPackageCenter, "POST", params).then(res => {
|
||||
this.coupons = res.rows
|
||||
this.couponDetails = res.rows
|
||||
})
|
||||
},
|
||||
// 领取红包
|
||||
handleCouponClick(item) {
|
||||
if (item.is_received) {
|
||||
return
|
||||
}
|
||||
const params = {
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
red_package_config_id: item.id,
|
||||
mch_id: item.belong_role == 1 ? item.merchant_id : ''
|
||||
}
|
||||
request(apiArr2.redPackageClaim, 'POST', params).then(res => {
|
||||
this.getCouponList()
|
||||
})
|
||||
},
|
||||
handleQuickPayClick() {
|
||||
if (this.isDisabled) {
|
||||
uni.showToast({
|
||||
@ -313,6 +376,24 @@ export default {
|
||||
});
|
||||
},
|
||||
|
||||
// 显示优惠详情弹窗
|
||||
showCouponDetail() {
|
||||
this.showCouponPopup = true;
|
||||
},
|
||||
|
||||
// 关闭优惠详情弹窗
|
||||
closeCouponPopup() {
|
||||
this.showCouponPopup = false;
|
||||
},
|
||||
|
||||
// 领取优惠劵
|
||||
receiveCoupon() {
|
||||
uni.showToast({
|
||||
title: '领取成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -313,10 +313,10 @@ image {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.shadowBox1Item_btn{
|
||||
.shadowBox1Item_btn {
|
||||
width: 150rpx;
|
||||
height: 170rpx;
|
||||
opacity:0;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
left: 100rpx;
|
||||
top: 40rpx;
|
||||
@ -833,4 +833,177 @@ image {
|
||||
.car_right_buy {
|
||||
width: 220rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
/* 优惠劵样式 */
|
||||
.coupon_container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow-x: auto;
|
||||
padding: 20rpx 0 20rpx 20rpx;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.coupon {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: auto;
|
||||
height: 100rpx;
|
||||
background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%);
|
||||
border-radius: 10rpx;
|
||||
padding: 0 20rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.coupon_used1 {
|
||||
background: #ffece7;
|
||||
border: 1rpx solid #FF5757;
|
||||
color: #ff3a0d;
|
||||
}
|
||||
|
||||
.coupon_amount {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.coupon_condition {
|
||||
font-size: 30rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.coupon_status {
|
||||
width: 60rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.more_coupon {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
color: #FF370B;
|
||||
font-size: 30rpx;
|
||||
position: sticky;
|
||||
right: 0;
|
||||
left: 750rpx;
|
||||
z-index: 1000;
|
||||
background-color: #fff;
|
||||
height: 122rpx;
|
||||
padding: 0 10rpx 0 20rpx;
|
||||
border-left: 1rpx solid #cccc;
|
||||
}
|
||||
|
||||
.more_text {
|
||||
width: 70rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 优惠详情弹窗样式 */
|
||||
.coupon_popup {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: white;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.popup_header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
border-bottom: 1rpx solid #E6E6E6;
|
||||
}
|
||||
|
||||
.popup_title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.popup_close {
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.popup_content {
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.coupon_item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx;
|
||||
background: white;
|
||||
border-radius: 10rpx;
|
||||
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.coupon_item_left {
|
||||
background: #FF5757;
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
color: white;
|
||||
text-align: center;
|
||||
min-width: 160rpx;
|
||||
}
|
||||
|
||||
.coupon_item_amount {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.coupon_item_condition {
|
||||
font-size: 20rpx;
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.coupon_item_center {
|
||||
flex: 1;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.coupon_item_name {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.coupon_item_expire {
|
||||
font-size: 22rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.coupon_item_right {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.coupon_item_button {
|
||||
width: 120rpx;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
background: #FF370B;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 30rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.coupon_item_button::after {
|
||||
border: none;
|
||||
}
|
||||
@ -40,8 +40,24 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="GG_rigth" @click="showSizePopup">
|
||||
共{{ info.commodity_goods_info_list ? info.commodity_goods_info_list.length : 0 }}款<u-icon size="26rpx"
|
||||
name="arrow-right"></u-icon>
|
||||
共{{ info.commodity_goods_info_list ? info.commodity_goods_info_list.length : 0 }}款
|
||||
<u-icon size="26rpx" name="arrow-right"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 优惠劵区域 -->
|
||||
<view class="coupon_container" v-if="coupons.length > 0">
|
||||
<view class="coupon" :class="{ 'coupon_used1': coupon.is_received }" v-for="(coupon, index) in coupons"
|
||||
:key="index">
|
||||
<view class="coupon_amount">¥{{ coupon.money }}</view>
|
||||
<view class="coupon_condition" v-if="coupon.full_amount != 0">满{{ coupon.full_amount }}元可用</view>
|
||||
<view class="coupon_condition" v-else>无门槛</view>
|
||||
<view class="coupon_status" @click="handleCouponClick(coupon)">{{ coupon.is_received ? '已领' : '领取' }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="more_coupon" @click="showCouponPopup = true">
|
||||
<view class="more_text">更多优惠</view>
|
||||
<u-icon name="arrow-right" color="#FF370B" size="28" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -54,7 +70,7 @@
|
||||
<view class="fenge"></view>
|
||||
|
||||
<!-- 促销信息区域 -->
|
||||
<view class="promotions-container">
|
||||
<!-- <view class="promotions-container">
|
||||
<view class="promotion-item">
|
||||
<view class="promotion-tag">优惠</view>
|
||||
<view class="promotion-content promotion-content1">满100减10</view>
|
||||
@ -75,7 +91,7 @@
|
||||
<view class="promotion-tag">满减</view>
|
||||
<view class="promotion-content">满100减5，满200减20</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<view class="fenge"></view>
|
||||
|
||||
@ -162,15 +178,13 @@
|
||||
<view class="Car">
|
||||
<view class="car_left">
|
||||
<view class="share" @click="share">
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_share.png"
|
||||
mode="widthFix"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_share.png" mode="widthFix"></image>
|
||||
分享
|
||||
</view>
|
||||
<view class="cars" @click="car">
|
||||
<u-badge numberType="limit" :type="type" max="99" :value="carNum"></u-badge>
|
||||
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_car.png"
|
||||
mode="widthFix"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_car.png" mode="widthFix"></image>
|
||||
购物车
|
||||
</view>
|
||||
</view>
|
||||
@ -207,13 +221,12 @@
|
||||
<view class="shadowBox1">
|
||||
<button class="shadowBox1Item_btn" open-type="share" bindtap="onShareButtonClick" />
|
||||
<view class="shadowBox1Item" @click="shareFriend">
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_WX.png"
|
||||
mode="aspectFill"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_WX.png" mode="aspectFill"></image>
|
||||
微信好友
|
||||
</view>
|
||||
<view class="shadowBox1Item" @click="openSave">
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_saveImg.png"
|
||||
mode="aspectFill"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/shop_saveImg.png" mode="aspectFill">
|
||||
</image>
|
||||
生成海报
|
||||
</view>
|
||||
</view>
|
||||
@ -227,8 +240,7 @@
|
||||
<image v-if="currentGG && currentGG.commodity_pic && currentGG.commodity_pic.length > 0"
|
||||
:src="picUrl + currentGG.commodity_pic[0]">
|
||||
</image>
|
||||
<image v-else
|
||||
src="https://static.hshuishang.com/property-img-file/shop_share_img.png">
|
||||
<image v-else src="https://static.hshuishang.com/property-img-file/shop_share_img.png">
|
||||
</image>
|
||||
</view>
|
||||
<view class="line"></view>
|
||||
@ -288,6 +300,34 @@
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<!-- 优惠详情弹窗 -->
|
||||
<u-popup :show="showCouponPopup" width="650rpx" height="800rpx" round="20rpx">
|
||||
<view class="coupon_popup">
|
||||
<view class="popup_header">
|
||||
<view class="popup_title">优惠详情</view>
|
||||
<view class="popup_close" @click="showCouponPopup = false">取消</view>
|
||||
</view>
|
||||
<view class="popup_content">
|
||||
<view class="coupon_item" v-for="(item, index) in couponDetails" :key="index">
|
||||
<view class="coupon_item_left">
|
||||
<view class="coupon_item_amount">¥{{ item.money }}</view>
|
||||
<view class="coupon_item_condition" v-if="item.full_amount != 0">满{{ item.full_amount }}元可用
|
||||
</view>
|
||||
<view class="coupon_item_condition" v-else>无门槛</view>
|
||||
</view>
|
||||
<view class="coupon_item_center">
|
||||
<view class="coupon_item_name">{{ item.red_package_name }}</view>
|
||||
<view class="coupon_item_expire">{{ item.end_time }}到期</view>
|
||||
</view>
|
||||
<view class="coupon_item_right">
|
||||
<view class="coupon_item_button" @click="handleCouponClick(item)">{{ item.is_received ? '已领'
|
||||
: '领取' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<!-- 选择款式 -->
|
||||
<u-popup :show="showSize" round="20rpx" mode="bottom" @close="closeSize" @open="open">
|
||||
<!-- <view round="20rpx" mode="bottom"> -->
|
||||
@ -361,22 +401,19 @@
|
||||
<view class="payment-section">
|
||||
<view class="payment-item" @click="selectPayment('wechat')">
|
||||
<view class="payment-icon">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_wechat.png"
|
||||
mode="aspectFit"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_wechat.png" mode="aspectFit">
|
||||
</image>
|
||||
</view>
|
||||
<view class="payment-content">
|
||||
<view class="payment-name">微信支付</view>
|
||||
</view>
|
||||
<view class="payment-select" v-if="selectedPayment === 'wechat'">
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_check2.png"
|
||||
mode="aspectFit" style="width: 30rpx; height: 30rpx;"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_check2.png" mode="aspectFit"
|
||||
style="width: 30rpx; height: 30rpx;"></image>
|
||||
</view>
|
||||
<view class="payment-select" v-else>
|
||||
<image
|
||||
src="https://static.hshuishang.com/property-img-file/com_check1.png"
|
||||
mode="aspectFit" style="width: 30rpx; height: 30rpx;"></image>
|
||||
<image src="https://static.hshuishang.com/property-img-file/com_check1.png" mode="aspectFit"
|
||||
style="width: 30rpx; height: 30rpx;"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -389,6 +426,7 @@
|
||||
import {
|
||||
apiArr
|
||||
} from "../../../api/shop";
|
||||
import { apiArr as apiArr2 } from "../../../api/user";
|
||||
import {
|
||||
picUrl,
|
||||
menuButtonInfo,
|
||||
@ -432,6 +470,10 @@ export default {
|
||||
goodsUnit: "",
|
||||
selectedGoods: null, // 保存传入的商品规格信息
|
||||
qrcodePath: null, // 存储当前页面的二维码路径
|
||||
// 红包相关
|
||||
coupons: [],
|
||||
couponDetails: [],
|
||||
showCouponPopup: false
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
@ -901,6 +943,30 @@ export default {
|
||||
review_image: item.review_image ? item.review_image.split(',') : []
|
||||
}));
|
||||
});
|
||||
},
|
||||
// 获取优惠券列表
|
||||
getCouponList() {
|
||||
const params = {
|
||||
goods_id: this.id,
|
||||
}
|
||||
request(apiArr2.redPackageCenter, "POST", params).then(res => {
|
||||
this.coupons = res.rows
|
||||
this.couponDetails = res.rows
|
||||
})
|
||||
},
|
||||
// 领取红包
|
||||
handleCouponClick(item) {
|
||||
if (item.is_received) {
|
||||
return
|
||||
}
|
||||
const params = {
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
red_package_config_id: item.id,
|
||||
mch_id: item.belong_role == 1 ? item.merchant_id : ''
|
||||
}
|
||||
request(apiArr2.redPackageClaim, 'POST', params).then(res => {
|
||||
this.getCouponList()
|
||||
})
|
||||
}
|
||||
}, onLoad(options) {
|
||||
const itemObj = JSON.parse(decodeURIComponent(options.item));
|
||||
@ -908,7 +974,6 @@ export default {
|
||||
this.top = meun.top;
|
||||
this.localHeight = meun.height;
|
||||
|
||||
|
||||
this.id = itemObj.commodity_id ? itemObj.commodity_id : itemObj.id;
|
||||
this.selectedGoods = itemObj; // 保存传入的完整商品信息
|
||||
},
|
||||
@ -918,6 +983,7 @@ export default {
|
||||
this.getGoodsInfo();
|
||||
// this.getShopCar();
|
||||
this.getComment();
|
||||
this.getCouponList();
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
@ -103,12 +103,16 @@ page {
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #ff7557;
|
||||
}
|
||||
|
||||
.full {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
color: #ff7557;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
|
||||
|
||||
@ -34,8 +34,8 @@
|
||||
<view class="item">
|
||||
<view class="item_left">
|
||||
<view class="price">￥{{ item.red_package_config.money }}</view>
|
||||
<view v-if="item.red_package_config.manjian" class="manjian">
|
||||
{{ item.red_package_config.manjian }}
|
||||
<view class="full" v-if="item.red_package_config.full_amount">
|
||||
满{{ item.red_package_config.full_amount }}元可用
|
||||
</view>
|
||||
</view>
|
||||
<view class="item_center">
|
||||
@ -65,9 +65,8 @@
|
||||
<view class="item">
|
||||
<view class="item_left">
|
||||
<view class="price">￥{{ item.red_package_config.money }}</view>
|
||||
<view v-if="item.red_package_config.manjian" class="manjian">
|
||||
{{ item.red_package_config.manjian }}
|
||||
</view>
|
||||
<view class="full" v-if="item.red_package_config.full_amount">满{{
|
||||
item.red_package_config.full_amount }}元可用</view>
|
||||
</view>
|
||||
<view class="item_center">
|
||||
<view class="title">{{ item.red_package_config.red_package_name }}</view>
|
||||
@ -91,9 +90,8 @@
|
||||
<view class="item">
|
||||
<view class="item_left">
|
||||
<view class="price">￥{{ item.red_package_config.money }}</view>
|
||||
<view v-if="item.red_package_config.manjian" class="manjian">
|
||||
{{ item.red_package_config.manjian }}
|
||||
</view>
|
||||
<view class="full" v-if="item.red_package_config.full_amount">满{{
|
||||
item.red_package_config.full_amount }}元可用</view>
|
||||
</view>
|
||||
<view class="item_center">
|
||||
<view class="title">{{ item.red_package_config.red_package_name }}</view>
|
||||
|
||||
@ -15,17 +15,27 @@
|
||||
}
|
||||
|
||||
.item_left {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
width: 150rpx;
|
||||
height: 170rpx;
|
||||
line-height: 170rpx;
|
||||
padding-left: 30rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 20rpx 80rpx 80rpx 20rpx;
|
||||
border: 3rpx solid #ff775a;
|
||||
position: relative;
|
||||
left: -22rpx;
|
||||
color: #ff370b;
|
||||
display: flex;
|
||||
flex-direction: column; /* 垂直排列 */
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.money {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.full {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.item_center {
|
||||
@ -52,8 +62,10 @@
|
||||
|
||||
.item_right {
|
||||
margin-right: 20rpx;
|
||||
position: relative; /* 添加相对定位 */
|
||||
z-index: 10; /* 添加更高的z-index值 */
|
||||
position: relative;
|
||||
/* 添加相对定位 */
|
||||
z-index: 10;
|
||||
/* 添加更高的z-index值 */
|
||||
}
|
||||
|
||||
.status {
|
||||
@ -65,8 +77,10 @@
|
||||
color: #ff7557;
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
position: relative; /* 添加相对定位 */
|
||||
z-index: 10; /* 添加更高的z-index值 */
|
||||
position: relative;
|
||||
/* 添加相对定位 */
|
||||
z-index: 10;
|
||||
/* 添加更高的z-index值 */
|
||||
}
|
||||
|
||||
.status2 {
|
||||
@ -77,7 +91,8 @@
|
||||
height: 120rpx;
|
||||
overflow: hidden;
|
||||
transform: rotate(0deg);
|
||||
z-index: 1; /* 添加较低的z-index值 */
|
||||
z-index: 1;
|
||||
/* 添加较低的z-index值 */
|
||||
}
|
||||
|
||||
.status2::after {
|
||||
@ -189,6 +204,7 @@
|
||||
.content {
|
||||
height: calc(100vh - 100rpx);
|
||||
}
|
||||
|
||||
.loading {
|
||||
text-align: center;
|
||||
padding: 20rpx;
|
||||
|
||||
@ -3,7 +3,10 @@
|
||||
<scroll-view class="content" scroll-y @scrolltolower="loadMore">
|
||||
<view v-for="(item, index) in redPacketList" :key="index">
|
||||
<view class="item">
|
||||
<view class="item_left">￥{{ item.money }}</view>
|
||||
<view class="item_left">
|
||||
<view class="money">￥{{ item.money }}</view>
|
||||
<view class="full" v-if="item.full_amount">满{{ item.full_amount }}元可用</view>
|
||||
</view>
|
||||
<view class="item_center">
|
||||
<view class="title">{{ item.red_package_name }}</view>
|
||||
<view class="time">{{ item.end_time }}到期</view>
|
||||
@ -75,6 +78,7 @@ export default {
|
||||
const params = {
|
||||
user_id: uni.getStorageSync('userId'),
|
||||
red_package_config_id: item.id,
|
||||
mch_id: item.belong_role == 1 ? item.merchant_id : ''
|
||||
}
|
||||
request(apiArr.redPackageClaim, 'POST', params).then(res => {
|
||||
this.currentItem = item;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user