You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
143 lines
3.2 KiB
143 lines
3.2 KiB
<template>
|
|
<view>
|
|
<view class="" v-if="peopleType=='1'">
|
|
<view class="status">当前状态：{{value}}</view>
|
|
<view class="clock-button" :class="{isClock:isClock}" type="success" @click="onClock">打卡</view>
|
|
</view>
|
|
<view class="" v-else>
|
|
<uni-section class="mb-10" title="时间选择" type="line">
|
|
<uni-datetime-picker v-model="range" type="daterange" />
|
|
</uni-section>
|
|
<uni-card title="打卡情况">
|
|
<uni-list>
|
|
<uni-list-item direction="row" v-for="(item , index) in staffList" :key="index">
|
|
<template #body>
|
|
<view class="tag-wrap">
|
|
<view v-if="item.departmentTitle">
|
|
<u-tag :text="item.departmentTitle" size="12" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<template #header>
|
|
<view class="avatar-wrap">
|
|
<!-- <u-avatar :src="item.avatar" size="24">
|
|
</u-avatar> -->
|
|
<text class="staff-name">{{ item.nickname }}</text>
|
|
</view>
|
|
</template>
|
|
<template #footer>
|
|
<view style="font-size: 24rpx;">
|
|
<text style="margin-right: 10px;">正常:20</text>
|
|
<text style="margin-right: 10px;">迟到:<text style="color: red;">2</text></text>
|
|
<text>早退:<text style="color: red;">3</text></text>
|
|
</view>
|
|
</template>
|
|
</uni-list-item>
|
|
</uni-list>
|
|
</uni-card>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
mapState
|
|
} from 'vuex'
|
|
export default {
|
|
data() {
|
|
return {
|
|
value: '未打卡',
|
|
isClock: false,
|
|
peopleType: '0',
|
|
staffList:[]
|
|
}
|
|
},
|
|
computed: mapState(['userId']),
|
|
onLoad() {
|
|
//明珠A 116.805796,38.335286
|
|
//明珠D 116.806408,38.338111
|
|
//明珠B 116.806913,38.336937
|
|
//明珠C 116.80562,38.337177
|
|
//明珠早市精品二合一给一个大的范围 116.810029,38.335321
|
|
this.peopleType = uni.getStorageSync('type')
|
|
if(this.peopleType == 0){
|
|
this.getStaffList()
|
|
}
|
|
|
|
},
|
|
methods: {
|
|
getStaffList() {
|
|
this.tui.request('/app/common/user/findAllUserByShopId', 'get', {}, false, false, true).then((res) => {
|
|
if (res.code !== 200) return
|
|
this.staffList = res.result
|
|
})
|
|
},
|
|
onClock() {
|
|
uni.getLocation({
|
|
type: 'wgs84',
|
|
isHighAccuracy:true,
|
|
accuracy:'best',
|
|
success: function (res) {
|
|
|
|
}
|
|
});
|
|
// if (!this.isClock) {
|
|
// this.tui.request("/app/clockIn/", "get", {
|
|
// userId: this.userId
|
|
// }, false, true).then((res) => {
|
|
// if (res.code == 200) {
|
|
// this.tui.toast('打卡成功', 2000, true)
|
|
// this.value = '已打卡'
|
|
// this.isClock = true
|
|
// } else {
|
|
// this.tui.toast(res.message)
|
|
// }
|
|
// })
|
|
// }
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.status {
|
|
font-size: 40upx;
|
|
color: #333333;
|
|
text-align: center;
|
|
padding: 80upx;
|
|
}
|
|
|
|
.clock-button {
|
|
width: 200upx;
|
|
height: 200upx;
|
|
line-height: 200upx;
|
|
border-radius: 200upx;
|
|
text-align: center;
|
|
background-color: #5fd9ee;
|
|
color: #fef0f0;
|
|
font-size: 56upx;
|
|
margin: 50upx auto;
|
|
}
|
|
|
|
.isClock {
|
|
background: grey;
|
|
}
|
|
|
|
.tag-wrap {
|
|
width: 100rpx;
|
|
flex: 1;
|
|
display: flex;
|
|
|
|
view {
|
|
margin: 0 2upx;
|
|
}
|
|
}
|
|
|
|
.avatar-wrap {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
font-size: 24upx;
|
|
}
|
|
</style>
|