-

zhangwei

2026-04-07 b7ae3f69ae6706a692284d2f12835d213debfb1a

 src/pages/checkin/checkin.vue

@@ -1,27 +1,46 @@
<template>
   <view>
      <view class='chuany-flex camera-fill chuany-justify-center chuany-align-center'>
         <fui-upload immediate :url="`${apiBaseUrl}api/UpFile/UpdateFile`" ref="uploadB" 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>
         <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>
         </fui-upload>
         <fui-upload ref="uploadB" max='1' @error="error" @complete="completePerson" width="280" height="280">
            <image v-if="src" :src="src" mode="widthFix" style="width: 280rpx;height: 280rpx;"></image>
         </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>
         </fui-upload>
         </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">
         为了保证打卡的正确性，‌建议在公司门口或进入办公室的门口再打卡。‌同时，‌确保照片的清晰、‌明亮，‌面部可见。
         1、为了确保劳务报酬的准确结算，请在开始工作前3分钟内开始计时，上传“劳务计时”的照片后必须立即投入工作，否则将多倍扣除务工时长；
         2、必须确保照片的清晰、明亮，面部和当前工作环境可见，否则将影响劳务费用计算；
         3、劳务计时以小时为单位进行核算。例如：开始计时时间为早上8:00，结束计时时间为11:05分或11:55分，系统核定的务工时间均为3小时。
      </view>
      <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"
@@ -35,14 +54,15 @@
                     v-if="index!==dakaList.length-1&&index%2==0">
                  </view>
               </view>
               <text>{{item.checktime?'已打卡':'未打卡'}}</text>
               <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>
         <up-button color='#fece01' text="确认计时" :loading='isLoading' loadingText="计时中"
            @click="enroll"></up-button>
      </view>
   </view>
</template>
@@ -57,9 +77,13 @@
            src: '',
            apiBaseUrl,
            orderBiddingId: '', //招工明细OrderBiddingId
            checkPhoto: '', //打卡照片
            checkPhoto: '', //计时照片
            faceImg: '', //人脸图片
            dakaList: null
            dakaList: [],
            sourceType: ["camera"],
            sizeType: ['compressed'],
            mediaType: ['image'],
            isLoading: false
         }
      },
      onLoad(option) {
@@ -68,16 +92,26 @@
         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.orderBiddingDetailCheck
                  if (this.dakaList.length == 0) {
                     this.dakaList.length = 2
                  }
                  this.dakaList = res.data ? res.data.orderBiddingDetailCheck : []
                  if (this.dakaList.length > 6) {
                     this.dakaList.length = 6
                  }
@@ -93,18 +127,22 @@
         },
         openCamera() {
            // 拍照和相册
            uni.chooseImage({
               count: 1,
               sizeType: ["original", "compressed"],
               sourceType: ["camera"],
               success: (res) => {
                  const {
                     tempFilePaths
                  } = res;
                  console.log(tempFilePaths);
               },
            });

            // 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) {
@@ -112,7 +150,7 @@
            //上传成功回调，处理服务器返回数据【此处根据实际返回数据进行处理】
            let res = JSON.parse(e.res.data.replace(/\ufeff/g, "") || "{}")
            if (res.data) {
               this.checkPhoto = res.data //打卡照片
               this.checkPhoto = res.data //计时照片
               //人脸图片
               // enterpriseInfo.businessLicense = res.data.url
               // enterpriseInfo.suppliername = res.data.info.name //企业名称
@@ -132,6 +170,12 @@
            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
            })
@@ -156,25 +200,30 @@
               })
               return
            }
            this.isLoading = true
            let obj = {
               OrderId: this.orderBiddingId, //招工明细OrderBiddingId
               checkPhoto: this.checkPhoto, //打卡照片
               checkPhoto: this.checkPhoto, //计时照片
               faceImg: this.faceImg,
            }
            this.$api.saveDaka(obj).then(res => {
               if (res.code == 1) {
                  this.$util.showToast({
                     title: "打卡成功！",
                     title: "计时成功！",
                     icon: "success"
                  })
                  this.checkPhoto = '' //打卡照片
                  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.data,
                     title: res.error,
                  })
               }
               this.isLoading = false
            })
         }
      }
@@ -182,6 +231,28 @@
</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;