<template>
    <view>
		<uni-card  v-model="marketingDataFrom">
			<view slot="actions" class="card-actions">
				<view class="cu-list menu-avatar">
				<image style="width: 100%;" :src="marketingDataFrom.productImage" ></image>
				</view>
				<view class="content flex-sub"> {{marketingDataFrom.name}}</view><view class="text-content"> 结束时间： {{marketingDataFrom.endTime}}</view>
				<view class="text-content">
				销量：{{volume}}
				</view>
				<view class="text-content">
				    浏览量：{{pageView}}
				</view>
			</view>
		</uni-card>
		
		
		<uni-card title="立即拼团" extra="">
			<view slot="actions" class="card-actions" v-for="team in teamInfoData">
				  <image style="width: 30px; height: 30px;" :src="team.productImage" ></image>
				<text class="uni-body" style="width: 100px; height: 30px;">还差 1人 成团。</text>
				<text class="uni-body">剩余 01:12:13 结束</text>
				<button class="button" type="primary" @click="switchColor">去参团</button>
			</view>
		</uni-card>
		<uni-card title="商品评论" extra="">
			<view slot="actions" class="card-actions" v-for="team in commentInfoData">
			    <view class="text-content">
			      <image style="width: 30px; height: 30px;" :src="team.images"></image>    
				   评论：{{team.comment}}
				   评论时间： {{team.createTime}}
			    </view>
			</view>
			<view>
			岳：我们都爱美女，大家一起来看美女吧~~~！    ----------------2024-12-1	
			</view>
		</uni-card>
		
		<uni-section title="" type="line">
			<uni-goods-nav @click="onClick" />
		</uni-section>
    </view>
</template>
<script>
	import { getMarketingList,getMarketing,comment,teamList } from '@/api/marketing/marketing'
    export default {
		onLoad: function (option) { //option为object类型，会序列化上个页面传递的参数
				 this.id=option.id //打印出上个页面传递的参数
			},
        data() {
            return {
                isCard: false,
                productList: [],
				current: 0,
				volume: '8.7w+',
				pageView:  '10w+',
				total: '',
				marketingFrom:{
					keyWord:'',
					status:'',
					pageNum:1,
					pageSize:3
				},
				marketingList:[],
				team:{},
				marketingDataFrom:{
					productId:''
				},
				msgType: '',
				msgText: '',
				id: '',
				commentInfoFrom:{
					projectId:''
				},
				commentInfoData:[],
				productId:'',
				teamInfoData:[]
            }
        },
		created() {
		  this.message();
		  
		},
        methods: {
			message(){
				getMarketing(this.id).then(res =>{
				this.marketingDataFrom=res.data
				this.marketingList=res.data.projectSkuInfoAddList
				this.review();
				this.activityTeam()
			})
		},
		review(){
			comment(this.marketingDataFrom.productId).then(res =>{
				this.commentInfoData=res.data.rows
			})
		},
		activityTeam(){
			teamList(this.marketingDataFrom.id).then(res =>{
				this.teamInfoData=res.data
			})
		}
		}
    }
</script>
<style>
    .cu-card.dynamic>.cu-item>.text-content {
        margin-bottom: 1px;
        margin-top: 6px;
    }
	@mixin flex {
			/* #ifndef APP-NVUE */
			display: flex;
			/* #endif */
			flex-direction: row;
		}
	
		@mixin height {
			/* #ifndef APP-NVUE */
			height: 100%;
			/* #endif */
			/* #ifdef APP-NVUE */
			flex: 1;
			/* #endif */
		}
	
		.box {
			@include flex;
		}
	
		.button {
			@include flex;
			align-items: center;
			justify-content: center;
			flex: 1;
			height: 35px;
			margin: 0 5px;
			border-radius: 5px;
		}
	
		.example-body {
			background-color: #fff;
			padding: 10px 0;
		}
	
		.button-text {
			color: #fff;
			font-size: 12px;
		}
	
		.popup-content {
			@include flex;
			align-items: center;
			justify-content: center;
			padding: 15px;
			height: 50px;
			background-color: #fff;
		}
	
		.popup-height {
			@include height;
			width: 200px;
		}
	
		.text {
			font-size: 12px;
			color: #333;
		}
	
		.popup-success {
			color: #fff;
			background-color: #e1f3d8;
		}
	
		.popup-warn {
			color: #fff;
			background-color: #faecd8;
		}
	
		.popup-error {
			color: #fff;
			background-color: #fde2e2;
		}
	
		.popup-info {
			color: #fff;
			background-color: #f2f6fc;
		}
	
		.success-text {
			color: #09bb07;
		}
	
		.warn-text {
			color: #e6a23c;
		}
	
		.error-text {
			color: #f56c6c;
		}
	
		.info-text {
			color: #909399;
		}
	
		.dialog,
		.share {
			/* #ifndef APP-NVUE */
			display: flex;
			/* #endif */
			flex-direction: column;
		}
	
		.dialog-box {
			padding: 10px;
		}
	
		.dialog .button,
		.share .button {
			/* #ifndef APP-NVUE */
			width: 100%;
			/* #endif */
			margin: 0;
			margin-top: 10px;
			padding: 3px 0;
			flex: 1;
		}
	
		.dialog-text {
			font-size: 14px;
			color: #333;
		}
</style>
 
 