|
|
<template> <view id="sign"> <view class="sign_head"> <view class="user_picture"> <image :src="userImg" mode="" v-if="userImg"></image> <image v-else src="https://ibrand-miniprogram.oss-cn-hangzhou.aliyuncs.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%A4%B4%E5%83%8F_%E7%94%BB%E6%9D%BF%201.png" /> </view> <view class="sign_message"> <view class="user_name">{{userName}}</view> <view class="user_message"> <view class="fs_12" style="width:100px">积分:{{point}}</view> <view @tap="sign_rule" class="fs_10 activity_rule">活动规则</view> </view> </view> </view> <view class="sign_box"> <view class="sign_body"> <view class="row_first"> <view class="sign_bar_single"></view> <view v-for="(item,index) in rules" :key="index" class="row_box"> <view :class="days < 7 ?'sign_bar':'sign_afterBar'" v-if="index ==7"></view> <view :class="days < 14 ?'sign_bar':'sign_afterBar'" v-if="index == 14"></view> <view style="width:57.5rpx;position:relative"> <view class="sign_gift" v-if="index == 6 || index == 13 || index == 20" @tap='getGift'> <view class="angel"></view> <image src="../../../static/gift.png"/> </view> <view :class="index+1>days ?'sign_point_false':'sign_point'"> <text>+{{item}}</text> </view> <view class="iconfont icon-check-circle signed_today" v-if="is_sign && days==index+1"></view> <view class="sign_day">第{{item}}天</view> </view> <view :class="index+1>days ?'sign_bar':'sign_afterBar'" v-if="index<20"></view> </view> </view> <view class="signed_days color" v-if="!is_sign" @tap="sign">今日签到 </view> <view class="signed_days" v-if="is_sign">已连续签到 <text>{{days}}</text> 天 </view> <view class="sign_data"> <view @tap="signData">签到记录 </view> <view style="margin-left:6rpx">></view><text class="arrows" style="padding-left:5px">></text> </view> </view> </view> <view class="image_box"> <view :class="'img'+index" v-for="(item,index) in microData.data.pages" :key="index" :style="'background:'+item.meta.background_color"> <image :src="item.value[0].image" mode="aspectFit" v-if="index!=2 && index!==4" /> <image :src="item.value[0].image" mode="aspectFit" v-if="index==2 && index!==4" /> <view v-if="index==4"> <indexGrouping :grouping-data="item.value" :meta="item.meta"></indexGrouping> </view> </view> </view> <view class="mask_form" v-if="show" @tap="close" catchtouchmove="true"> <view class="rule_box"> <text class="mask" decode="decode"> {{rule}} </text> <view bindtap="close" class="close_rule"> <i class="iconfont icon-close"></i> </view> </view> </view> </view></template>
<script> var app = getApp(); import {pageLogin, getUrl} from '@/common/js/utils.js'; import indexGrouping from "@/components/index-grouping/index-grouping.vue" export default { data() { return { point: '', text: "This is page data", signId: '', action: [], recommend_goods: [], days:0, nodes: '', microData:{ data:{ pages:[] } }, index: 0, userImg: '', userName: '', rule: '', show:false, rules:[], is_sign:'' }; }, components:{ indexGrouping }, watch:{ microData:{ deep:true, handler(val){ this.microData=val } } }, methods:{ // 签到
sign(){ wx.showLoading({ title: '正在签到', mask: true }); this.$http.post({ api: "api/sign/doSign", data: { sign_id: this.signId }, header: { Authorization: this.$cookieStorage.get('user_token') }, }).then(res => { if (res.statusCode == 200) { res = res.data; if (res.status) { wx.showModal({ content: res.data.message || "签到成功", showCancel: false, success: res => { if (res.confirm || (!res.cancel && !res.confirm)) { this.record(); //签到成功重新请求数据
} } }) } else { wx.showModal({ content: res.message || '签到失败', showCancel: false }) } } else { wx.showModal({ content: res.message || "请求失败", showCancel: false }) } wx.hideLoading(); }).catch(res => { wx.hideLoading(); wx.showModal({ content: '请求失败', showCancel: false }) }) }, // 签到记录
signData() { wx.navigateTo({ url: "/pages/user/signData/signData" }) }, record() { this.$http.get({ api: 'api/sign/getSignReward', header: { Authorization: this.$cookieStorage.get('user_token') } }).then(res => { if (res.statusCode == 200) { this.point= res.data.data.point, this.signId=res.data.data.sign.id, this.action=res.data.data.sign.action, //数组
this.rules= res.data.data.sign.rules, this.recommend_goods= res.data.data.sign.recommend_goods, this.days= res.data.data.sign.days, //修改item
this.nodes= res.data.data.sign.rule_desc, this.is_sign= res.data.data.is_sign, this.rule= res.data.data.sign_rule console.log("signId",this.signId) } }).catch(rej => { console.log(rej); }) this.userImg= this.$cookieStorage.get('userInfoImg'), this.userName= this.$cookieStorage.get('userInfoName') wx.hideLoading() }, // 礼物
getGift() { console.log("gift"); }, integral() { this.$http.get({ api: 'api/micro/page/Integral?name=Integral', }).then(res => { if (res.statusCode == 200) { this.microData=res.data console.log("microData.data.pages",this.microData.data.pages) console.log("this.microData",this.microData) } }).catch(rej => { console.log(rej); }) }, // 签到规则
sign_rule() { this.show=true; }, close(){ this.show=false; }, }, // onLoad: function() {
// wx.showLoading({
// title: "加载中",
// mask: true
// });
// this.record()
// },
created() { this.record() }, onShow: function() { this.integral() } }</script>
<style lang="less"> @import "sign.less";</style>
|