firstTestreview

This commit is contained in:
shijing 2022-02-23 10:52:21 +08:00
parent 52b0f469d9
commit e00ecae3e7
3 changed files with 110 additions and 30 deletions

View File

@ -1,11 +1,11 @@
<template>
<div style="width: 600px;height: 500px;background: #000000;margin:50px auto 0 auto;">
<div style="margin-left: 100px;">
<div class="faceLoginWrap">
<div style="height: 500px;">
<div class="video-box">
<video id="video" width="400" height="500" preload autoplay loop muted></video>
<canvas id="canvas" width="400" height="500"></canvas>
<video id="video" width="500" height="500" preload autoplay loop muted></video>
<canvas id="canvas" width="500" height="500"></canvas>
</div>
<canvas id="screenshotCanvas" width="400" height="500"></canvas>
<canvas id="screenshotCanvas" width="500" height="500"></canvas>
</div>
</div>
</template>
@ -130,7 +130,8 @@
let imgData = {base64:img};
faceLogin(imgData).then((res) => {
if (res.code >= 200) {
that.$emit('func',res.data.access);
let item= {name:res.data.username,token:res.data.access};
that.$emit('func',item);
that.$message.success("身份认证成功!");
}else{
// 打开锁
@ -150,6 +151,15 @@
}
</script>
<style scoped>
.faceLoginWrap{
padding: 50px;
width: 600px;
height: 600px;
background: #000000;
margin:50px auto 0 auto;
box-sizing: border-box;
}
#screenshotCanvas {
display: none;
}
@ -163,6 +173,13 @@
text-align: center;
}
#video {
object-fit: fill;
-webkit-border-radius: 250px;
-moz-border-radius: 250px;
border-radius: 250px;
}
video, canvas {
position: absolute;
top: 0;

View File

@ -1,16 +1,16 @@
<template>
<div style="width: 600px;height: 500px;background: #000000;margin:50px auto 0 auto;">
<div style="margin-left: 100px;">
<div class="faceLoginWrap">
<div style="height: 500px;">
<div class="video-box">
<video id="video" width="400" height="500" preload autoplay loop muted></video>
<canvas id="canvas" width="400" height="500"></canvas>
<video id="video" width="500" height="500" preload autoplay loop muted></video>
<canvas id="canvas" width="500" height="500"></canvas>
</div>
<canvas id="screenshotCanvas" width="400" height="500"></canvas>
<canvas id="screenshotCanvas" width="500" height="500"></canvas>
</div>
</div>
</template>
<script>
import { clockRecord } from '@/api/hrm'
import {clockRecord} from '@/api/hrm'
import tracking from '@/assets/tracking/build/tracking-min.js';
import '@/assets/tracking/build/data/face-min.js';
@ -26,7 +26,7 @@
this.openTheCamera();
},
methods: {
openTheCamera () {
openTheCamera() {
this.$nextTick(function () {
let _this = this;
this.video = document.getElementById('video');
@ -52,7 +52,10 @@
})
}
}
let constraints = { audio: false, video: { width: this.videoWidth, height: this.videoHeight, transform: 'scaleX(-1)' } };
let constraints = {
audio: false,
video: {width: this.videoWidth, height: this.videoHeight, transform: 'scaleX(-1)'}
};
navigator.mediaDevices.getUserMedia(constraints).then(function (stream) {
// 旧的浏览器可能没有srcObject
if ('srcObject' in _this.video) {
@ -96,7 +99,7 @@
context.strokeRect(rect.x, rect.y, rect.width, rect.height);
// window.plot(rect.x, rect.y, rect.width, rect.height+20);
// 避免重复发送请求
if(!_this.uploadLock){
if (!_this.uploadLock) {
_this.uploadLock = true;
// 上传图片
_this.screenshotAndUpload();
@ -115,31 +118,40 @@
ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
let base64Img = canvas.toDataURL('image/jpeg');
let img = base64Img.split(',')[1];
let imgData = {base64:img};
let imgData = {base64: img};
clockRecord(imgData).then((res) => {
if (res.code === 200&&res.data.id) {
this.$message.success(res.data.name+'签到成功!');
setTimeout(()=>{
if (res.code === 200 && res.data.id) {
this.$message.success(res.data.name + '签到成功!');
setTimeout(() => {
that.uploadLock = false;
},3000)
}else{
}, 3000)
} else {
// 打开锁
that.uploadLock = false;
this.$message.error(res.msg);
}
}).catch(()=>{
}).catch(() => {
// 打开锁
that.uploadLock = false;
// this.$message.error('面部识别失败请重新验证');
});
},
closeCamera () {
closeCamera() {
this.video.srcObject.getTracks()[0].stop();
},
}
}
</script>
<style scoped>
.faceLoginWrap{
padding: 50px;
width: 600px;
height: 600px;
background: #000000;
margin:50px auto 0 auto;
box-sizing: border-box;
}
#screenshotCanvas {
display: none;
}
@ -147,8 +159,13 @@
.video-box {
margin: auto;
position: relative;
/*width: 90%;
height: 90%;*/
}
#video {
object-fit: fill;
-webkit-border-radius: 250px;
-moz-border-radius: 250px;
border-radius: 250px;
}
video, canvas {

View File

@ -153,6 +153,36 @@
<span>{{item.field_value}}</span>
</div>
</el-col>
<el-col :span="12" v-if="achieve">
<div class="items">
<span class="itemLabel">工序负责人</span>
<span>{{leader_1}}</span>
</div>
</el-col>
<el-col :span="12" v-if="achieve">
<div class="items">
<span class="itemLabel">技术负责人</span>
<span>{{leader_2}}</span>
</div>
</el-col>
<el-col :span="12" v-if="achieve">
<div class="items">
<span class="itemLabel">总检</span>
<span>{{leader_3}}</span>
</div>
</el-col>
<el-col :span="12" v-if="achieve">
<div class="items">
<span class="itemLabel">首件检查时间</span>
<span>{{update_time}}</span>
</div>
</el-col>
<el-col :span="12" v-if="achieve">
<div class="items">
<span class="itemLabel">首件审批时间</span>
<span>{{first_sign_time}}</span>
</div>
</el-col>
<el-col v-for="item in fieldList" :key="item.id" :span="24">
<div class="items" v-if="item.field_type==='draw'" style="height: 400px">
<span class="itemLabel">{{item.field_name}}</span>
@ -234,6 +264,8 @@
recordVisible:false,
is_midtesting:false,
formName:'首件确认检查表',
update_time:'',
first_sign_time:'',
}
},
methods: {
@ -297,8 +329,10 @@
that.leader_1 = scope.row.leader_1_?scope.row.leader_1_.name:null;
that.leader_2 = scope.row.leader_2_?scope.row.leader_2_.name:null;
that.leader_3 = scope.row.leader_3_?scope.row.leader_3_.name:null;
that.first_sign_time = scope.row.first_sign_time?scope.row.first_sign_time:'';
getTestRecordItem(scope.row.first_test).then((res) => {
that.formName = res.data.form_.name;
that.update_time = res.data.update_time;
let fieldList = res.data.record_data;
that.fieldList = [...fieldList];
let arr = fieldList.filter(item => {
@ -374,10 +408,11 @@
that.recordVisible = false;
that.getTableData();
} else {
this.$message.error(res.msg)
that.$message.error(res.msg)
}
}).catch((err) => {
console.error(err);
// console.error(err);
that.$message.error(err)
});
},
//提交首件检查
@ -396,10 +431,10 @@
}
});
} else {
this.$message.error(res.msg)
that.$message.error(res.msg)
}
}).catch((err) => {
console.error(err);
that.$message.error(err);
});
},
//再次点击首件检验
@ -447,9 +482,20 @@
//获取人脸数据
getMsgFormSon(data){
let that =this;
firstAudit(that.planId,{leader:that.leader ,token : data}).then(res=>{
if(that.leader==='leader_1'){
that.leader_1=data.name;
}else if(that.leader==='leader_2'){
that.leader_2=data.name;
}else if(that.leader==='leader_3'){
that.leader_3=data.name;
}
firstAudit(that.planId,{leader:that.leader ,token : data.token}).then(res=>{
if(res.code===200){
this.limitedPhoto = false;
if(that.leader_1!==null&&that.leader_2!==null&&that.leader_3!==null){
this.reviewVisible = false;
}
that.getTableData();
}
})
},