2204-ui/pages/marketing/marketingDeatil.vue

236 lines
4.6 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<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>