<template>
|
<!-- 打卡 -->
|
<view class="punchTheClock">
|
<!-- 打卡按钮 -->
|
<view class="punchTheClock_container">
|
<view class="punchTheClock_btn" @click="arrive">
|
<view>
|
<p>签到/打卡</p>
|
<p>{{ nowTime }}</p>
|
</view>
|
</view>
|
<view class="punchTheClock_text">
|
<u-icon name="map" color="#51e30d" size="30"></u-icon>
|
<text>未进入矿场区域</text>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { todayDate } from '@/utils/util.js';
|
export default {
|
onLoad(params) {
|
if (params.orderPlanId) {
|
this.punchTheClockObj.id = params.orderPlanId;
|
}
|
},
|
data() {
|
return {
|
nowTime: '',
|
punchTheClockObj: {
|
latitude: null,
|
longitude: null,
|
id: null
|
}
|
};
|
},
|
onShow() {
|
this.todayDate();
|
// 获取权限信息
|
wx.getSetting({
|
success(res) {
|
if (!res.authSetting['scope.userFuzzyLocation']) {
|
wx.authorize({
|
scope: 'scope.userFuzzyLocation',
|
success(res) {
|
console.log(res);
|
if (res.errMsg == 'authorize:ok') {
|
// 获取位置信息
|
this.getFuzzyLocation();
|
}
|
}
|
});
|
} else {
|
this.getFuzzyLocation();
|
}
|
},
|
fail() {
|
console.log('获取失败');
|
}
|
});
|
},
|
methods: {
|
getFuzzyLocation() {
|
wx.getFuzzyLocation({
|
type: 'wgs84',
|
success(res) {
|
console.log(res, '获取位置');
|
this.punchTheClockObj.latitude = res.latitude;
|
this.punchTheClockObj.longitude = res.longitude;
|
}
|
});
|
},
|
todayDate() {
|
setInterval(() => {
|
this.nowTime = todayDate('hms');
|
}, 1000);
|
},
|
// 签到
|
arrive() {
|
if (this.punchTheClockObj.latitude && this.punchTheClockObj.longitude) {
|
this.$reqPost('arrive', this.punchTheClockObj, 'params').then(res => {
|
console.log(res, '签到');
|
if (res.code == 0) {
|
this.$u.toast('签到成功');
|
setTimeout(() => {
|
uni.navigateBack(
|
{
|
delta: 1
|
},
|
500
|
);
|
});
|
} else {
|
this.$u.toast(res.data ? res.data : '签到失败');
|
}
|
});
|
} else {
|
this.$u.toast('暂获取不到到当前位置');
|
}
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.punchTheClock {
|
height: 100vh;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
.punchTheClock_container {
|
.punchTheClock_btn {
|
width: vww(240);
|
height: vww(240);
|
color: #ffffff;
|
font-size: vww(20);
|
border-radius: 50%;
|
background-color: #36d4e5;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
}
|
.punchTheClock_text {
|
display: flex;
|
justify-content: center;
|
margin-top: vww(20);
|
color: #b8b8b8;
|
.text {
|
margin-left: vww(5);
|
}
|
}
|
}
|
}
|
</style>
|
