<template>
|
<!-- 打卡 -->
|
<view class="punchTheClock">
|
<!-- 打卡按钮 -->
|
<view class="punchTheClock_container">
|
<view class="punchTheClock_btn"
|
@click="arrive">
|
<view>
|
<p>{{ coalStatus == 1 ? '已签到' : '签到/打卡' }}</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) {
|
this.punchTheClockObj.tmcoa = params.tmId.toString();
|
this.coalStatus = params.coalStatus;
|
},
|
data() {
|
return {
|
nowTime: '',
|
coalStatus: 0,
|
punchTheClockObj: {
|
tmcoa: null,
|
latA: null,
|
latB: null
|
}
|
};
|
},
|
onShow() {
|
this.getSetting(); //获取授权
|
this.getFuzzyLocation(); //获取位置
|
this.todayDate(); //当前时间
|
},
|
methods: {
|
getSetting() {
|
// 获取权限信息
|
wx.getSetting({
|
success(res) {
|
if (!res.authSetting['scope.userFuzzyLocation']) {
|
wx.authorize({
|
scope: 'scope.userFuzzyLocation',
|
success(res) {
|
uni.showToast({
|
title: '授权成功！'
|
});
|
}
|
});
|
}
|
},
|
fail() {
|
console.log('获取失败');
|
}
|
});
|
},
|
getFuzzyLocation() {
|
let that = this;
|
wx.getFuzzyLocation({
|
type: 'wgs84',
|
success(res) {
|
console.log(res, '获取位置', that);
|
that.punchTheClockObj.latB = res.latitude;
|
that.punchTheClockObj.latA = res.longitude;
|
}
|
});
|
},
|
todayDate() {
|
setInterval(() => {
|
this.nowTime = todayDate('hms');
|
}, 1000);
|
},
|
// 签到
|
arrive() {
|
if (this.punchTheClockObj.latA && this.punchTheClockObj.latB) {
|
console.log(this.punchTheClockObj);
|
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.msg ? res.msg : '签到失败');
|
}
|
});
|
} 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;
|
|
p {
|
text-align: center;
|
}
|
}
|
|
.punchTheClock_text {
|
display: flex;
|
justify-content: center;
|
margin-top: vww(20);
|
color: #b8b8b8;
|
|
.text {
|
margin-left: vww(5);
|
}
|
}
|
}
|
}
|
</style>
|
