打卡的积分

This commit is contained in:
shijingjing
2023-03-29 15:13:38 +08:00
parent 8a687ede4a
commit 10b0acdc5f
2 changed files with 272 additions and 41 deletions

View File

@@ -4,7 +4,7 @@
<img src="https://cdn.cunwuyun.cn/fengdu/img-jifenlist.png" alt="">
</div>
<div class="title">任务大厅</div>
<div class="card-list">
<div class="card-list" v-if="list.length">
<div class="card" v-for="(item,index) in list" :key="index" @click="$linkTo('./taskDetail?id='+item.id)">
<h4>{{ item.title }}</h4>
<p>{{ item.detail }}</p>
@@ -12,12 +12,12 @@
<image mode="aspectFill" v-for="(e, i) in item.files" :key="i" :src="e.url"/>
</div>
<div class="time">
<div class="goin">
<div class="goin" v-if="item.intoBegintime && item.intoEndtime">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-jinchangshijian.png" alt="">
<div class="label">进场时间</div>
<div class="value">{{ item.intoBegintime.substring(0, 16)}} {{ item.intoEndtime.substring(0, 16) }}</div>
</div>
<div class="exit">
<div class="exit" v-if="item.exitBegintime && item.exitEndtime">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-lichangshijian.png" alt="">
<div class="label">离场时间</div>
<div class="value">{{ item.exitBegintime.substring(0, 16) }} {{ item.exitEndtime.substring(0, 16) }}</div>
@@ -25,11 +25,12 @@
<div class="type">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-renwuleixing.png" alt="">
<div class="label">任务类型</div>
<div class="value">{{ item.type==0? '打卡得积分':'报名得积分' }}</div>
<div class="value">{{ $dict.getLabel('fdIntegralTaskType', item.type) }}</div>
</div>
</div>
</div>
</div>
<AiEmpty :description="`暂无任务`" class="emptyWrap" v-else/>
</div>
</template>
@@ -44,7 +45,7 @@ export default {
},
methods: {
getList() {
this.$instance.post('/app/appintegraltask/list').then(res=> {
this.$instance.post('/app/appintegraltask/list?status=1').then(res=> {
if(res?.data) {
this.list = res.data.records
}
@@ -55,7 +56,9 @@ export default {
uni.setNavigationBarTitle({
title: '功德银行'
});
this.getList()
this.$dict.load(['fdIntegralTaskType']).then(() => {
this.getList()
})
},
}
</script>

View File

@@ -1,11 +1,10 @@
<template>
<div class="taskDetail">
<div class="task">
<h4>10月31日线下公益宣传</h4>
<p>百年征和波澜壮阔百年初心历争议弥坚7月1日上午庆祝中国共产党成立100周年在国务院举办午
祝中国共产党成立100周年在国务院举办午庆祝中</p>
<div class="imgs" v-for="(item, index) in info.annexs" :key="index">
<!-- <img :src="item.annexFile.url" mode="aspectFill" @click="preview(info.annexs, item.annexFile.url)" /> -->
<h4>{{ info.title }}</h4>
<p>{{ info.detail }}</p>
<div class="imgs" v-if="info.files">
<image :src="item.url" v-for="(item, index) in info.files" :key="index" mode="aspectFill" @click="preview(item.url)" />
</div>
</div>
@@ -15,7 +14,7 @@
<img src="https://cdn.cunwuyun.cn/fengdu/ic-dizhi.png" alt="">
<div class="items-info">
<label>活动地点</label>
<div class="value">丰都县金牛区XXXX大厦XXX楼2101</div>
<div class="value">{{ info.address }}</div>
</div>
<div class="address" @click="toAddress">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-daohang.png" alt="">
@@ -26,45 +25,116 @@
<img src="https://cdn.cunwuyun.cn/fengdu/ic-renwuleixing.png" alt="">
<div class="item-info">
<label>任务类型</label>
<div class="value">报名得积分</div>
<div class="value">{{ $dict.getLabel('fdIntegralTaskType', info.type) }}</div>
</div>
</div>
<div class="item">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-jinchangshijian.png" alt="">
<div class="item-info">
<div class="item-info" v-if="info.intoBegintime && info.intoEndtime">
<label>进场时间</label>
<div class="value">2020-12-11 10:10 2020-12-11 10:10</div>
<div class="value">{{ info.intoBegintime.substring(0, 16) }} {{ info.intoEndtime.substring(0, 16) }}</div>
</div>
</div>
<div class="item">
<img src="https://cdn.cunwuyun.cn/fengdu/ic-lichangshijian.png" alt="">
<div class="item-info">
<div class="item-info" v-if="info.exitBegintime && info.exitEndtime">
<label>离场时间</label>
<div class="value">2020-12-11 10:10 2020-12-11 10:10</div>
<div class="value">{{ info.exitBegintime.substring(0, 16) }} {{ info.exitEndtime.substring(0, 16) }}</div>
</div>
</div>
</div>
<!-- <div class="btn-wrapper">
<div class="btn" @click="toReport" hover-class="text-hover">报名得积分/积分+5,已报名</div>
</div> -->
<div class="btn-clock">
<div class="btn-circle" @click="toReport" hover-class="text-hover">
<div class="daka">打卡签到</div>
<div class="text">积分+5</div>
<div class="btn-wrapper" v-if="info.type==1">
<!-- , -->
<div class="btn" @click="signUp" hover-class="text-hover">
<span>报名得积分/积分+{{ info.enrollIntegral }}</span>
<!-- <span>已报名</span> -->
</div>
<div class="tips">符合打卡条件,未到打卡时间,无法重复打卡</div>
</div>
<div class="btn-clock" v-if="info.type == 0">
<div class="btn-circle" @click="clockIn" hover-class="text-hover" :class="isClock== 0? 'gray': isClock==3? 'gray': isClock== 2? 'opacity':''">
<div class="daka">打卡签到</div>
<div class="text" v-if="isClock==1">积分+{{ intoIntegral }}</div>
</div>
<div class="tips">{{ scope }}</div>
</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
name: "taskDetail",
appName: "任务详情",
data() {
return {
info: {},
id: ''
id: '',
latitude: '',
longitude: '',
address: '',
qqmapsdk: null,
distance: 100,
flag: false,
}
},
computed: {
...mapState(['user']),
intoIntegral() {
const times = new Date().getTime()
const inSTimes = new Date(this.info.intoBegintime?.replaceAll('-', '/')).getTime()
const inETimes = new Date(this.info.intoEndtime?.replaceAll('-', '/')).getTime()
const outSTimes = new Date(this.info.exitBegintime?.replaceAll('-', '/')).getTime()
const outETimes = new Date(this.info.exitEndtime?.replaceAll('-', '/')).getTime()
if (times > inSTimes && times < inETimes) {
return this.info.intoIntegral
}
if (times > outSTimes && times < outETimes) {
return this.info.exitIntegral
}
return 0
},
isClock() {
const times = new Date().getTime()
const inSTimes = new Date(this.info.intoBegintime?.replaceAll('-', '/')).getTime()
const inETimes = new Date(this.info.intoEndtime?.replaceAll('-', '/')).getTime()
const outSTimes = new Date(this.info.exitBegintime?.replaceAll('-', '/')).getTime()
const outETimes = new Date(this.info.exitEndtime?.replaceAll('-', '/')).getTime()
// 不符合条件(任务未开始、已经结束..)
if (times < inSTimes || times > outETimes || (inETimes < times && times < outSTimes)) {
return 0
}
// 在打卡范围内未打卡
if (this.info.clockRange > this.distance && (!this.info.intoClock && (inSTimes < times && times < inETimes)) || !this.info.exitClock && (outSTimes < times && times < outETimes)) {
return 1
}
// 已打卡(打卡距离内 && 打卡时间内)
if(this.info.clockRange > this.distance && (this.info.intoClock && (inSTimes < times && times < inETimes)) || (this.info.exitClock && outSTimes < times && times < outETimes)) {
return 2
}
// 没在指定范围
if(this.distance > this.info.clockRange) {
return 3
}
},
scope() {
const times = new Date().getTime()
const inSTimes = new Date(this.info.intoBegintime?.replaceAll('-', '/')).getTime() // 进场开始
const inETimes = new Date(this.info.intoEndtime?.replaceAll('-', '/')).getTime() // 进场结束
const outSTimes = new Date(this.info.exitBegintime?.replaceAll('-', '/')).getTime() // 离场开始
const outETimes = new Date(this.info.exitEndtime?.replaceAll('-', '/')).getTime() // 离场结束
if (this.info.clockRange > this.distance && (this.info.intoClock && (inSTimes < times && times < inETimes)) || (this.info.exitClock && outSTimes < times && times < outETimes)) {
return `无法重复打卡`
}
if (this.info.clockRange > this.distance && (!this.info.intoClock && (times > inSTimes && times < inETimes)) || !this.info.exitClock && (times > outSTimes && times < outETimes)) {
return `符合打卡条件`
}
return `未到打卡时间/不在指定位置`
}
},
methods: {
@@ -75,19 +145,157 @@ export default {
scale: 18
})
},
// preview(url) {
// uni.previewImage({
// urls: this.info.checkPhoto.map(v => v.url),
// current: url
// })
// },
preview(url) {
uni.previewImage({
urls: this.info.files.map(v => v.url),
current: url
})
},
getDetail() {
this.$instance.post(`/app/appintegraltask/queryDetailById?id=${this.id}`).then(res=> {
if(res?.data) {
console.log(res);
this.info = res.data
this.$nextTick(() => {
this.getLocation()
})
}
})
}
},
// 打卡积分
clockIn() {
if(!this.user.idNumber) {
return this.$dialog.confirm({
content: '您只有完成信息认证后,才可进行相关操作。',
confirmText: '去认证'
}).then(() => {
this.$linkTo('/mods/AppMine/userInfo')
}).catch(() => {
})
}
if (!this.latitude) {
this.$dialog.alert({
title: '温馨提示',
content: '您未授权定位,请先授权!'
}).then(() => {
this.getLocation()
}).catch(() => {
})
return false
}
if (this.isClock == 0 || this.isClock == 3) {
return this.$dialog.alert({
title: '温馨提示',
content: '不满足打卡条件!'
}).then(() => {
this.getLocation()
}).catch(() => {
})
}
if (this.isClock == 2) {
return this.$u.toast(`已打卡,请勿重复打卡!`)
}
this.flag = true
this.daKa()
},
// 报名积分
signUp() {
if(this.info.enrollClock) return
this.flag = true
this.daKa()
},
daKa() {
this.$instance.post(`/app/appintegraltask/clock`, {
address: this.address,
clockTime: this.$dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss'),
lat: this.latitude,
lng: this.longitude,
openId: this.user.openId,
realName: this.user.realName,
taskId: this.id,
type: this.info.type
}).then(res => {
if (res?.code == 0) {
this.flag = false
if (this.info.type == 1) {
this.$u.toast('报名成功!')
} else {
this.$u.toast('打卡签到成功!')
}
setTimeout(()=> {
uni.navigateBack()
}, 500)
}
}).catch(err => this.$u.toast(err))
},
getLocation() {
wx.authorize({
scope: 'scope.userLocation',
success: () => {
uni.getLocation({
type: 'gcj02',
success: res => {
this.latitude = res.latitude
this.longitude = res.longitude
this.qqmapsdk.reverseGeocoder({
location: `${res.latitude},${res.longitude}`,
success: data => {
console.log(data);
this.address = data.result.formatted_addresses.recommend
},
fail: function (info) {
console.log(info)
}
})
this.qqmapsdk.calculateDistance({
from: {
longitude: res.longitude,
latitude: res.latitude
},
to: [{
longitude: this.info.lng,
latitude: this.info.lat
}],
success: res => {
this.distance = res.result.elements[0].distance
},
fail: function (error) {
console.error(error)
},
complete: function (res) {
}
})
},
fail: e => {
console.log(e)
}
})
},
fail: () => {
this.$dialog.confirm({
content: '您未授权定位,功能将无法使用'
}).then(() => {
uni.openSetting({
success: res => {
if (!res.authSetting['scope.userLocation']) {
this.$dialog.alert({
content: '您未授权定位,功能将无法使用'
}).then(() => {
})
} else {
}
}
})
})
}
})
},
},
onLoad(o) {
this.id = o.id
@@ -95,6 +303,9 @@ export default {
title: '任务详情'
});
this.getDetail()
this.qqmapsdk = new QQMapWX({
key: process.env.NODE_ENV == 'production' ? 'RWWBZ-64BEJ-MVLFJ-FTHLQ-JTR6J-SAB2S' : '3RZBZ-LZUCF-CT6J5-NWKZH-FCWOQ-UUFKY'
})
},
}
</script>
@@ -122,11 +333,21 @@ export default {
.imgs {
display: flex;
max-width: 450px;
align-items: center;
flex-wrap: wrap;
padding-top: 20px;
box-sizing: border-box;
img {
width: 40px;
height: 40px;
image {
height: 208px;
width: 33.33%;
padding-right: 12px;
margin-bottom: 12px;
box-sizing: border-box;
&:nth-of-type(3n) {
padding-right: 0;
}
}
}
}
@@ -188,13 +409,12 @@ export default {
}
.opacity {
opacity: 0.6000000238418579;
opacity: 0.6000000238418579 !important;
}
.gray {
background: #b5b5bcff;
background: #b5b5bcff !important;
}
.btn-clock {
height: 372px;
width: 100%;
@@ -222,6 +442,14 @@ export default {
font-weight: 500;
}
}
.opacity {
opacity: 0.6000000238418579 !important;
}
.gray {
background: #b5b5bcff !important;
}
.tips {
text-align: center;
color: #666666;