app/pages/product/product/promotion/-promotion-assemble-list.vue
2025-03-14 16:27:50 +08:00

109 lines
2.5 KiB
Vue

<template>
<view class="group-list">
<view class="group-name">拼购列表</view>
<view v-if="assembleOrder.length != 0">
<view class="group-item" v-for="(order, index) in assembleOrder" :key="index">
<view class="group-item-user">
<u-image shape="circle" width="40px" height="40px" :src="order.face"></u-image>
<span class="group-item-name">{{ order.nickName | noPassByName }}</span>
</view>
<view>
<span class="group-item-name">还差{{ order.toBeGroupedNum }}人成团</span>
</view>
<view>
<u-button size="mini" :custom-style="customStyle" @click="buy(order)"
>去参团</u-button
>
</view>
</view>
</view>
<view v-else class="nomore">
<u-empty text="暂无拼团信息" mode="list"></u-empty>
</view>
</view>
</template>
<script>
import * as API_Promotions from "@/api/promotions";
export default {
data() {
return {
customStyle: {
background: this.$lightColor,
color: "#fff",
},
/** 待成团订单 */
assembleOrder: "",
/** 查看更多待成团订单 */
assembleOrderAll: "",
};
},
props: ["res"],
watch: {
res: {
handler() {
if (this.res && this.res.length != 0) {
Object.keys(this.res).forEach((item) => {
let key = item.split("-");
if (key && key[0] == "PINTUAN") {
this.getAssembleInfo(item);
}
});
}
},
immediate: true,
},
// assembleOrder(val) {
// this.$emit("assembleOrder", val);
// },
},
computed: {},
mounted() {},
methods: {
// 获取此商品所有待成团的订单
getAssembleInfo(val) {
let id = this.res[val].id;
API_Promotions.getPromotionGroupMember(id).then((res) => {
if (res.data.success) {
console.warn(res.data.result);
this.assembleOrder = res.data.result;
}
});
},
buy(order) {
this.$emit("to-assemble-buy-now", order);
},
},
};
</script>
<style lang="scss" scoped>
@import "../product.scss";
.nomore {
padding: 10rpx 0;
}
.group-item {
margin: 30rpx 0;
display: flex;
align-items: center;
justify-content: space-between;
}
.group-item-user {
display: flex;
align-items: center;
}
.group-item-name {
margin-left: 23rpx;
font-size: 24rpx;
color: #999999;
font-weight: 400;
}
</style>