Commit d42d93f5 authored by 旭艳's avatar 旭艳

问题申报页面

parent fd322d84
<template>
<div class="camera_outer">
<video id="videoCamera" :width="videoWidth" :height="videoHeight" autoplay />
<canvas id="canvasCamera" style="display:none;" :width="videoWidth" :height="videoHeight" />
<div v-if="imgSrc" class="img_bg_camera">
<img :src="imgSrc" alt="" class="tx_img">
</div>
<button @click="getCompetence()">打开摄像头</button>
<button @click="stopNavigator()">关闭摄像头</button>
<button @click="setImage()">拍照</button>
</div>
</template>
<script>
export default {
data() {
return {
videoWidth: 3000,
videoHeight: 300,
imgSrc: '',
thisCancas: null,
thisContext: null,
thisVideo: null
}
},
methods: {
change(e) {
console.log(e)
},
// 调用权限(打开摄像头功能)
getCompetence() {
var _this = this
this.thisCancas = document.getElementById('canvasCamera')
this.thisContext = this.thisCancas.getContext('2d')
this.thisVideo = document.getElementById('videoCamera')
// 旧版本浏览器可能根本不支持mediaDevices,我们首先设置一个空对象
if (navigator.mediaDevices === undefined) {
navigator.mediaDevices = {}
}
// 一些浏览器实现了部分mediaDevices,我们不能只分配一个对象
// 使用getUserMedia,因为它会覆盖现有的属性。
// 这里,如果缺少getUserMedia属性,就添加它。
if (navigator.mediaDevices.getUserMedia === undefined) {
navigator.mediaDevices.getUserMedia = function(constraints) {
// 首先获取现存的getUserMedia(如果存在)
var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.getUserMedia
// 有些浏览器不支持,会返回错误信息
// 保持接口一致
if (!getUserMedia) {
return Promise.reject(new Error('getUserMedia is not implemented in this browser'))
}
// 否则,使用Promise将调用包装到旧的navigator.getUserMedia
return new Promise(function(resolve, reject) {
getUserMedia.call(navigator, constraints, resolve, reject)
})
}
}
var 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.thisVideo) {
_this.thisVideo.srcObject = stream
} else {
// 避免在新的浏览器中使用它,因为它正在被弃用。
_this.thisVideo.src = window.URL.createObjectURL(stream)
}
_this.thisVideo.onloadedmetadata = function(e) {
_this.thisVideo.play()
}
}).catch(err => {
console.log(err)
})
},
// 绘制图片(拍照功能)
setImage() {
var _this = this
// 点击,canvas画图
_this.thisContext.drawImage(_this.thisVideo, 0, 0, _this.videoWidth, _this.videoHeight)
// 获取图片base64链接
var image = this.thisCancas.toDataURL('image/png')
_this.imgSrc = image
this.$emit('refreshDataList', this.imgSrc)
},
// base64转文件
dataURLtoFile(dataurl, filename) {
var arr = dataurl.split(',')
var mime = arr[0].match(/:(.*?);/)[1]
var bstr = atob(arr[1])
var n = bstr.length
var u8arr = new Uint8Array(n)
while (n--) {
u8arr[n] = bstr.charCodeAt(n)
}
return new File([u8arr], filename, { type: mime })
},
// 关闭摄像头
stopNavigator() {
this.thisVideo.srcObject.getTracks()[0].stop()
}
}
}
</script>
......@@ -517,7 +517,7 @@
<!-- 装配流程 -->
<AssemblyProcess ref="AssemblyProcess" />
<!-- 问题申报 -->
<!-- <ProblemDeclare ref="ProblemDeclare" /> -->
<ProblemDeclare ref="ProblemDeclare" />
<!-- 检验驳回 驳回记录 -->
<InspectionRejected ref="InspectionRejected" />
<AttachmentUpload ref="AttachmentUpload" />
......@@ -540,7 +540,7 @@ import ConfirmMaterial from './components/ConfirmMaterial/index'
import TechnicalRequirements from './components/TechnicalRequirements/index'
import AssemblyProcess from './components/AssemblyProcess/index'
import InspectionRejected from './components/chatBox/index'
// import ProblemDeclare from './components/ProblemDeclare/index'
import ProblemDeclare from './components/ProblemDeclare/index'
import RecordMaintenance from './components/RecordMaintenance/index'
// import scan from '@/components/scanCode/scanCode'
import AttachmentUpload from './components/AttachmentUpload/dialog'
......@@ -553,7 +553,8 @@ export default {
InspectionRejected,
AssemblyProcess,
RecordMaintenance,
ConfirmMaterial
ConfirmMaterial,
ProblemDeclare
},
data() {
return {
......@@ -716,6 +717,7 @@ export default {
that.headerData = {
id: data.id,
serialNumber: data.extProcessPlan.serialNumber,
positionNumber: data.extProcessPlan.positionNumber,
resName: data.extProcessPlan.planeType,
serialNo: data.extProcessPlan.sorties,
firstCheckFlag: data.extProcessPlan.firstCheckFlag === '是',
......@@ -1260,36 +1262,57 @@ export default {
*/
inspectionCompleted(dataUrl) {
var that = this
let url
if (this.$route.query.title === '适航任务执行') {
url = `/JoExecuteOpPlan/completeOp?joOpId=${that.procedureId}&joAoId=${that.headerData.id}&dmriImg=${dataUrl}`
post(
`/JoExecuteOpPlan/inspection?joOpId=${that.procedureId}&joAoId=${that.headerData.id}`,
{ dmriImg: dataUrl }
)
.then((res) => {
if (res && res.message.includes('成功')) {
that.getWorkingProcedure()
this.$message({
showClose: true,
message: res.message,
type: 'success'
})
} else {
this.$message({
showClose: true,
message: res.message,
type: 'error'
})
}
})
.catch((err) => console.error(err))
.finally(() => {
// that.editShow = false
})
} else {
url = `/JoExecuteOpPlan/completeOp?joOpId=${that.procedureId}&joAoId=${that.headerData.id}`
get(
`/JoExecuteOpPlan/completeOp?joOpId=${that.procedureId}&joAoId=${that.headerData.id}`,
{}
)
.then((res) => {
if (res && res.message.includes('成功')) {
that.getWorkingProcedure()
this.$message({
showClose: true,
message: res.message,
type: 'success'
})
} else {
this.$message({
showClose: true,
message: res.message,
type: 'error'
})
}
})
.catch((err) => console.error(err))
.finally(() => {
// that.editShow = false
})
}
get(
url,
{}
)
.then((res) => {
if (res && res.message.includes('成功')) {
that.getWorkingProcedure()
this.$message({
showClose: true,
message: res.message,
type: 'success'
})
} else {
this.$message({
showClose: true,
message: res.message,
type: 'error'
})
}
})
.catch((err) => console.error(err))
.finally(() => {
// that.editShow = false
})
},
setRejected() {
var that = this
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment