Skip to content

dev / marubi-wish-list-mp

Go to a project
Toggle navigation
Toggle navigation pinning
2d06ff22 by simon
Options

版本提交

1 parent 6ea0086f
Inline Side-by-side
Showing 14 changed files with 287 additions and 38 deletions
......@@ -23,7 +23,8 @@ App({
userInfo: null,
wxcode: store.getItem("wxcode"),
tlMemberCode: "",
curCoupon: null
curCoupon: null,
questionResult:null,//答题的结果 弹力值 elasticValue
},
// 获取用户基本信息
queryIndex() {
......
......@@ -5,6 +5,18 @@ Component({
innerText: {
type: String,
value: 'default value',
},
eleList: {
type: Object,
value: [],
},
eleVal: {
type: Number,
value: 0,
},
wishBillInfo:{
type: Object,
value: {},
}
},
data: {
......@@ -26,7 +38,7 @@ Component({
},
toMyWishHandler() {
app.router.push({
openType: "reLaunchs",
openType: "reLaunch",
path: "wish"
})
}
......
......@@ -5,7 +5,7 @@
<view class="tit">· 太棒了 ·</view>
<view class="tips">
共获得
<span class="val">100</span>
<span class="val">{{eleVal}}</span>
弹力值
</view>
<!-- 心愿容器 -->
......
......@@ -22,6 +22,12 @@ Component({
this.triggerEvent('evtcomp', {
name: "_evt_hide_mask"
});
},
// 摇一摇
onShakeHandler() {
this.triggerEvent('evtcomp', {
name: "_evt_shake"
});
}
}
})
......
<view class="comp-item">
<image class="bg" src="../../image/oss/tips/tips-shake.png" mode="widthFix" />
<image bindtap="onShakeHandler" class="bg" src="../../image/oss/tips/tips-shake.png" mode="widthFix" />
<!-- <view class="space1"></view>
<view bindtap="hideMask" class="btn">知道了</view> -->
</view>
......
let app = getApp();
Component({
properties: {
// 这里定义了innerText属性，属性值可以在组件使用时指定
......@@ -31,6 +32,7 @@ Component({
name: "_evt_hide_mask"
});
},
// 马上创建
onCreateHandler(){
this.triggerEvent('evtcomp', {
name: "_evt_create_wish"
......
......@@ -15,17 +15,26 @@ Page({
tipsNewMemberVisible: false,
tipsWishVisible: false,
tipsShakeVisible: false,
tipsCreateCompleteVisible: false,
tipsCommonVisible: false,
tipsCreateCompleteVisible: false,
tipsInnerText: "",
curStatus: 1, // 当前场景
candidate: [], // 心愿候选列表
myWishList: [], // 我的心愿列表
valElasticTotal: 0, // 心愿单累计需要弹力值
taskTotalElasticValue: 0, // 任务分
wishBillInfo: {}, // 生成的心愿单
curWish: {}, // 当前选择心愿
userInfo: {}
userInfo: {},
isPageVisible: false,
},
onShareAppMessage() {},
onShow() {
this.isPageVisible = true;
},
onHide() {
this.isPageVisible = false;
},
onLoad(options) {
console.log("cwish------");
this.initData();
......@@ -43,8 +52,28 @@ Page({
})
this.queryWishbillPrizeCandidate();
});
this.initShake();
},
// 添加摇一摇
initShake() {
let _this = this;
wx.onAccelerometerChange(function (res) {
if (this.data.isPageVisible && this.data.isPageVisible) {
if (res.x > 2) { //偏移量为2时触发，有的使用1
wx.showModal({
title: '提示',
content: '触发摇一摇',
success: res => {
_this.setData({
tipsShakeVisible: false,
tipsCreateCompleteVisible: true
})
}
})
}
}
});
},
/**
* 提交前判断状态
* 判断顺序
......@@ -113,7 +142,6 @@ Page({
myWishList.forEach(element => {
valElasticTotal += element.conditionElasticValue
});
this.setData({
tipsWishVisible: true,
valElasticTotal: valElasticTotal
......@@ -121,16 +149,20 @@ Page({
console.log("wish:", this.data.myWishList);
}).catch((err) => {});;
},
// billCode
// 创建心愿单
/**
* 创建心愿单 prizeDefineCode
* 创建完毕后
*
* -新会员
* 1.请求创建表单 设置 wishBillInfo
* 2.显示心愿单完成
* -老会员
* 1.请求创建表单
* 2.显示摇一摇提示页面， 摇手机后，调用自我助力接口 设置 wishBillInfo
* 3.显示心愿单完成
*/
queryWishbillCreate() {
console.log("queryWishbillCreate");
// let myWishList = this.data.candidate;
// console.log("this.data.candidate:",this.data.candidate);
// console.log("myWishList:",myWishList);
// let myWishList = this.data.myWishList;
let myWishList = this.data.candidate[0].products;
let myWishList = this.data.myWishList
let wishBillCodeList = [];
myWishList.forEach(element => {
wishBillCodeList.push(element.prizeDefineCode);
......@@ -138,10 +170,26 @@ Page({
console.log("wishBillCodeList:", wishBillCodeList);
app.post({
url: app.api.wishbillCreate,
data: ["ee3e985407fd40abb22b5f75f0f489a1", "5e46119a5ad04649815b7c0171fd7e9a", "1301a7070b57433986a12ee982103b71"]
data: wishBillCodeList,
}).then((result) => {
console.log("创建成功")
console.log("result:", result);
if (app.globalData.indexInfo.isNewMember == 1) {
// 新会员
this.setData({
tipsCreateCompleteVisible: true,
wishBillInfo: result
})
} else {
// 老会员，自动助力，出提示页面
app.post({
url: app.api.selfAssist,
data: {}
}).then((result2) => {
this.setData({
tipsShakeVisible: true,
wishBillInfo: result2
})
})
}
}).catch((err) => {
console.log("err:", err);
});
......@@ -272,15 +320,8 @@ Page({
});
});
},
// 子组件事件
evtcomp(evt) {
let {
name,
data
} = evt.detail;
switch (name) {
// 隐藏蒙层
case "_evt_hide_mask":
// 隐藏所有蒙层
hideMask() {
this.setData({
ruleTipsVisible: false,
tipsGroupMemberVisible: false,
......@@ -290,14 +331,33 @@ Page({
tipsCreateCompleteVisible: false,
tipsCommonVisible: false
})
},
// 子组件事件
evtcomp(evt) {
let {
name,
data
} = evt.detail;
switch (name) {
// 隐藏蒙层
case "_evt_hide_mask":
this.hideMask();
break;
// 创建心愿单
case "_evt_create_wish":
this.hideMask();
this.queryWishbillCreate();
break;
// 模拟摇一摇
case "_evt_shake":
this.setData({
tipsWishVisible: false
tipsShakeVisible: false,
tipsCreateCompleteVisible: true
})
this.queryWishbillCreate();
break;
default:
......
......@@ -71,7 +71,7 @@
<tips-shake-comp bind:evtcomp="evtcomp"></tips-shake-comp>
</van-popup>
<van-popup show="{{ tipsCreateCompleteVisible }}">
<tips-create-complete-comp bind:evtcomp="evtcomp"></tips-create-complete-comp>
<tips-create-complete-comp bind:evtcomp="evtcomp" wish-list="{{myWishList}}" ele-val="{{taskTotalElasticValue}}" wish-bill-info="{{wishBillInfo}}"></tips-create-complete-comp>
</van-popup>
<van-popup show="{{ tipsCommonVisible }}">
<tips-common-comp bind:evtcomp="evtcomp" inner-text="{{tipsInnerText}}"></tips-common-comp>
......
......@@ -16,9 +16,15 @@ Page({
},
// 开始互动游戏
onStartHandler() {
let {
wishBillCode
} = app.globalData.indexInfo;
let path = "createWish";
if (wishBillCode) {
path = "wish"
}
app.router.push({
path: "createWish"
path: path
})
},
// 显示规则页面
......
......@@ -11,7 +11,8 @@
<view class="content">
<view class="coupon">
<view wx:for="{{prizeInfo}}" wx:key="{{index}}" class="coupon-item {{item.type==4?'coupon-item2':''}}">
<image class="ebg" mode="widthFix" src="../../image/oss/coupon/coupon-1.png" />
<image wx:if="{{item.type==4}}" class="ebg" mode="widthFix" src="../../image/oss/coupon/coupon-2.png" />
<image wx:else class="ebg" mode="widthFix" src="../../image/oss/coupon/coupon-1.png" />
<view class="cont">
<view class="name">{{item.name}}</view>
<view bindtap="onShowDetailHandler" data-data="{{item}}" class="detail">查看详情</view>
......
......@@ -4,6 +4,7 @@ Page({
tipsRuleVisible: false,
userInfo: {},
wishInfo: {},
wishList: [],
helperInfo: {}
},
onShareAppMessage() {},
......@@ -19,6 +20,18 @@ Page({
this.queryWishbillHelpers();
})
},
/**
* 领取我的奖品
*/
onGetGiftHandler(evt) {
},
/**
* 查看我的奖品
*/
onCheckGiftHandler(evt) {
},
// 显示规则页面
onShowRuleHandler() {
this.setData({
......@@ -57,7 +70,8 @@ Page({
}
}).then((result) => {
this.setData({
wishInfo: result
wishInfo: result,
wishList: result.wishGifts
})
})
});
......
......@@ -98,6 +98,120 @@
}
}
// 奖品
.wish {
margin: 0 auto 0;
position: relative;
width: 630px;
&-item {
position: relative;
display: flex;
justify-content: space-between;
height: 124px;
padding: 30px 0;
border-bottom: solid 1px #dadada;
.display {
position: relative;
width: 124px;
height: 124px;
border-radius: 62px;
background-image: radial-gradient(circle at 0 0, #ffffff, #f2e6e6);
@extend .fcc;
.prod {
max-width: 200px;
max-height: 200px;
}
}
.mid {
display: flex;
flex: 1;
// background-color: wheat;
flex-wrap: wrap;
padding: 0 20px;
@extend .bb;
.name {
color: #333333;
font-size: 28px;
@include ellipsis(2);
}
.progress {
display: flex;
align-items: flex-end;
align-self: flex-end;
$proWidth: 220px;
.pro {
width: $proWidth;
position: relative;
.flag {
position: absolute;
left: 0px;
bottom: 6px;
color: #a97a4b;
font-size: 16px;
width: 51px;
height: 30px;
image {
position: absolute;
width: 51px;
height: 30px;
}
.t1 {
position: relative;
text-align: center;
width: 51px;
padding-top: 2px;
}
}
.line {
width: $proWidth;
height: 4px;
background-color: #dcdcdc;
&-thumb {
// width: $proWidth;
height: 4px;
background-color: #ba3038;
}
}
}
.val {
font-size: 20px;
color: #999999;
padding-left: 8px;
}
}
}
.btn {
@include cb(180px, 60px);
align-self: center;
font-size: 28px;
}
.disable{
background: transparent;
background-color: #d2d2d2;
}
}
&-item2 {
border-bottom: none;
}
}
// 海报按钮
.poster-btn {
position: absolute;
......@@ -149,15 +263,18 @@
// margin: 12px 0;
margin-bottom: 20px;
text-align: left;
.t1{
.t1 {
color: #af435a;
}
}
.empty{
.empty {
text-align: center;
padding-top: 80px;
color: #333333;
font-size: 24px;
}
}
}
......
......@@ -20,6 +20,34 @@
<view class="number">{{wishInfo.member.mobile}}</view>
<view bindtap="onMyCardHandler" class="mycard">我的卡券</view>
</view>
<!-- jiangp1 -->
<view class="wish">
<view wx:for="{{wishList}}" wx:key="{{index}}" class="wish-item">
<view class="display">
<image class="prod" mode="aspectFit" src="../../image/prize/prize-3.png" />
</view>
<view class="mid">
<view class="name">{{item.prizeName}}</view>
<view class="progress">
<view class="pro">
<view class="flag" style="left:{{(item.elasticValue/item.conditionElasticValue) * 220 - 51}}rpx;">
<image class="prod" mode="aspectFit" src="../../image/oss/my-wish/my-wish-c4.png" />
<view class="t1">{{item.elasticValue}}</view>
</view>
<view class="line">
<view class="line-thumb" style="width:{{item.elasticValue/item.conditionElasticValue}}%;"></view>
</view>
</view>
<view class="val">{{item.conditionElasticValue}}</view>
</view>
</view>
<view wx:if="{{item.accessStatus == 0}}" class="btn disable">
弹力充值中
</view>
<view bindtap="onGetGiftHandler" wx:if="{{item.accessStatus == 1}}" class="btn">马上领取</view>
<view bindtap="onCheckGiftHandler" wx:if="{{item.accessStatus == 2}}" class="btn">已领取</view>
</view>
</view>
<view bindtap="onCreatePosterHandler" class="poster-btn">生成海报</view>
</view>
<!-- 协作 -->
......@@ -39,7 +67,9 @@
<span class="t1">{{item.elasticValue}}</span>
弹力值！
</view>
<view class="empty" wx:if="{{helperInfo.helpers.length <= 0}}">还没有好友助力，马上让她们帮你实现愿望吧！</view>
<view class="empty" wx:if="{{helperInfo.helpers.length <= 0}}">
还没有好友助力，马上让她们帮你实现愿望吧！
</view>
</scroll-view>
</view>
<view class="btn-wrap">
......