<template>
|
<div class="app-container">
|
<el-row :gutter="20">
|
<el-col :span="24">
|
<el-card class="box-card">
|
<div slot="header" class="clearfix">
|
<span>扫码下线</span>
|
</div>
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px" @submit.native.prevent>
|
<el-form-item label="序列号" prop="SNCode">
|
<input
|
v-model="form.SNCode"
|
ref="inputdata"
|
placeholder="请输入序列号"
|
style="width: 100%; height: 40px; font-size: 30px"
|
/>
|
</el-form-item>
|
|
</el-form>
|
</el-card>
|
</el-col>
|
</el-row>
|
|
</div>
|
</template>
|
|
<script>
|
import { listLocationInfo, getLocationInfo, delLocationInfo, addLocationInfo, updateLocationInfo } from "@/api/main/bs/locationInfo";
|
import {addInfo, delInfo, getInfo, listInfo, updateCollectData, updateInfo} from "@/api/main/bs/formulaChildinfo";
|
import {addPassStationCollection} from "@/api/main/da/stationCollection";
|
|
export default {
|
name: "workstationOperation",
|
data() {
|
return {
|
scannerFlag: false,
|
form: {
|
SNCode: '',
|
LocationCode: 'OP450'
|
},
|
rules: {
|
SNCode: [
|
{ required: true, message: '请输入序列号', trigger: 'blur' }
|
]
|
},
|
}
|
},
|
methods: {
|
setFocus(){
|
this.$nextTick(()=>{
|
this.$refs.inputdata.focus()
|
})
|
},
|
|
handleScannerInput(event){
|
if (this.scannerFlag){
|
this.form.SNCode = ''
|
this.$refs.inputdata.value = ''
|
this.scannerFlag = false
|
}
|
const input = event.target
|
this.form.SNCode = input.value
|
if (event.key === 'Enter'){
|
this.scannerFlag = true
|
//扫描完成
|
addPassStationCollection({SNCode:this.form.SNCode,LocationCode: this.form.LocationCode}).then(res => {
|
|
if (res.code === 200){
|
this.$message({
|
message: "扫码完成",
|
type: "success"
|
})
|
} else {
|
this.$message({
|
message: "扫码错误，请重试",
|
type: "error"
|
})
|
}
|
})
|
}
|
},
|
},
|
mounted() {
|
console.log('00')
|
this.setFocus();
|
this.$nextTick(() => {
|
if (this.$refs.inputdata){
|
this.$refs.inputdata.addEventListener('keydown',this.handleScannerInput)
|
}
|
|
})
|
|
},
|
|
beforeDestroy() {
|
this.$refs.inputdata.removeEventListener('keydown',this.handleScannerInput)
|
}
|
}
|
</script>
|
|
<style scoped>
|
.app-container {
|
padding: 20px;
|
}
|
|
/* 修改成功行的样式，添加 hover 状态 */
|
/deep/ .el-table .success-row {
|
background-color: #5ce013 !important;
|
}
|
|
/deep/ .el-table .success-row:hover > td {
|
background-color: #5ce311 !important;
|
}
|
|
.el-row {
|
margin-bottom: 20px;
|
}
|
|
.box-card {
|
/*margin-bottom: 20px;*/
|
}
|
|
.card-item {
|
display: flex;
|
align-items: center;
|
min-height: 40px;
|
}
|
|
.label {
|
min-width: 80px;
|
margin-right: 10px;
|
color: #606266;
|
line-height: 40px;
|
}
|
|
.content-item {
|
flex: 1;
|
line-height: 40px;
|
}
|
|
.content-item:not(.el-select):not(.el-input) {
|
height: 40px;
|
display: flex;
|
align-items: center;
|
}
|
|
.el-select {
|
width: 100%;
|
}
|
|
.el-input {
|
width: 100%;
|
}
|
|
/* 添加平滑滚动效果 */
|
/deep/ .el-table__body-wrapper {
|
scroll-behavior: smooth;
|
}
|
</style>
|
