<template>
|
<view>
|
<view class='chuany-flex camera-fill chuany-justify-center chuany-align-center'>
|
<fui-upload immediate :url="`${apiBaseUrl}api/UpFile/UpdateFile`" ref="uploadE" max='1' @success="success"
|
@error="error" @complete="complete" width="280" height="280">
|
<image v-if="checkPhoto" :src="checkPhoto" mode="widthFix" style="width: 280rpx;height: 280rpx;">
|
</image>
|
<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>
|
</fui-upload>
|
<fui-upload ref="uploadP" max='1' @error="error" @complete="completePerson" width="280" height="280">
|
<image v-if="faceImg" :src="faceImg" mode="widthFix" style="width: 280rpx;height: 280rpx;"></image>
|
<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>
|
</fui-upload>
|
</view>
|
<view class="c-m-20 chuany-font24">
|
为了保证打卡的正确性,建议在公司门口或进入办公室的门口再打卡。同时,确保照片的清晰、明亮,面部可见。
|
</view>
|
<view>
|
<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="确认打卡" @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: null
|
}
|
},
|
onLoad(option) {
|
this.apiBaseUrl = apiBaseUrl
|
let id = option.orderid
|
this.orderBiddingId = id
|
this.getDaka(id)
|
},
|
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 == 0) {
|
this.dakaList.length = 2
|
}
|
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.chooseImage({
|
count: 1,
|
sizeType: ["original", "compressed"],
|
sourceType: ["camera"],
|
success: (res) => {
|
const {
|
tempFilePaths
|
} = res;
|
console.log(tempFilePaths);
|
},
|
});
|
|
},
|
|
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') {
|
// 删除处理
|
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
|
}
|
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.$refs.uploadP.deleteImage()
|
this.$refs.uploadE.deleteImage()
|
this.getDaka(this.orderBiddingId)
|
} else {
|
this.$util.showToast({
|
title: res.data,
|
})
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.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>
|