吴亚瑞 / basicEnglish · 提交

转到一个项目

作者 xuyangjie
提交 51d4126c24d5d10ec8648f2c683e2bd8727e6948 1 个父辈 e713d436

补卡任务对接

内嵌 并排对比
正在显示 4 个修改的文件 包含 258 行增加 和 7 行删除
// pages/eight/eight.js
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
sbox: [{
data_arr:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],//周
year:"",//当前年
month:"",//当前月份
today:'',//当前选中的日期
fixed_today:'',//当前日期
sbox: [{ // 打卡任务列表
img: '/img/ic_date_dangri@2x.png',
text: '当日任务',
bool: true
... ... @@ -22,7 +28,8 @@ Page({
}
]
},
gotoday(){
gotoday(e){
var data = e.currentTarget.dataset.id;
wx.redirectTo({
url: '/pages/mission/mission',
})
... ... @@ -41,9 +48,95 @@ Page({
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let now = new Date()//获取年
let year = now.getFullYear()//获取月
let today = now.getDate()//获取月
let fixed_today = now.getDate()//获取月
// month获取是从 0~11
let month = now.getMonth() + 1
this.setData({
year,month,today,
fixed_today
})
this.showCalendar()
this.DayList()
},
showCalendar(){
let {year,month} = this.data
//以下两个month已经+1
let currentMonthDays = new Date(year,month,0).getDate() //获取当前月份的天数
let calendar = []
// for(var i=1;i <= currentMonthDays; i++){
// ({
// "date": i, //日期
// "TodayStatus": null, //今日任务状态 打卡类型:2=未打卡,1=正常打卡,0=补卡 null是没有今日任务
// "TodayId": null,//今日任务ID null是没有今日任务 用于今日任务状态未未打卡状态时 去补卡
// "MatchId": null, //比赛任务ID 用户判断当日是否有比赛任务 null未没有 不为空 则有
// "EvaluationId": null //测评任务ID 用户判断当日是否有测评任务 null未没有 不为空 则有
// })
// }
let startWeek = new Date(year + '/' + month + '/' + 1).getDay(); //本月第一天是从星期几开始的
this.setData({
currentMonthDays,startWeek,calendar
})
},
DayList(){
var that = this;
var month = this.data.year + '-' + this.data.month
app.post("index/DayList", {month}).then(res => {
if(res.code == 1){
//打卡 补卡状态
let calendar = []
//相应日期的任务列表
var sbox = [];
res.data.forEach((val,ind) => {
//打卡 补卡状态判断
if(val.TodayStatus == 1){
val.clock = 'clock';//正常打卡
}else if(val.TodayStatus == 0){
val.clock = 'no_clock';//缺卡
}else{
val.clock = ''
}
val.day = ind+1;
calendar.push(val)
//相应日期的任务列表判断
if(val.day == this.data.today){
if(val.TodayId){
sbox.push({
img: '/img/ic_date_dangri@2x.png',
text: '当日任务',
id:val.TodayId
})
}
if(val.MatchId){
sbox.push({
img: '/img/ic_date_dangri@2x.png',
text: '比赛任务',
id:val.MatchId
})
}
if(val.EvaluationId){
sbox.push({
img: '/img/ic_date_dangri@2x.png',
text: '测评任务',
id:val.EvaluationId
})
}
}
})
that.setData({
calendar,
sbox
})
}
}).catch(err => {
wx.showToast({
title: err.msg,
icon: 'none'
})
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
... ... @@ -91,5 +184,39 @@ Page({
*/
onShareAppMessage: function () {
},
//切换日期 打卡任务
handoffDate(e){
let sbox = []
var data = e.currentTarget.dataset.item;
if(this.data.fixed_today < data.day){
return
}
if(data.TodayId){
sbox.push({
img: '/img/ic_date_dangri@2x.png',
text: '当日任务',
id:data.TodayId
})
}
if(data.MatchId){
sbox.push({
img: '/img/ic_date_dangri@2x.png',
text: '比赛任务',
id:data.MatchId
})
}
if(data.EvaluationId){
sbox.push({
img: '/img/ic_date_dangri@2x.png',
text: '测评任务',
id:data.EvaluationId
})
}
this.setData({
today:data.day,
sbox
})
}
})
\ No newline at end of file
... ...
<view>日历组件</view>
<view class="context">
<!-- 当前月份 -->
<view class="top">
<view>{{year}}年{{month}}月</view>
</view>
<!-- 周 -->
<view class="middle">
<view wx:for="{{data_arr}}" wx:key="index" class="middle_num">
{{item}}
</view>
</view>
<!-- 日期 -->
<view class="calen">
<view wx:for="{{startWeek}}" wx:key="index" class="calen_blank"></view>
<view wx:for="{{calendar}}"
bindtap="handoffDate"
data-item="{{item}}"
class='{{index+1 == today ? "active": "calen_num"}}'
wx:key="index">
<text class="{{item.day > fixed_today ? 'today_after' : ''}}">{{item.day}}</text>
<view class="{{item.clock}}">
</view>
</view>
</view>
</view>
<view class="line" wx:for="{{sbox}}" wx:key="id">
<view style="display:flex;flex:1;align-items:center">
<image src="{{item.img}}"></image>
<view>{{item.text}}</view>
</view>
<view bindtap="dianji" data-bool="{{item.bool}}" data-index="{{index}}">
<view class="{{item.bool?'buka':' buka yibuka'}}" bindtap="gotoday">{{item.bool?'打卡':'已打卡'}}</view>
<view bindtap="dianji" data-id="{{item.id}}" data-index="{{index}}">
<view class="buka" bindtap="gotoday">打卡</view>
</view>
<!-- <view bindtap="dianji" data-bool="{{item.bool}}" data-index="{{index}}">
<view class="{{item.bool?'buka':' buka yibuka'}}" bindtap="gotoday">{{item.bool?'打卡':'已打卡'}}</view>
</view> -->
</view>
\ No newline at end of file
... ...
page {
background: #f8f8f8;
padding-bottom: 100rpx;
}
.line {
... ... @@ -14,6 +15,7 @@ page {
margin-top: 24rpx;
border-radius: 32rpx;
align-items: center;
padding: 0 32rpx;
}
/* .line view:first-child {
... ... @@ -40,3 +42,90 @@ page {
background: rgb(189, 187, 187);
color: #fff;
}
/* 日历样式 */
.context{
width: 100%;
background-color: #fff;
margin: 0 auto;
}
.top{
height: 80rpx;
display: flex;
justify-content: space-around;
}
.top image{
height: 30rpx;
width: 30rpx;
}
.top view{
font-size: 28rpx;
}
.middle{
display: flex;
padding: 14rpx 18rpx;
box-shadow: 0rpx 20rpx 20rpx rgb(238, 238, 238);
}
.middle_num{
width: 107rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 24rpx;
}
.calen{
display: flex;
/* height: 480rpx; */
padding: 18rpx 18rpx;
flex-wrap: wrap; /* 必要的时候拆行或拆列。 */
}
.calen_blank{
width: 102rpx;
height: 102rpx;
/* background-color: pink; */
}
.calen_num{
width: 102rpx;
height: 102rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 32rpx;
}
.active{
background-color: #FFFAEF;
width: 102rpx;
height: 102rpx;
display: flex;
justify-content: center;
align-items: center;
border-radius: 40rpx;
border: 1rpx solid #FFC83D;
}
.clock{
width: 8rpx;
height: 8rpx;
opacity: 1;
border-radius: 50%;
background: rgba(255,200.09,61.2,1)
}
.no_clock{
width: 8rpx;
height: 8rpx;
opacity: 1;
border-radius: 50%;
background: rgba(139,139,141,1)
}
.calen>view{
position: relative;
}
.calen>view>view{
position: absolute;
bottom: 20rpx;
left: 50%;
margin-left: -4rpx;
}
.today_after{
color: #C4C4C4;
}
\ No newline at end of file
... ...
... ... @@ -551,6 +551,12 @@
"pathName": "pages/requre/requre",
"query": "goods_data=%7B%22goods_id%22%3A3%2C%22image%22%3A%22http%3A%2F%2Fenglish.brofirst.cn%2Fuploads%2F20210715%2F8bb3479d5444f4c45de0ae8e449a2b9d.png%22%2C%22title%22%3A%22%E9%98%BF%E8%8B%A5%E6%8B%89%E9%A3%9E%E6%9C%BA%22%2C%22number%22%3A10%7D",
"scene": null
},
{
"name": "pages/eight/eight",
"pathName": "pages/eight/eight",
"query": "",
"scene": null
}
]
}
... ...