Commit 6bdb8baf authored by 慕轻风's avatar 慕轻风

wnf

parent 123367d9
{
"pages": [
"pages/index/index",
"pages/testPage/testPage",
"pages/tbccDemo/tbccDemo",
"pages/myprize/myprize",
"pages/goodsPage/goodsPage"
"pages/collectGoods/collectGoods",
"pages/browseGoods/browseGoods",
"pages/orderGoods/orderGoods",
"pages/endPage/endPage"
],
"window": {
"defaultTitle": "C端模板"
......
......@@ -4,6 +4,7 @@
height: 162rpx;
right: 0;
top: 600rpx;
z-index: 20;
}
.countdown-box-clock {
position: absolute;
......
......@@ -2,7 +2,7 @@
<view a:if="{{task.type == '01'}}"
style="{{{'background':`url(${task.image.title}) no-repeat`,'backgroundSize': '100% 100%'}}}" class="goods-modal-container__title"></view>
<view a:else class="goods-modal-container__banner" style="{{{'background':`url(${task.image.banner}) no-repeat`,'backgroundSize': '100% 100%','height':task.bannerHeight+'rpx'}}}"></view>
<view class="goods-modal-container__content" style="{{{'top':task.type == '02'?task.bannerHeight+'rpx':'149rpx'}}}">
<view class="goods-modal-container__content" style="{{{'top':task.type == '02'?task.bannerHeight+'rpx':'209rpx'}}}">
<scroll-view scroll-y="{{true}}" class="goods-modal-container__scroll">
<view class="goods-modal-container__content-list">
<view class="goods-modal-container__content-item" a:for="{{goodsList}}" a:for-item="item">
......@@ -24,7 +24,4 @@
</view>
</scroll-view>
</view>
<!-- 倒计时 -->
<count-down-modal a:if="{{isShowCountdown && task.taskType == 'browseGoods'}}" percent="{{percent}}" hasPercent="{{(10 - usePercent)}}" styleType="{{'01'}}" />
</view>
\ No newline at end of file
......@@ -3,22 +3,17 @@
*/
const app = getApp();
const { tbcc } = app;
const { openDetail, collectGoods, checkGoodsCollectedStatus } = tbcc.tb;
const { openDetail, collectGoods, checkGoodsCollectedStatus, commonToast } = tbcc.tb;
Component({
mixins: [],
timer: null,
data: {
usePercent: 0, // 已进行的进度条
percent: 0,// 进度条
isShowCountdown: true, // 是否显示倒计时
isFlag: 1
},
props: {
isBackFlag: 0,
goodsList: [1,2,3],
task: {
itemId: '617724147979,617724563528,617300295119,614139753189',
itemId: '617724147979,617724563528,617300295119',
taskType: 'browseGoods',
type: '02',
bannerHeight: 430,
......@@ -32,40 +27,26 @@ Component({
},
color: '#181818'
},
onCompleteTask: () => {}
onCompleteTask: () => {},
onOpenDetail: () => {}
},
didMount() {
const { taskType } = this.props.task
this.setData({ isFlag: this.props.isBackFlag })
console.log(this.props.goodsList)
if(taskType == 'browseGoods') {
this.browseGoodsTimes()
}
},
didUpdate(prevProps,prevData) {
if(prevData.isFlag && prevProps.isBackFlag != prevData.isFlag) {
console.log(3)
if(!this.timer) {
this.setData({ usePercent: this.data.percent })
this.browseGoodsTimes()
console.log(10 - this.usePercent)
}
}
},
didUnmount() {
clearTimeout(this.timer)
},
methods: {
/**
* 跳转商品详情页
*/
async goToGoodsDetail(e) {
clearInterval(this.timer)
this.setData({
percent: this.data.usePercent,
})
const { taskType } = this.props.task
const { itemId } = e.target.dataset.item
if(taskType == 'browseGoods') {
this.props.onOpenDetail(itemId)
}
await openDetail(String(itemId))
},
/**
......@@ -74,29 +55,15 @@ Component({
async goToCollectGoods(e) {
const { itemId, collected } = e.target.dataset.item
const { taskType } = this.props.task
if(collected) return;
let result = await collectGoods(itemId)
if(collected) {
commonToast('您已收藏过该商品了')
return;
}
let result = await collectGoods(+itemId)
if(result) {
this.props.onCompleteTask(taskType, itemId)
}
},
/**
* 浏览商品倒计时
*/
browseGoodsTimes() {
const { taskType } = this.props.task
this.timer = setInterval(() => {
this.setData({
usePercent: this.data.usePercent + 1
}, () => {
if (this.data.usePercent >= 10) {
console.log(this.data.usePercent)
this.props.onCompleteTask(taskType)
clearInterval(this.timer)
}
})
},1000)
}
},
});
......@@ -39,7 +39,7 @@
</view>
</view>
</view>
<view a:if="{{myPrizeList && myPrizeList.length === 0}}" class="my-prize-empty">暂无奖品</view>
<view a:if="{{myPrizeList && myPrizeList.length === 0}}" class="my-prize-empty">{{task.blankTxt}}</view>
</view>
<logistics-modal a:if="{{isLogistic}}" prizeItem="{{currentPrize}}" onCloseModal="closeLogisticModal" task="{{task.logisticsImage}}"/>
</view>
\ No newline at end of file
<view class="goods-page-container">
<goods-modal
isBackFlag="{{isBackFlag}}"
goodsList="{{goodsList}}"
task="{{task}}"
onCompleteTask="onCompleteTask" />
<!-- 倒计时 -->
<count-down-modal a:if="{{isShowCountdown}}" percent="{{percent}}" hasPercent="{{(10 - usePercent)}}" styleType="{{'01'}}" />
</view>
\ No newline at end of file
/**
* 任务类型(taskType): collectGoods 、 orderGoods 、 browseGoods 、exchangeCredits
* task: {
* itemId: //商品ID
* taskType: //任务类型
* type: //头部样式(02——banner,01——标题)
* image: {//图片
* bg: //集合页背景
* banner: //头部banner
* title: //头部title
* collect: //商品以收藏
* no_collect: //商品未收藏
* }
* color: //商品名称:文字颜色
* }
*/
const app = getApp();
const { tbcc } = app;
const { commonToast } = tbcc.tb;
import API from '../../api';
Page({
completeType: '01',//01:浏览完成 02点击任意商品完成
timer: null,
data: {
usePercent: 0, // 已进行的进度条
percent: 0,// 进度条
isShowCountdown: true, // 是否显示倒计时
query: {},
task: {},
goodsList: []
},
onLoad(query) {
this.query = query || {}
this.init()
},
onShow() {
//重新回到页面开启倒计时
if(!this.timer && this.completeType == '01') {
this.setData({ usePercent: this.data.percent })
this.browseGoodsTimes()
console.log(10 - this.usePercent)
}
},
init() {
this.setData({
task: {
taskType: 'browseGoods',
type: '01',
image: {
bg: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_bg@2x.png',
banner: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_banner@2x.png',
title: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_title@2x.png',
collect: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_collection@2x.png',
no_collect: '//yun.duiba.com.cn/taobaomini/clientCTest/collection_no_collect@2x.png',
img: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_img@2x.png',
},
color: '#181818'
}
})
this.initPage()
},
async initPage() {
const { activityId } = app
const { itemIds } = this.query
const { success, data } = await API.getItemListByItemIds({ activityId, itemIds }).catch(res => {
res && commonToast(res)
}) || {}
if(success) {
this.setData({ goodsList: data || [] })
}
},
//任务完成
async onCompleteTask(itemId) {
const { activityId } = app
let browsResult = await API.doBrowseGoodsTask({ activityId, itemId }).catch(res => {
res && commonToast(res)
}) || {}
if(browsResult.success) {
commonToast('任务完成,请到任务中心查看奖励')
}
},
/**
* 跳转商品详情页
*/
onOpenDetail(itemId = '') {
if(this.completeType == '01') {
this.setData({
percent: this.data.usePercent,
}, () => {
clearInterval(this.timer)
})
}
else {
this.onCompleteTask(itemId)
}
},
/**
* 浏览商品倒计时
*/
browseGoodsTimes() {
this.timer = setInterval(() => {
this.setData({
usePercent: this.data.usePercent + 1
}, () => {
if (this.data.usePercent >= 10) {
this.onCompleteTask()
clearInterval(this.timer)
}
})
},1000)
}
});
{
"usingComponents": {
"goods-modal": "/components/goodsModal/goodsModal",
"count-down-modal": "/components/countDownModal/countDownModal"
}
}
\ No newline at end of file
<view class="goodsPage">
<goods-modal
isBackFlag="{{isBackFlag}}"
goodsList="{{goodsList}}"
task="{{task}}"
onCompleteTask="onCompleteTask" />
......
/**
* 任务类型(taskType):collectGoods、 orderGoods 、browseGoods、exchangeCredits
* 任务类型(taskType):collectGoods、 orderGoods 、 browseGoods 、exchangeCredits
* task: {
* itemId: //商品ID
* taskType: //任务类型
......@@ -16,14 +16,13 @@
*/
const app = getApp();
const { tbcc } = app;
const { openDetail, collectGoods, checkGoodsCollectedStatus, commonToast } = tbcc.tb;
const { commonToast } = tbcc.tb;
import API from '../../api';
Page({
data: {
query: {},
task: {},
isBackFlag: 1,
goodsList: []
},
onLoad(query) {
......@@ -31,15 +30,11 @@ Page({
this.init()
},
onShow() {
//重新回到页面开启倒计时
this.setData({ isBackFlag: Math.floor((Math.random() * 100)) == this.data.isBackFlag ? 101 : Math.floor((Math.random() * 100)) })
},
init() {
const { itemId, taskType } = this.query
this.setData({
task: {
itemId,
taskType,
taskType: 'collectGoods',
type: '01',
image: {
bg: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_bg@2x.png',
......@@ -56,38 +51,25 @@ Page({
},
async initPage() {
const { activityId } = app
const { taskType, itemIds } = this.query
const { itemIds } = this.query
let handel = taskType == 'collectGoods' ? 'getCollectItemList' : 'getItemListByItemIds'
const { success, data } = await API[handel]({ activityId, itemIds }).catch(res => {
const { success, data } = await API.getCollectGoodsList({ activityId, itemIds }).catch(res => {
res && commonToast(res)
}) || {}
if(success) {
this.setData({ goodsList: data || [] })
if(!success || success) {
this.setData({ goodsList: data || [] })
}
},
//任务完成
//任务完成 616444374083
async onCompleteTask(taskType,itemId) {
console.log(taskType,itemId)
const { activityId } = app
switch(taskType) {
case 'collectGoods':
let { success, data } = await API.doCollectGoodsTask({ activityId, itemId }).catch(res => {
res && commonToast(res)
}) || {}
if(success) {
this.initPage()
}
break;
case 'browseGoods':
let browsResult = await API.doBrowseGoodsTask({ activityId, itemId }).catch(res => {
res && commonToast(res)
}) || {}
console.log(browsResult)
if(browsResult.success) {
commonToast('任务完成,请到任务中心查看奖励')
}
break;
let { success, data } = await API.doCollectGoodsTask({ activityId, itemId }).catch(res => {
res && commonToast(res)
}) || {}
if(success) {
this.initPage()
}
}
});
<view class="end-page-container">
<end-modal data="{{endData}}" />
</view>
\ No newline at end of file
Page({
data: {
endData: {
image: {
bg: '//yun.dui88.com/taobaomini/clientCTest/end_bg@2x.png',
end_icon: '//yun.dui88.com/taobaomini/clientCTest/end_icon@2x.png',
},
text: '活动未开始'
}
},
onLoad() {},
});
{
"usingComponents": {
"end-modal": "/components/endModal/endModal"
}
}
\ No newline at end of file
......@@ -6,7 +6,7 @@
<view class="index-page__tips">AM接口只支持PC端预览,手机淘宝预览需要使用云函数模式</view>
<view class="index-start-btn" onTap="doStart">开始</view>
<navigator open-type="navigate" url="/pages/tbccDemo/tbccDemo" class="index-tbcc-btn">tbcc demo</navigator>
<navigator style="{{{'marginTop':'16rpx'}}}" open-type="navigate" url="/pages/goodsPage/goodsPage?itemId=617724147979,617724563528&taskType=browseGoods" class="index-tbcc-btn">商品集合页面</navigator>
<navigator style="{{{'marginTop':'16rpx'}}}" open-type="navigate" url="/pages/goodsPage/goodsPage?itemId=617724147979,617724563528" class="index-tbcc-btn">商品集合页面</navigator>
</view>
......
......@@ -18,6 +18,7 @@ Page({
task: {
image: {
bg: '//yun.duiba.com.cn/aurora/assets/e13fab3165d3a6bb4cbe8827e8f0fd41084b0091.png', //背景图
title: '//yun.dui88.com/duiba-components-c-myprizeprize_title.png',//标题
copyIcon: '//yun.dui88.com/duiba-components-c-myprizemyprize_copy_code.png', //复制
addressBth: '//yun.dui88.com/duiba-components-c-myprizeto_address.png', //填写地址(实物奖品)
getBth: '//yun.dui88.com/duiba-components-c-myprizeget_now.png', //立即领取(除实物奖品外)
......@@ -32,6 +33,7 @@ Page({
notShipped: '//yun.dui88.com/duiba-components-c-myprizenotshipped.png', // 待发货物流弹窗
copyIcon: '//yun.dui88.com/duiba-components-c-myprizemyprize_copy_code.png', //复制
},
blankTxt: '暂无奖品',
btnStyle: { // 按钮自定义样式
width: '150rpx',
height: '41rpx',
......
<view class="goodsPage">
<goods-modal
goodsList="{{goodsList}}"
task="{{task}}"
onCompleteTask="onCompleteTask" />
</view>
\ No newline at end of file
/**
* 任务类型(taskType): collectGoods 、 orderGoods 、 browseGoods 、exchangeCredits
* task: {
* itemId: //商品ID
* taskType: //任务类型
* type: //头部样式(02——banner,01——标题)
* image: {//图片
* bg: //集合页背景
* banner: //头部banner
* title: //头部title
* collect: //商品以收藏
* no_collect: //商品未收藏
* }
* color: //商品名称:文字颜色
* }
*/
const app = getApp();
const { tbcc } = app;
const { commonToast } = tbcc.tb;
import API from '../../api';
Page({
data: {
query: {},
task: {},
goodsList: []
},
onLoad(query) {
this.query = query || {}
this.init()
},
onShow() {
},
init() {
this.setData({
task: {
taskType: 'orderGoods',
type: '01',
image: {
bg: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_bg@2x.png',
banner: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_banner@2x.png',
title: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_title@2x.png',
collect: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_collection@2x.png',
no_collect: '//yun.duiba.com.cn/taobaomini/clientCTest/collection_no_collect@2x.png',
img: '//yun.duiba.com.cn/taobaomini/clientCTest/goods_img@2x.png',
},
color: '#181818'
}
})
this.initPage()
},
async initPage() {
const { activityId } = app
const { itemIds } = this.query
const { success, data } = await API.getItemListByItemIds({ activityId, itemIds }).catch(res => {
res && commonToast(res)
}) || {}
if(success) {
this.setData({ goodsList: data || [] })
}
},
});
{
"usingComponents": {
"goods-modal": "/components/goodsModal/goodsModal"
}
}
\ No newline at end of file
.test-page {
text-align: center;
padding: 100rpx 0;
}
\ No newline at end of file
<view class="test-page">
测试跳转页面
</view>
\ No newline at end of file
......@@ -6,7 +6,7 @@ const capi = {
receiveObjectPrize: 'receiveObjectPrize',
receiveEnamePrize: 'receiveEnamePrize',
getItemListByItemIds: 'getItemListByItemIds',
getCollectItemList: 'getCollectItemList',
getCollectGoodsList: 'getCollectGoodsList',
doCollectGoodsTask: 'doCollectGoodsTask',
doBrowseGoodsTask: 'doBrowseGoodsTask',
doJumpLinkTask: 'doJumpLinkTask',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment