<template>
|
<view>
|
<view class='chuany-flex camera-fill chuany-justify-center chuany-align-center'>
|
<tem-upload-fui immediate :url="`${apiBaseUrl}/api/UpFile/UpdateFile`" ref="uploadE" max='1'
|
@success="success" cameraType='back' :sizeType='sizeType' :sourceType='sourceType' @error="error"
|
@complete="complete" width="280" :mediaType='mediaType' height="280">
|
<view class="" v-if="checkPhoto">
|
<image :src="checkPhoto" mode="aspectFill" style="width: 280rpx;height: 280rpx;">
|
</image>
|
</view>
|
<view class=" chuany-flex chuany-flex-direction chuany-align-center" v-else>
|
<fui-icon name="camera-fill"></fui-icon>
|
<view class="chuany-font20">拍摄环境照片</view>
|
</view>
|
</tem-upload-fui>
|
<tem-upload-fui ref="uploadP" max='1' @error="error" @complete="completePerson" width="280" height="280"
|
:sizeType='sizeType' :sourceType='sourceType' :mediaType='mediaType' :isFace='true'>
|
<view class="" v-if="faceImg">
|
<image :src="faceImg" mode="aspectFill" style="width: 280rpx;height: 280rpx;"></image>
|
</view>
|
<view class=" chuany-flex chuany-flex-direction chuany-align-center" v-else>
|
<fui-icon name="addfriends-fill"></fui-icon>
|
<view class="chuany-font20">拍摄人脸照片</view>
|
</view>
|
</tem-upload-fui>
|
<!-- <view class="fui-upload__item fui-upload__noborder"
|
style="width:280rpx;height:280rpx;background:#eee;" @tap.stop="openCamera">
|
<view class="" v-if="faceImg">
|
<image :src="faceImg" mode="aspectFill" style="width: 280rpx;height: 280rpx;"></image>
|
</view>
|
<view class=" chuany-flex chuany-flex-direction chuany-align-center" v-else>
|
<fui-icon name="addfriends-fill"></fui-icon>
|
<view class="chuany-font20">拍摄人脸照片</view>
|
</view>
|
</view> -->
|
</view>
|
<view class="c-m-20 chuany-font24">
|
为了保证打卡的正确性，建议在公司门口或进入办公室的门口再打卡。同时，确保照片的清晰、明亮，面部可见。
|
</view>
|
<view v-if='dakaList&&dakaList.length>0'>
|
<view class="chuany-flex chuany-justify-evenly chuany-flex-wrap c-p-t-20">
|
<view
|
class="chuany-flex chuany-flex-direction chuany-align-center chuany-justify-around textclo chuany-font24 c-p-b-30 daka"
|
:key="index" v-for="(item,index) in dakaList">
|
<up-avatar shape="square" size="56" :src="item.checkPhoto"
|
@click="previewImage(item.checkPhoto)"></up-avatar>
|
<view class="step_item">
|
<up-icon name="checkmark-circle-fill" :color="item.checktime?'#2979ff':'#e9e8e8'"
|
size="22"></up-icon>
|
<view class="line" :class="item.checkPhoto?'line-active':''"
|
v-if="index!==dakaList.length-1&&index%2==0">
|
</view>
|
</view>
|
<text>{{item.checktime?'已打卡':'未打卡'}}</text>
|
<text
|
:class="$util.formatDate(item.checktime,true)=='-'?'core-opa':''">{{$util.formatDate(item.checktime,true)}}</text>
|
</view>
|
</view>
|
</view>
|
<view class="tabbtns">
|
<up-button color='#fece01' class="text-69" text="确认打卡" :loading='isLoading' loadingText="打卡中"
|
@click="enroll"></up-button>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import {
|
apiBaseUrl
|
} from '@/common/setting/constVarsHelper.js';
|
export default {
|
data() {
|
return {
|
src: '',
|
apiBaseUrl,
|
orderBiddingId: '', //招工明细OrderBiddingId
|
checkPhoto: '', //打卡照片
|
faceImg: '', //人脸图片
|
dakaList: [],
|
sourceType: ["camera"],
|
sizeType: ['compressed'],
|
mediaType: ['image'],
|
isLoading: false
|
}
|
},
|
onLoad(option) {
|
this.apiBaseUrl = apiBaseUrl
|
let id = option.orderid
|
this.orderBiddingId = id
|
this.getDaka(id)
|
},
|
onShow(){
|
if(this.$db.get('faceImg')){
|
let faceImgPath = this.$db.get('faceImg')
|
this.$refs.uploadP.urls = [faceImgPath]
|
this.$refs.uploadP.status = ['success']
|
this.$util.pathToBase64(faceImgPath).then(res => {
|
this.faceImg = res
|
})
|
}
|
},
|
onUnload(){
|
this.$db.del('faceImg')
|
},
|
methods: {
|
getDaka(id) {
|
this.$api.getDaka({
|
orderId: id
|
}).then(res => {
|
if (res.code == 1) {
|
this.dakaList = res.data ? res.data.orderBiddingDetailCheck : []
|
if (this.dakaList.length > 6) {
|
this.dakaList.length = 6
|
}
|
if (this.dakaList.length % 2 !== 0) {
|
this.dakaList.push({})
|
}
|
} else {
|
this.$util.showToast({
|
title: res.error
|
})
|
}
|
})
|
},
|
openCamera() {
|
// 拍照和相册
|
// uni.chooseMedia({
|
// count: 1,
|
// mediaType: ['image'],
|
// sizeType: ["compressed"],
|
// sourceType: ["camera"],
|
// camera: 'front',
|
// success: (res) => {
|
// const {
|
// tempFiles
|
// } = res;
|
// this.$util.pathToBase64(tempFiles[0].tempFilePath).then(res => {
|
// this.faceImg = res
|
// })
|
// },
|
// });
|
|
},
|
|
success(e) {
|
//e.res 为服务器返回数据
|
//上传成功回调，处理服务器返回数据【此处根据实际返回数据进行处理】
|
let res = JSON.parse(e.res.data.replace(/\ufeff/g, "") || "{}")
|
if (res.data) {
|
this.checkPhoto = res.data //打卡照片
|
//人脸图片
|
// enterpriseInfo.businessLicense = res.data.url
|
// enterpriseInfo.suppliername = res.data.info.name //企业名称
|
// enterpriseInfo.regtime = res.data.info.setDate //注册时间
|
// enterpriseInfo.address = res.data.info.address //联系地址
|
// enterpriseInfo.suppliercode = res.data.info.regNum //企业注册号
|
// enterpriseInfo.contact = res.data.info.person //联系人
|
}
|
},
|
error() {
|
|
},
|
complete(e) {
|
if (e.action == 'delete') {
|
// 删除处理
|
}
|
console.log(e, '删除')
|
},
|
completePerson(e) {
|
if (e.action == 'delete') {
|
this.faceImg = ''
|
this.$db.del('faceImg')
|
// 删除处理
|
return
|
}
|
this.$util.pathToBase64(e.urls[0]).then(res => {
|
this.faceImg = res
|
})
|
},
|
previewImage(url) {
|
uni.previewImage({
|
urls: [url]
|
})
|
},
|
enroll() {
|
if (!this.checkPhoto) {
|
this.$util.showToast({
|
title: "请拍摄环境照片！",
|
icon: "error"
|
})
|
return
|
}
|
if (!this.faceImg) {
|
this.$util.showToast({
|
title: "请拍摄人脸照片！",
|
icon: "error"
|
})
|
return
|
}
|
this.isLoading = true
|
let obj = {
|
OrderId: this.orderBiddingId, //招工明细OrderBiddingId
|
checkPhoto: this.checkPhoto, //打卡照片
|
faceImg: this.faceImg,
|
}
|
this.$api.saveDaka(obj).then(res => {
|
if (res.code == 1) {
|
this.$util.showToast({
|
title: "打卡成功！",
|
icon: "success"
|
})
|
this.checkPhoto = '' //打卡照片
|
this.faceImg = ''
|
this.$db.del('faceImg')
|
this.$refs.uploadP.deleteImage()
|
this.$refs.uploadE.deleteImage()
|
this.getDaka(this.orderBiddingId)
|
} else {
|
this.$util.showToast({
|
title: res.error,
|
})
|
}
|
this.isLoading = false
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.fui-upload__item {
|
/* #ifndef APP-NVUE */
|
display: flex;
|
/* #endif */
|
align-items: center;
|
justify-content: center;
|
margin-right: 20rpx;
|
margin-bottom: 20rpx;
|
/* #ifdef H5 */
|
cursor: pointer;
|
/* #endif */
|
position: relative;
|
|
/* #ifndef APP-NVUE */
|
box-sizing: border-box;
|
/* #endif */
|
}
|
|
.fui-upload__noborder {
|
border-width: 0;
|
}
|
|
.camera-fill {
|
// width: 400rpx;
|
// height: 400rpx;
|
margin: 20rpx auto;
|
border-radius: 20rpx;
|
}
|
|
.daka {
|
width: 260rpx;
|
height: 230rpx;
|
}
|
|
.step_item {
|
position: relative;
|
/* width: 144rpx; */
|
display: flex;
|
|
.line {
|
position: absolute;
|
top: 17rpx;
|
left: 35rpx;
|
content: "";
|
height: 4rpx;
|
width: 310rpx;
|
background-color: #e9e8e8;
|
z-index: -1;
|
}
|
|
.line-active {
|
background-color: #2979ff;
|
}
|
}
|
</style>
|
