-

zhangwei

2025-01-23 e5a77d6a551d13e4cf74624b31b0fa3e328b304d

 src/pages/mine/apply.vue

@@ -1,59 +1,62 @@
<template>
   <view class="full-page">
   <view class="full-page-fff">
      <view class="content">
         <up-form labelPosition="left" :model="userInfo" :rules="rules" ref="form1" labelWidth='90'>
            <up-form-item label="身份证正面" prop="userInfo.sex" required borderBottom @click="uploadIdCard('FRONT')"
               ref="item1">
               <fui-upload immediate :url="`${apiBaseUrl}api/UpFile/UploadIdCord?PageName=FRONT`" ref="uploadF"
                  max='1' background='#fff' @success="success" @error="error" @complete="complete" width="300"
                  height="150">
         <up-form labelPosition="left" :model="userInfo" :rules="rules" ref="formRef" labelWidth='80'>
            <up-form-item label="身份证正面" prop="idCardFace" required>
               <fui-upload immediate :url="`${apiBaseUrl}/api/UpFile/UploadIdCord?PageName=FRONT`" ref="uploadF"
                  max='1' background='#fff' @success="success('FRONT',$event)" @error="errorFront"
                  @complete="completeFront" width="300" height="150">
                  <image src="/static/positive.png" mode="widthFix" style="width: 300rpx;height: 150rpx;"></image>
               </fui-upload>
               <!-- <template #right>
                  <up-icon name="arrow-right"></up-icon>
               </template> -->
            </up-form-item>
            <up-form-item label="身份证反面" prop="userInfo.sex" required borderBottom ref="item1">
               <fui-upload immediate :url="`${apiBaseUrl}api/UpFile/UploadIdCord?PageName=Back`" ref="uploadB"
                  max='1' background='#fff' @success="success" @error="error" @complete="complete" width="300"
                  height="150">
            <up-form-item label="身份证反面" prop="idCardBack" required>
               <fui-upload immediate :url="`${apiBaseUrl}/api/UpFile/UploadIdCord?PageName=Back`" ref="uploadB"
                  max='1' background='#fff' @success="success('Back',$event)" @error="error" @complete="complete"
                  width="300" height="150">
                  <image src="/static/negative.png" mode="widthFix" style="width: 300rpx;height: 150rpx;"></image>
               </fui-upload>
            </up-form-item>
            <up-form-item label="姓名" required prop="userInfo.name" borderBottom ref="item1">
               <up-input v-model="state.model1.userInfo.name" border="none" placeholder="请输入姓名"></up-input>
            <up-form-item label="姓名" required prop="name" ref="item1">
               <up-input v-model="userInfo.name" border="none" placeholder="请输入姓名" readonly></up-input>
            </up-form-item>
            <up-form-item label="性别" required prop="Gender" borderBottom ref="item2">
            <up-form-item label="联系电话" required prop="phone" ref="item1">
               <up-input v-model="userInfo.phone" border="none" placeholder="请输入联系电话"></up-input>
            </up-form-item>
            <up-form-item label="身份证号" required prop="idCode" ref="item1">
               <up-input v-model="userInfo.idCode" border="none" placeholder="请输入身份证号" readonly></up-input>
            </up-form-item>
            <up-form-item label="联系地址" required prop="address" ref="item1">
               <up-input v-model="userInfo.address" border="none" placeholder="请输入联系地址"></up-input>
            </up-form-item>
            <up-form-item label="简历描述" required prop="resume" ref="item1">

            </up-form-item>
            <up-textarea v-model="userInfo.resume" placeholder="请输入简历描述"></up-textarea>
            <!-- <up-form-item label="性别" required prop="Gender"   ref="item2">
               <up-radio-group v-model="userInfo.Gender">
                  <up-radio :customStyle="{marginRight: '16px'}" v-for="(item, index) in radiolist1" :key="index"
                     :label="item.name" :name="item.name">
                  </up-radio>
               </up-radio-group>
            </up-form-item>
            <up-form-item label="联系电话" required prop="userInfo.name" borderBottom ref="item1">
               <up-input v-model="state.model1.userInfo.name" border="none" placeholder="请输入联系电话"></up-input>
            </up-form-item>
            <up-form-item label="身份证号" required prop="userInfo.name" borderBottom ref="item1">
               <up-input v-model="state.model1.userInfo.name" border="none" placeholder="请输入身份证号"></up-input>
            </up-form-item>
            <up-form-item label="简历描述" required prop="userInfo.name" borderBottom ref="item1">
               <up-textarea v-model="state.model1.userInfo.name" placeholder="请输入简历描述"></up-textarea>
            </up-form-item>
            <cameraBufferJpg/>
            <view class="text-area">
            </up-form-item> -->
            <!-- <view class="text-area">
               <camera device-position="front" style="width: 100%; height: 600rpx;"></camera>
            </view>
            <view class="tabbtns">
            </view> -->
            <!-- <view class="tabbtns">
               <up-button color='#fece01' class="text-69" text="人脸识别" @click='IaiAddPerso'></up-button>
            </view>
				
            </view> -->


            <!-- <up-popup :show="show" @close="close" @open="open"> -->
            <!-- <tem-session/> -->
            <!-- </up-popup> -->
            <!-- <view class="tabbtns">
               <up-button color='#fece01' class="text-69" text="保存"></up-button>
            </view> -->
            <view class="tabbtns">
               <up-button color='#fece01' text="保存" :loading='isLoading' loadingText="保存中"
                  @click='saveUserWorker'></up-button>
            </view>
         </up-form>
      </view>

@@ -63,265 +66,248 @@
<script setup>
   import {
      onLoad,
      onShow
      onShow,
      onReady
   } from "@dcloudio/uni-app";

   import {
      apiBaseUrl
   } from '@/common/setting/constVarsHelper.js';
   import {
      getCurrentInstance
      onMounted,
      getCurrentInstance,
      computed
   } from 'vue'
   import {
      useStore
   } from 'vuex'
   const store = useStore()
   const {
      $upload,
      $api
      $api,
      $util,
      $db
   } = getCurrentInstance().appContext.config.globalProperties
   import {
      ref,
      reactive
   } from 'vue';
   let webgl = ref()

   // let webgl = ref()
   onLoad(() => {
      let cameraEngine = wx.createCameraContext()
      // 3、获取 Camera 实时帧数据
      const listener = cameraEngine.onCameraFrame((frame) => {
         // console.log(frame)
         if (!status.value) {
            return
         }
         jiance(frame)
      })
      // 5、开始监听帧数据
      listener.start()
      const userToken = $db.get("userToken");
      if (!userToken) {
         uni.showToast({
            title: '请先登录！',
            icon: 'none',
            duration: 1000,
            complete: function() {
               setTimeout(function() {
                     uni.hideToast();
                     uni.navigateTo({
                        url: '/pages/login/index'
                     });
                  },
                  1000);
            }
         });
      }
      let data = $db.get('userInfo') || null
      if (data && data.userWorker) {
         userInfo.idCardFace = data.userWorker ? data.userWorker.idCardFace : '' //身份证正面路径
         userInfo.idCardBack = data.userWorker ? data.userWorker.idCardBack : '' //身份证反面路径
         userInfo.name = data.userWorker.name //姓名
         userInfo.phone = data.userWorker.phone //电话号码
         userInfo.idCode = data.userWorker.idCode //身份证号
         userInfo.address = data.userWorker.address //联系地址
         userInfo.resume = data.userWorker.resume //简历描述
         userInfo.id = data.userWorker.id

      }
      console.log(userInfo, data && data.userWorker, 'data && data.userWorker');
   })
   let uploadF = ref()
   let uploadB = ref()
   let isLoading = ref(false)
   let rules = {
      idCardFace: {
         required: true,
         message: '请上传身份证正面',
         trigger: ['blur', 'change']
      }, //营业执照路径
      idCardBack: {
         required: true,
         message: '请上传身份证反面',
         trigger: ['blur', 'change']
      }, //企业名称
      name: {
         required: true,
         message: '姓名不能为空',
         trigger: ['blur', 'change']
      }, //注册时间
      idCode: {
         required: true,
         message: '身份证号不能为空',
         trigger: ['blur', 'change']
      }, //联系地址
      address: {
         required: true,
         message: '联系地址不能为空',
         trigger: ['blur', 'change']
      }, //企业注册号
      resume: {
         required: true,
         message: '简历描述不能为空',
         trigger: ['blur', 'change']
      }, //公司简介
      phone: [{
         required: true,
         message: '联系电话不能为空',
         trigger: ['blur', 'change']
      }
      // ,
      // {
      //    // 自定义验证函数，见上说明
      //    validator: (rule, value, callback) => {
      //       // 上面有说，返回true表示校验通过，返回false表示不通过
      //       // uni.$u.test.mobile()就是返回true或者false的
      //       return uni.$u.test.mobile(value);
      //    },
      //    message: '联系电话不正确',
      //    // 触发器可以同时用blur和change
      //    trigger: ['change','blur'],
      // },
      ]
   }
   let status = ref(false)
   let radiolist1 = [{
         name: '男',
      },
      {
         name: '女',
   const formRef = ref()
   onReady(() => {
      formRef.value.setRules(rules);
      if (userInfo.idCardBack) {
         uploadB.value.urls = [userInfo.idCardBack]
         uploadB.value.status = ['success']
      }
   ]
   const userInfo = reactive({
      CordId: '430621198204264616',
      Name: '邹大志',
      Gender: 1
      if (userInfo.idCardFace) {
         uploadF.value.urls = [userInfo.idCardFace]
         uploadF.value.status = ['success']
      }

   })
   // 使用 reactive 创建响应式状态  
   const state = reactive({
      showSex: false,
      model1: {
         userInfo: {
            name: '',
            sex: '',
         },
      },
      actions: [{
            name: '男'
         },
         {
            name: '女'
         },
         {
            name: '保密'
         },
      ],

      radio: '',
      switchVal: false,
   onMounted(() => {
      formRef.value.setRules(rules);
      console.log(formRef.value, 'formRef'); // 访问子组件Demo中的属性
   });

   // 使用 ref 创建响应式引用  
   const formRef = ref(null);



   const IaiAddPerso = (e) => {
      status.value = !status.value
      // wx.startFacialRecognitionVerify()
      // const session = wx.createVKSession({
      //    track: {
      //       face: {
      //          mode: 1
      //       } // mode: 1 - 使用摄像头；2 - 手动传入图像
      //    },
      // })
      // // 静态图片检测模式下，每调一次 detectFace 接口就会触发一次 updateAnchors 事件
      // session.on('updateAnchors', anchors => {
      //    anchors.forEach(anchor => {
      //       console.log('anchor.points', anchor.points)
      //       console.log('anchor.origin', anchor.origin)
      //       console.log('anchor.size', anchor.size)
      //       console.log('anchor.angle', anchor.angle)
      //    })
      // })

      // // 需要调用一次 start 以启动
      // session.start(errno => {
      //    if (errno) {
      //       console.log(errno)
      //       // 如果失败，将返回 errno
      //    } else {
      //       // 否则，返回null，表示成功
      //       session.detectFace({
      //          frameBuffer, // 图片 ArrayBuffer 数据。人脸图像像素点数据，每四项表示一个像素点的 RGBA
      //          width, // 图像宽度
      //          height, // 图像高度
      //          scoreThreshold: 0.5, // 评分阈值
      //          sourceType: 1,
      //          modelMode: 1,
      //       })
      //    }
      // })
      // wx.chooseMedia({
      //    count:1,
      //    sourceType: ['camera'],
      //    mediaType: ['image'],
      //    maxDuration: 60,
      //    camera: 'front',
      //    success(res) {
      //       for (let i = 0; i < res.tempFiles.length; i++) {
      //          console.log("===111===" + res.tempFiles[i].tempFilePath)
      //          console.log("===222===" + res.tempFiles[i].size)
      //       }
      //    }
      // })
      // $api.IaiAddPerso({}, userInfo).then(res => {
      //    console.log(res, '人脸识别');
      // })
   let gender = ref()
   let idCardFaceBase64 = ref('')
   let userInfo = reactive({
      idCardFace: '', //身份证正面路径
      idCardBack: '', //身份证反面路径
      name: '', //姓名
      phone: '', //电话号码
      idCode: '', //身份证号
      address: '', //联系地址
      resume: '', //简历描述
      id: 0
   })
   const getUserInfo = () => {
      store.dispatch('getUserInfo')
   }
   // 定义方法  
   function sexSelect(e) {
      state.model1.userInfo.sex = e.name;
      if (formRef.value) {
         formRef.value.validateField('userInfo.sex');
      }
   }

   //上传图片Base64
   const uploadFilesFByBase64s = (el) => {
      $api.UpdateFileBase64({
         fileBase64: el
      }).then(res => {

         // if (res.code == 1) {

         uni.hideLoading();
         console.log(res.data.src);
         // } else {

         // }
      });
   }
   const uploadIdCard = (msg, event) => {

      // getBase64(msg.file.url).then(res => {
      //    console.log(res);
      //    // uploadFilesFByBase64s(res)
      // })
      // $api.UpdateFileBase64().then(res=>{
      //    console.log(res,'UpdateFileBase64');
      // })
      $api.UploadIdCord(msg.file.url, {
         PageName: 'Back'
      }).then(res => {
         console.log(res);
   const saveUserWorkerApi = () => {
      $api.saveUserWorker(userInfo).then(res => {
         if (res.code == 1) {
            getUserInfo()
            uni.navigateBack()
            $util.showToast({
               title: "保存成功！",
               icon: "success"
            })
         }
         isLoading.value = false
      })
      uni.showLoading({
         title: '上传中...'
      });
      // uni.getFileSystemManager().readFile({
      //    filePath: msg.file.url, // 替换为你的文件路径
      //    encoding: 'base64',
      //    success: res => {
      //       uploadFilesFByBase64s(res.data)
      //       console.log('文件内容的base64：', res.data);
      //    },
      //    fail: err => {
      //       console.error('读取文件失败：', err);
      //    }
      // });

   }
   const saveUserWorker = (e) => {
      formRef.value.validate().then(res => {
         isLoading.value = true
         console.log(idCardFaceBase64.value, 'idCardFaceBase64.value’');
         if (idCardFaceBase64.value) {
            let obj = {
               imgBase64: idCardFaceBase64.value,
               cordId: userInfo.idCode, //身份证号码
               name: userInfo.name, //姓名
               gender: gender.value == '男' ? 1 : 2 //性别
            }
            $api.IaiAddPersoBase64(obj).then(res => {
               if (res.data && res.data.isOK == true) {
                  saveUserWorkerApi()
               } else {
                  $util.showToast({
                     title: res.error
                  })
                  isLoading.value = false
               }
            })
         } else {
            saveUserWorkerApi()
         }

      }).catch(errors => {
         console.log(errors)
         uni.$u.toast(errors[0].message)
      })
   }

   //上传成功时触发
   const success = (e) => {
      console.log(e)
   const success = (text, e) => {
      //e.res 为服务器返回数据
      //上传成功回调，处理服务器返回数据【此处根据实际返回数据进行处理】
      let res = JSON.parse(e.res.data.replace(/\ufeff/g, "") || "{}")

      if (res.data.url) {
         userInfo.CordId = res.data.info.idNum
         userInfo.name = res.data.info.name
         userInfo.Gender = res.data.info.sex
         //处理结果返回给组件 
         //res.data.url为上传成功后返回的图片地址
         //e.index为图片索引值
         // this.$refs.upload.result(res.data.url, e.index)
      if (res.code == 1) {
         if (res.data.url && text == 'FRONT') {
            userInfo.idCardFace = res.data.url //身份证正面路径
            userInfo.idCode = res.data.info.idNum //身份证号
            userInfo.name = res.data.info.name
            userInfo.address = res.data.info.address
            gender.value = res.data.info.sex
         } else {
            userInfo.idCardBack = res.data.url //身份证反面路径
         }
      } else {
         uni.$u.toast(res.error)
         if (text == 'FRONT') {
            uploadF.value.deleteImage()
         } else {
            uploadB.value.deleteImage()
         }
      }

   }
   //上传失败时触发
   const error = (e) => {}
   const errorFront = (e) => {
      console.log(e, '--------------');
   }
   //选择图片或上传完成时触发
   const completeFront = (e) => {
      if (e.action == 'delete') {
         // 删除处理
         userInfo.idCardFace = '' //身份证正面路径
         userInfo.idCode = '' //身份证号
         userInfo.name = ''
         userInfo.address = ''
         gender.value = ''
         return
      }
      console.log(e, '删除')
      $util.pathToBase64(e.urls[0]).then(res => {
         idCardFaceBase64.value = res
         console.log(idCardFaceBase64, idCardFaceBase64.value);
      })
   }
   const complete = (e) => {
      if (e.action == 'delete') {
         // 删除处理
         userInfo.idCardBack = ''
      }
      console.log(e, '删除')

   }
   const jiance = (imgbuffer) => {
      // var frameBuffer =
      const session = wx.createVKSession({
         track: {
            face: {
               mode: 2
            } // mode: 1 - 使用摄像头；2 - 手动传入图像
         },
         version: 'v1'

      })
      const onFrame = timestamp => {
         console.log(webgl,'webgl');
         const frame = session.getVKFrame(webgl.width, webgl.height)
         if (frame) {
            console.log(frame);
            // renderFrame(frame)
         }
		
         session.requestAnimationFrame(onFrame)
      }
      session.start(errno => {
         if (errno) {
            // 如果失败，将返回 errno
         } else {
            // 否则，返回null，表示成功
            session.detectFace({
               frameBuffer: imgbuffer.data, // 图片 ArrayBuffer 数据。人脸图像像素点数据，每四项表示一个像素点的 RGBA
               width: imgbuffer.width, // 图像宽度
               height: imgbuffer.height,
               scoreThreshold: 0.8, // 评分阈值
               sourceType: 1,
               modelMode: 0,
            })
         }
			
         session.requestAnimationFrame(onFrame)
      })

      session.on('updateAnchors', anchors => {
         console.log("检测到人脸", anchors)

         anchors.forEach(anchor => {
            console.log('anchor.points', anchor.points)
            console.log('anchor.origin', anchor.origin)
            console.log('anchor.size', anchor.size)
            console.log('anchor.angle', anchor.angle)
         })
      })
      session.on('removeAnchors', () => {
         console.log("人脸消失", "removeAnchors")
      })
   }
</script>

@@ -334,4 +320,7 @@
   .fui-upload__item {
      margin-top: 20rpx !important;
   }
   .u-form-item__body {
      padding: 5px 0 !important;
   }
</style>