309 lines
7.2 KiB
Vue
309 lines
7.2 KiB
Vue
|
<template>
|
|||
|
|
<view class="fullHeight">
|
|||
|
|
<view class="" style="position: fixed; top: 0; left: 0; width: 100%; z-index: 10;background-color: #fff;">
|
|||
|
|
<headers :showBack="true" class="fixedHeaderBox">
|
|||
|
|
<view class="headerName">
|
|||
|
|
考勤记录
|
|||
|
|
</view>
|
|||
|
|
</headers>
|
|||
|
|
<view class="searchBox selectContent" :style="{ 'padding-top': (statusBarHeight+52) + 'px' }">
|
|||
|
|
<text>考勤日期：</text>
|
|||
|
|
<picker mode="date" @change="changeDate" :value="searchForm.attendanceDate" class="selectItem">
|
|||
|
|
<view class="selectVideoBox">
|
|||
|
|
<text class="videoName">{{ searchForm.attendanceDate }}</text>
|
|||
|
|
<uni-icons class="arrow" type="arrowdown" size="15"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
</picker>
|
|||
|
|
<!-- <picker mode="selector" :range="personTypeArr" @change="changePersonType" range-key="name"
|
|||
|
|
:value="personTypeIndex" style="margin-left:10px" class="selectItem">
|
|||
|
|
<view class="selectVideoBox">
|
|||
|
|
<text class="videoName">{{ personTypeArr[personTypeIndex].name }}</text>
|
|||
|
|
<uni-icons class="arrow" type="arrowdown" size="15"></uni-icons>
|
|||
|
|
</view>
|
|||
|
|
</picker> -->
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="middleBox" :style="{ 'padding-top': (statusBarHeight+52+40) + 'px' }">
|
|||
|
|
<view class="box">
|
|||
|
|
<view class="num">
|
|||
|
|
{{ statictisData.total_person }}
|
|||
|
|
</view>
|
|||
|
|
<view class="txt">
|
|||
|
|
出勤人数
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="box">
|
|||
|
|
<view class="num">
|
|||
|
|
{{ searchForm.personType == 1 ? statictisData.totalTeamNum : statictisData.totalDepartmentNum }}
|
|||
|
|
</view>
|
|||
|
|
<view class="txt">
|
|||
|
|
{{ searchForm.personType == 1 ? '出勤班组' : '出勤部门' }}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
<view class="listBox" style="padding-top: 100px;">
|
|||
|
|
<!-- @click="searchPerson(item.id)" -->
|
|||
|
|
<view class="personItem" v-for="item in list" :key="item.id">
|
|||
|
|
<image v-if="item.fieldAcquisitionUrl" :src="url_config+'image/'+item.fieldAcquisitionUrl"
|
|||
|
|
class="profile_photo"></image>
|
|||
|
|
<image v-else src="/static/profile_photo.png" class="profile_photo"></image>
|
|||
|
|
<view class="personInfo">
|
|||
|
|
<view class="name">
|
|||
|
|
{{ item.workerName }}
|
|||
|
|
</view>
|
|||
|
|
<view class="teamName">
|
|||
|
|
{{ item.teamName ? item.teamName : item.departmentName }}
|
|||
|
|
</view>
|
|||
|
|
<view class="small">
|
|||
|
|
{{ item.sex == 2 ? '女' : '男' }} {{ item.age }}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <image src="/static/icon-right.png" class="icon-right"></image> -->
|
|||
|
|
</view>
|
|||
|
|
<view class="placeholderBox" v-show="list.length===0">
|
|||
|
|
<image src="/static/noData.png" class="noDataImg"></image>
|
|||
|
|
<view class="text">
|
|||
|
|
暂无数据
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="loadMoreBox" v-if="isLoadMore&&list.length>0">
|
|||
|
|
<uni-load-more :status="loadStatus" iconType="auto"></uni-load-more>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import headers from "@/components/headers/headers.vue"
|
|||
|
|
import {
|
|||
|
|
GetDateStr
|
|||
|
|
} from "@/static/js/util.js"
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
headers
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
searchForm: {
|
|||
|
|
pageNo: 1,
|
|||
|
|
pageSize: 10,
|
|||
|
|
projectSn: "",
|
|||
|
|
attendanceDate: ''
|
|||
|
|
},
|
|||
|
|
projectDetail: {},
|
|||
|
|
list: [],
|
|||
|
|
statusBarHeight: 0,
|
|||
|
|
loadStatus: 'more',
|
|||
|
|
isLoadMore: false,
|
|||
|
|
personTypeArr: [{
|
|||
|
|
name: '施工人员',
|
|||
|
|
value: 1
|
|||
|
|
}, {
|
|||
|
|
name: '管理人员',
|
|||
|
|
value: 2
|
|||
|
|
}],
|
|||
|
|
personTypeIndex: 0,
|
|||
|
|
statictisData: {
|
|||
|
|
totalDepartmentNum: 0,
|
|||
|
|
totalTeamNum: 0,
|
|||
|
|
total_person: 0,
|
|||
|
|
},
|
|||
|
|
workerInfo: {}
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
onLoad(option) {
|
|||
|
|
this.workerInfo = JSON.parse(decodeURIComponent(option.item));
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight
|
|||
|
|
this.projectDetail = JSON.parse(uni.getStorageSync('projectDetail'))
|
|||
|
|
this.searchForm.projectSn = this.projectDetail.projectSn
|
|||
|
|
this.searchForm.attendanceDate = GetDateStr(0, '-')
|
|||
|
|
this.loadData()
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
uni.removeStorageSync('person')
|
|||
|
|
},
|
|||
|
|
onReachBottom() {
|
|||
|
|
if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
|
|||
|
|
this.isLoadMore = true
|
|||
|
|
this.searchForm.pageNo += 1
|
|||
|
|
this.loadData()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onPullDownRefresh() {
|
|||
|
|
this.searchForm.pageNo = 1
|
|||
|
|
this.list = []
|
|||
|
|
this.loadData()
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
changeDate(e) {
|
|||
|
|
this.searchForm.attendanceDate = e.target.value
|
|||
|
|
this.list = []
|
|||
|
|
this.searchForm.pageNo = 1
|
|||
|
|
this.loadData()
|
|||
|
|
},
|
|||
|
|
changePersonType(e) {
|
|||
|
|
this.personTypeIndex = e.target.value
|
|||
|
|
this.searchForm.personType = this.personTypeArr[this.personTypeIndex].value
|
|||
|
|
this.list = []
|
|||
|
|
this.searchForm.pageNo = 1
|
|||
|
|
this.loadData()
|
|||
|
|
},
|
|||
|
|
searchPerson(id) {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: './searchTeam/personDetail?id=' + id
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
loadData() {
|
|||
|
|
var that = this
|
|||
|
|
let requestData = {
|
|||
|
|
...this.searchForm,
|
|||
|
|
personSn: this.workerInfo.personSn
|
|||
|
|
}
|
|||
|
|
this.sendRequest({
|
|||
|
|
url: 'xmgl/workerInfo/selectAttendanceWorkerListByDate',
|
|||
|
|
data: requestData,
|
|||
|
|
method: "POST",
|
|||
|
|
success(res) {
|
|||
|
|
that.statictisData = res.result.count
|
|||
|
|
that.list = that.list.concat(res.result.page.records)
|
|||
|
|
if (res.result.page.records.length < that.searchForm
|
|||
|
|
.pageSize) { //判断接口返回数据量小于请求数据量，则表示此为最后一页
|
|||
|
|
that.isLoadMore = true
|
|||
|
|
that.loadStatus = 'nomore'
|
|||
|
|
} else {
|
|||
|
|
that.isLoadMore = false
|
|||
|
|
// that.loadStatus='more'
|
|||
|
|
}
|
|||
|
|
uni.stopPullDownRefresh()
|
|||
|
|
console.log('that.isLoadMore', that.isLoadMore)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.searchBox {
|
|||
|
|
// background-color: #2b8df3;
|
|||
|
|
padding: 0 15px 5px;
|
|||
|
|
position: fixed;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
top: 0;
|
|||
|
|
z-index: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.selectContent {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
text-align: center;
|
|||
|
|
|
|||
|
|
.selectItem {
|
|||
|
|
flex: 1;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.listBox {
|
|||
|
|
margin: 15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.personItem {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
box-shadow: 0px 4px 13px 0px rgba(212, 220, 236, 0.53);
|
|||
|
|
position: relative;
|
|||
|
|
margin-bottom: 5px;
|
|||
|
|
padding: 15px;
|
|||
|
|
border-radius: 8px;
|
|||
|
|
// padding: 0 15px;
|
|||
|
|
font-size: 15px;
|
|||
|
|
|
|||
|
|
.teamName {
|
|||
|
|
font-size: 13px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.small {
|
|||
|
|
font-size: 12px;
|
|||
|
|
opacity: 0.8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.profile_photo {
|
|||
|
|
width: 50px;
|
|||
|
|
height: 60px;
|
|||
|
|
margin-right: 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.icon-right {
|
|||
|
|
position: absolute;
|
|||
|
|
width: 8px;
|
|||
|
|
height: 14px;
|
|||
|
|
right: 15px;
|
|||
|
|
top: calc(50% - 7px);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.selectVideoBox {
|
|||
|
|
border: 1px solid rgba(42, 43, 91, 0.2);
|
|||
|
|
border-radius: 18px;
|
|||
|
|
height: 35px;
|
|||
|
|
font-size: 15px;
|
|||
|
|
// display: inline-block;
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
|
|||
|
|
.videoName {
|
|||
|
|
padding: 0 12px 0 15px;
|
|||
|
|
// border-right: 1px solid rgba(42, 43, 91, 0.2);
|
|||
|
|
line-height: 35px;
|
|||
|
|
height: 35px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.arrow {
|
|||
|
|
padding: 0 12px 0 2px;
|
|||
|
|
margin-left: 10px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.middleBox {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin: 5px 15px 10px;
|
|||
|
|
|
|||
|
|
.box {
|
|||
|
|
flex: 1;
|
|||
|
|
// display: inline-flex;
|
|||
|
|
// align-items: center;
|
|||
|
|
// height: 65px;
|
|||
|
|
padding: 4px 0 6px;
|
|||
|
|
|
|||
|
|
&:first-child {
|
|||
|
|
margin-right: 15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.txt {
|
|||
|
|
color: rgba(55, 45, 102, 0.6);
|
|||
|
|
font-size: 13px;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.num {
|
|||
|
|
font-size: 20px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.box {
|
|||
|
|
box-shadow: 0 4px 24px 0px rgba(212, 220, 236, 0.69);
|
|||
|
|
border-radius: 8px;
|
|||
|
|
}
|
|||
|
|
</style>
|