Skip to content

T
template_vue
Commit 0f1dfefb authored by liwei's avatar liwei
Browse files
Options

ocr识别

parent 3bf78e93
Show whitespace changes
Inline Side-by-side
Showing with 376 additions and 693 deletions
src/api/sample/chCheckOrder.js
View file @ 0f1dfefb
...@@ -15,3 +15,27 @@ export function aliOcr(businessId) { ...@@ -15,3 +15,27 @@ export function aliOcr(businessId) {
}) })
} }
// 获取ocr扫描数据
export function getOcrData(params) {
return request({
url: '/chcheckorder/submit',
method: 'post',
data: params,
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
}
// 新增扫描的数据
export function addOcrData(params) {
return request({
url: '/chcheckorder/add',
method: 'post',
data: params,
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
}
src/api/system/dict/data.js
View file @ 0f1dfefb
...@@ -105,3 +105,11 @@ export function importExcel(data) { ...@@ -105,3 +105,11 @@ export function importExcel(data) {
}) })
} }
// 8.根据字典类型查询字典数据信息
export function getDict(dictType) {
return request({
url: '/system/dict/data/type/' + dictType,
method: 'get'
})
}
src/views/sample/chCheckOrder/CheckOrders/ACheckOrders.vue
View file @ 0f1dfefb
...@@ -4,251 +4,32 @@ ...@@ -4,251 +4,32 @@
<el-table <el-table
:data="tableData" :data="tableData"
style="width: 100%" style="width: 100%"
:cell-style="cellStyle" :span-method="arraySpanMethod"
> >
<el-table-column <el-table-column
prop="NO" v-for="(item, index) in tableHeader"
label="规格（项目）MM" :key="index"
:label="item.label"
:prop="item.prop"
fixed fixed
/>
<el-table-column
prop="difference"
label="区分"
fixed
/>
<el-table-column
prop="measureInstrument"
label="测定器"
fixed
/>
<el-table-column
prop="one"
label="1"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.one"
:class="{ 'error-border': scope.row.error }"
style="background-color: transparent"
@change="(value)=>ocrVerify(value,scope.row,scope.column.property)"
/>
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="two"
label="2"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.two"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="three"
label="3"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.three"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="four"
label="4"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.four"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="five"
label="5"
width="130"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-input <div v-if="index < fixedColumnCount">
v-model="scope.row.five" {{ scope.row[index] }}
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div> </div>
</template>
</el-table-column>
<el-table-column
prop="six"
label="6"
width="130"
>
<template slot-scope="scope">
<el-input <el-input
v-model="scope.row.six" v-if="dataVerify(scope.row,scope.row[index],scope.column)"
:class="{ 'error-border': scope.row.error }" v-model="scope.row[index]"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)" style="background-color: transparent;"
/> />
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="seven"
label="7"
width="130"
>
<template slot-scope="scope">
<el-input <el-input
v-model="scope.row.seven" v-else
:class="{ 'error-border': scope.row.error }" v-model="scope.row[index]"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)" style="background-color: transparent;"
class="custom-input"
/> />
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column
prop="eight"
label="8"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.eight"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="nine"
label="9"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.nine"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="ten"
label="10"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.ten"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="X"
label="X"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.X"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="R"
label="R"
width="130"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.R"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column.property)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
<el-table-column
prop="res"
label="结果"
width="130"
fixed="right"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.res"
:class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.$index,scope.column)"
/>
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message">
{{ scope.row.error }}
</div>
</template>
</el-table-column>
</el-table> </el-table>
</el-form> </el-form>
...@@ -256,411 +37,235 @@ ...@@ -256,411 +37,235 @@
</template> </template>
<script> <script>
import Schema from 'async-validator' import { getDict } from '../../../../api/system/dict/data'
export default { export default {
props: { props: {
ocrArray: { ocrArray: {
default: '', default: () => [],
type: String type: Array
} }
}, },
data() { data() {
return { return {
dataTemplate: [{ // 列表表头长度
one: undefined, tableHeaderLength: 0,
two: undefined, // 固定的列数据数
three: undefined, fixedColumnCount: 0,
four: undefined, // 列表数据
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined
}],
tableData: [ tableData: [
{ // {
NO: 'A', // 0: 'A',
difference: '天津威晟', // 1: '180+0/-0.5',
measureInstrument: '卡尺', // 2: '天津威晟',
one: undefined, // 3: '卡尺',
two: undefined, // 4: undefined,
three: undefined, // 5: undefined,
four: undefined, // 6: undefined,
five: undefined, // 7: undefined,
six: undefined, // 8: undefined,
seven: undefined, // 9: undefined,
eight: undefined, // 10: undefined,
nine: undefined, // 11: undefined,
ten: undefined, // 12: undefined,
X: undefined, // 13: undefined,
R: undefined, // 14: undefined,
res: undefined, // 15: undefined
error: {}, // }
col: 0 ],
}, tableHeader: [
{ // { label: '项目', prop: '0' },
NO: 'B', // { label: '规格', prop: '1' },
difference: '天津威晟', // { label: '区分', prop: '2' },
measureInstrument: '卡尺', // { label: '测定器', prop: '3' },
one: undefined, // { label: '1', prop: '4' },
two: undefined, // { label: '2', prop: '5' },
three: undefined, // { label: '3', prop: '6' },
four: undefined, // { label: '4', prop: '7' },
five: undefined, // { label: '5', prop: '8' },
six: undefined, // { label: '6', prop: '9' },
seven: undefined, // { label: '7', prop: '10' },
eight: undefined, // { label: '8', prop: '11' },
nine: undefined, // { label: '9', prop: '12' },
ten: undefined, // { label: '10', prop: '13' },
X: undefined, // { label: 'X', prop: '14' },
R: undefined, // { label: 'R', prop: '15' },
res: undefined, // { label: '结果', prop: '16' }
error: {},
col: 1
},
{
NO: 'C',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 2
},
{
NO: 'F',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 3
},
{
NO: 'E',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 4
},
{
NO: 'M',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 5
},
{
NO: 'M',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 6
},
{
NO: 'L',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 7
},
{
NO: 'N',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 8
},
{
NO: 'W1',
difference: '天津威晟',
measureInstrument: '卡尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 9
},
{
NO: '重量',
difference: '天津威晟',
measureInstrument: '电子称',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 10
},
{
NO: 'xxx',
difference: '天津威晟',
measureInstrument: '目测',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 11
},
{
NO: '边缘强度',
difference: '天津威晟',
measureInstrument: '目测',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 12
},
{
NO: '弯曲变形',
difference: '天津威晟',
measureInstrument: '钢板尺',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 13
},
{
NO: '破坏强度',
difference: '天津威晟',
measureInstrument: '拉力计',
one: undefined,
two: undefined,
three: undefined,
four: undefined,
five: undefined,
six: undefined,
seven: undefined,
eight: undefined,
nine: undefined,
ten: undefined,
X: undefined,
R: undefined,
res: undefined,
error: {},
col: 14
}
] ]
} }
}, },
watch: { watch: {
ocrArray: { ocrArray: {
handler(newValue, oldValue) { handler(newValue, oldValue) {
const ocrResArr = JSON.parse(this.ocrArray) // 循环this.tableData i代表第几行
// 去除已识别的行数 for (let i = 0; i < this.tableData.length; i++) {
ocrResArr.splice(0, 1) for (let j = 0; j < newValue[i].length; j++) {
// 识别的数组与对象的映射 // 使用 Vue.set 确保响应式更新（Vue 2）
const keys = Object.keys(this.dataTemplate[0]) this.$set(this.tableData[i], this.fixedColumnCount + j, newValue[i][j])
const res = ocrResArr.map(subArr => { // 或者在 Vue 3 中可以直接赋值
const obj = {} // this.tableData[i][this.fixedColumnCount + j] = newValue[i][j];
keys.forEach((key, index) => { }
// 从索引 3 开始取值（即忽略前三个元素） }
const value = subArr[index + 4] // 计算当前行的数据是否合格
obj[key] = value !== undefined ? value : undefined },
}) deep: true
return obj },
}) tableData: {
this.ocrRender(res) handler(newValue, oldValue) {
this.$emit('afterUpdate', newValue)
}, },
deep: true deep: true
} }
}, },
created() {
// 获取OCR模版1配置
this.getDictOcrTemplate1()
},
methods: { methods: {
ocrRender(res) { // 合并最后一行的单元格
for (let i = 0; i < res.length; i++) { arraySpanMethod({ row, column, rowIndex, columnIndex }) {
// 合并当前行数据与 OCR 数据，并确保 error 对象存在 // 假设表格数据存储在 this.tableData 中
const newRow = { const lastRowIndex = this.tableData.length - 1 // 最后一行的行号
...this.tableData[i], // 保留原有数据（如 NO/difference 等） const lastColumnIndex = this.tableHeader.length - 1 // 最后一列的列号
...res[i], // 覆盖 OCR 识别的数值字段（one/two...） // 如果当前单元格是最后一行，并且列索引为第 5 列（索引为 4）
error: { if (rowIndex === lastRowIndex && columnIndex === 4) {
...(this.tableData[i].error || {}), // 保留已有错误状态 // 合并从第 5 列（索引为 4）到最后一列
...(res[i].error || {}) // 合并 OCR 可能的错误信息（可选） return [1, lastColumnIndex - 4 + 1] // 跨 1 行，跨 (lastColumnIndex - 4 + 1) 列
} }
// 如果当前单元格是最后一行，并且列索引大于第 5 列，则跳过这些单元格
if (rowIndex === lastRowIndex && columnIndex > 4) {
return [0, 0] // 跳过该单元格
} }
// 其他情况保持默认
// 使用 Vue.set 触发响应式更新 return [1, 1]
this.$set(this.tableData, i, newRow)
}
}, },
ocrVerify(value, row, field) { // 数据校验
console.log(field) dataVerify(rowData, columnData, column) {
const schema = new Schema({ // 判断该列是否需要校验,X、R列不需要校验
[field]: { if (column.label === 'X' || column.label === 'R') {
type: 'number', return true
required: true,
message: '请输入有效数值'
} }
}) // 数据为空
schema.validate({ [field]: value }, (errors) => { if (columnData === '' || columnData === null || columnData === undefined) {
if (errors) { return true
this.$set(row.error, field, errors[0].message) }
// 判断当前行数据是否需要校验
if (!rowData[1].includes('+') && !rowData[1].includes('-') && !rowData[1].includes('/')) {
return true
}
if (column.label === '结果') {
// 校验整行数据，只要有一个数据不符合条件 就将结果改为NO
// 获取rowData第4个数据及以后得数据
const keys = Object.keys(rowData).map(Number)
// 过滤出第4个及其以后的键（索引从0开始，所以"3"是第4个）
const startIndex = 4
const endIndex = keys.length - 3 // 最后 3 个数据之前的结束索引
const filteredKeys = keys.slice(startIndex, endIndex)
// 根据过滤后的键名数组提取对应的值
// 根据过滤后的键名数组提取对应的值，并生成数组
const result = filteredKeys.map(key => rowData[key])
// 遍历result
for (let i = 0; i < result.length; i++) {
const matches = rowData[1].match(/-?\d+(\.\d+)?/g)
if (rowData[1] !== '' && rowData[1] !== null && rowData[1] !== undefined) {
if (rowData[1].includes('+') && rowData[1].includes('-') && rowData[1].includes('/')) {
const baseValue = parseFloat(matches[0]) // 提取第一个数字
const offset = parseFloat(matches[1]) // 提取第二个数字
const deviation = parseFloat(matches[2]) // 提取第三个数字(带符号了)
// 计算范围
const upperBound = baseValue + offset // 上限
const lowerBound = baseValue + deviation// 下限
// 判断columnData是否在lowerBound和upperBound之间
if (result[i] >= lowerBound && result[i] <= upperBound) {
// 在范围之间
this.$set(rowData, column.property, 'OK')
return true
} else { } else {
this.$delete(row.error, field) // 不在范围之间
this.$set(rowData, column.property, 'NO')
return false
}
}
}
}
} else {
const matches = rowData[1].match(/-?\d+(\.\d+)?/g)
if (rowData[1] !== '' && rowData[1] !== null && rowData[1] !== undefined) {
if (rowData[1].includes('+') && rowData[1].includes('-') && rowData[1].includes('/')){
if (rowData[1] && rowData[1].length >= 3) {
const baseValue = parseFloat(matches[0]) // 提取第一个数字
const offset = parseFloat(matches[1]) // 提取第二个数字
const deviation = parseFloat(matches[2]) // 提取第三个数字(带符号了)
// 计算范围
const upperBound = baseValue + offset // 上限
const lowerBound = baseValue + deviation// 下限
// 判断columnData是否在lowerBound和upperBound之间
if (columnData >= lowerBound && columnData <= upperBound) {
// console.log(columnData + '在范围之间')
return true
} else {
// console.log(columnData + '不在范围之间')
return false
}
}
}
}
} }
})
}, },
cellStyle({ row, column }) { // 获取OCR模版配置
const value = row[column.property] getDictOcrTemplate1() {
const hasError = !!row.error[column.property] getDict('ocr_template1').then(res => {
const templateData = res.data
// 空值或存在错误时变红 // 找出templateData里的所有dictLabel,并变成一个数组
if ( // const dictLabels = templateData.map(item => item.dictLabel)
value === '' || const dictRemarks = templateData.map(item => item.remarks)
value === null || // console.log('dictLabels:', dictLabels)
value === undefined || // console.log('dictRemarks:', dictRemarks)
hasError // 遍历templateData
) { for (let i = 0; i < templateData.length; i++) {
return { const rowData = templateData[i]
backgroundColor: 'red' // 半透明红色 // 按逗号分割rowData的dictValue
// console.log('rowData:', rowData)
const values = rowData.dictValue.split('，')
this.fixedColumnCount = values.length
// 往table表格里放值，但排除row1表头
if (rowData.dictLabel !== 'row1') {
const result = {}
// 处理第二个位置的数据
for (let j = 0; j < values.length; j++) {
if (j === 1) {
// 将备注按逗号分隔，放入第二个位置
const dictRemarksArr = dictRemarks[i].split('，')
if (dictRemarksArr.length === 1) {
result[j] = dictRemarksArr[0]
} else if (dictRemarksArr.length === 2) {
result[j] = dictRemarksArr[0] + '+' + dictRemarksArr[1]
} else if (dictRemarksArr.length === 3) {
result[j] = dictRemarksArr[0] + '+' + dictRemarksArr[1] + '/' + '-' + dictRemarksArr[2]
} else if (dictRemarksArr.length === 4) {
result[j] = dictRemarksArr[0] + '+' + dictRemarksArr[1] + '/' + '-' + dictRemarksArr[2] + dictRemarksArr[3]
}
} else {
result[j] = values[j]
} }
} }
return {} this.tableData.push(result)
}
if (rowData.dictLabel === 'row1') {
// 获取表头数据 循环values
for (let i = 0; i < values.length; i++) {
const params = {
label: values[i],
prop: i + ''
}
this.tableHeader.push(params)
}
this.tableHeaderLength = this.tableHeader.length
}
// console.log('this.tableHeader:', this.tableHeader)
// console.log('this.tableData:', this.tableData)
}
})
} }
} }
} }
...@@ -677,4 +282,11 @@ export default { ...@@ -677,4 +282,11 @@ export default {
color: #ff0000; color: #ff0000;
font-size: 12px; font-size: 12px;
} }
::v-deep .el-input__inner {
padding-left: 5px;
padding-right: 0px;
}
.custom-input ::v-deep input {
color: red !important; /* 确保覆盖默认样式 */
}
</style> </style>
src/views/sample/chCheckOrder/index.vue
View file @ 0f1dfefb
...@@ -117,8 +117,8 @@ ...@@ -117,8 +117,8 @@
<el-col :span="6"> <!-- 每列占 12 格（总 24 格） --> <el-col :span="6"> <!-- 每列占 12 格（总 24 格） -->
<el-form-item label="请选择订单类型"> <el-form-item label="请选择订单类型">
<el-select v-model="subType" placeholder="小类型" @change="selectHandler"> <el-select v-model="subType" placeholder="小类型" @change="selectHandler">
<el-option label="a1" value="a1" /> <el-option label="type1" value="1" />
<el-option label="a2" value="a2" /> <el-option label="type2" value="2" />
</el-select> </el-select>
</el-form-item> </el-form-item>
...@@ -129,7 +129,7 @@ ...@@ -129,7 +129,7 @@
<el-upload <el-upload
action="http://localhost:8089/common2oss/upload?temp=temp" action="http://localhost:8089/common2oss/upload?temp=temp"
multiple multiple
:on-success="saveBusId" :on-success="updateFileSuccess"
> >
<i class="el-icon-upload" /> <i class="el-icon-upload" />
<el-button type="primary">点击上传</el-button> <el-button type="primary">点击上传</el-button>
...@@ -139,23 +139,23 @@ ...@@ -139,23 +139,23 @@
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="识别结果"> <el-form-item label="识别结果">
<el-select v-model="wrSelected" placeholder="识别结果"> <el-select v-model="ocrResult" placeholder="识别结果" disabled>
<el-option <el-option
v-for="val in wrVal" v-for="val in ocrResultSelect"
:key="val.value" :key="val.value"
:value="val.value" :value="val.value"
:label="val.label" :label="val.label"
/> />
</el-select>
</el-select></el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
<div v-if="showSelectedTableA1"> <div v-if="showModelType1">
<ACheckOrders :ocr-array="ocrArray" /> <ACheckOrders :ocr-array="ocrArray" @afterUpdate="getAfterUpdateData"/>
</div> </div>
<div v-if="showSelectedTableA2"> <div v-if="showModelType2">
<BCheckOrders :ocr-array="ocrArray" /> <BCheckOrders :ocr-array="ocrArray" />
</div> </div>
<div <div
...@@ -176,7 +176,7 @@ ...@@ -176,7 +176,7 @@
</template> </template>
<script> <script>
import { queryList, aliOcr } from '@/api/sample/chCheckOrder' import { queryList, getOcrData, addOcrData } from '@/api/sample/chCheckOrder'
import { parseTime } from '@/utils' import { parseTime } from '@/utils'
import BCheckOrders from '@/views/sample/chCheckOrder/CheckOrders/BCheckOrders.vue' import BCheckOrders from '@/views/sample/chCheckOrder/CheckOrders/BCheckOrders.vue'
import ACheckOrders from '@/views/sample/chCheckOrder/CheckOrders/ACheckOrders.vue' import ACheckOrders from '@/views/sample/chCheckOrder/CheckOrders/ACheckOrders.vue'
...@@ -189,6 +189,7 @@ export default { ...@@ -189,6 +189,7 @@ export default {
title: '', title: '',
open: false, open: false,
form: {}, form: {},
// 校验规则
rules: { rules: {
file: [ file: [
{ required: true, message: '请输入文件', trigger: 'blur' }, { required: true, message: '请输入文件', trigger: 'blur' },
...@@ -223,25 +224,27 @@ export default { ...@@ -223,25 +224,27 @@ export default {
basicinfoMationList: [], basicinfoMationList: [],
showPdfTable01: false, showPdfTable01: false,
showPdfTable02: false, showPdfTable02: false,
// 大类型
type: '', type: '',
// 小类型
subType: '', subType: '',
// table列表数据
showSelectedTableA1: false, tableData: [],
showSelectedTableA2: false, // 模版1展示
wrVal: [ showModelType1: false,
{ // 模版2展示
value: 1, showModelType2: false,
label: '正确' // 总识别结果下拉框
}, ocrResultSelect: [
{ { value: '1', label: '正确' },
value: 0, { value: '0', label: '错误' }
label: '错误'
}
], ],
wrSelected: '', // 总识别结果
businessId: '', ocrResult: '',
ocrArray: '', // 上传的图片id
ocrData: [] pictureId: '',
// 扫描得到的数据
ocrArray: ''
} }
}, },
/** 路由离开前存储筛选条件*/ /** 路由离开前存储筛选条件*/
...@@ -264,6 +267,25 @@ export default { ...@@ -264,6 +267,25 @@ export default {
this.getList() this.getList()
}, },
methods: { methods: {
// 获取修改后的整个table列表数据
getAfterUpdateData(value) {
// 遍历value 取最后一个值，如果有一个NO则为错误
// for (let i = 0; i < value.length; i++) {
// if (value[i][value[i].length - 1] === 'NO') {
// this.ocrResult = '0'
// } else {
// this.ocrResult = '1'
// }
// }
this.tableData = JSON.parse(JSON.stringify(value))
// 遍历value
for (let i = 0; i < this.tableData.length; i++) {
const keys = Object.keys(this.tableData[i]) // 获取对象的所有键
for (let j = 0; j < Math.min(4, keys.length); j++) {
delete this.tableData[i][keys[j]] // 删除前四个键值对
}
}
},
// 回车跳转下一个输入框 // 回车跳转下一个输入框
focusNextInput(form) { focusNextInput(form) {
this.$nextTick(() => { this.$nextTick(() => {
...@@ -308,36 +330,47 @@ export default { ...@@ -308,36 +330,47 @@ export default {
}, },
// 提交 // 提交
submitForm() { submitForm() {
this.$refs.form.validate((valid) => { const params = {
if (valid) { chType: '1',
// 校验通过，提交表单或进行其他操作 chStype: '1',
if (this.form.businessId !== undefined) { chResult: '成功',
updataInfo(this.form).then(res => { chAlter: '1',
if (res.code === 200) { chFile: 129,
this.open = false chjson: JSON.stringify(this.tableData)
this.$message.success('操作成功')
this.getList()
this.reFrom()
this.queryParams.page = 1
} else if (res.code === null) {
this.$message.error(res.message)
}
})
} else {
add(this.form).then(res => {
if (res.code === 200) {
this.open = false
this.$message.success('操作成功')
this.getList()
this.reFrom()
this.queryParams.page = 1
} else if (res.code === null) {
this.$message.error(res.message)
}
})
}
} }
addOcrData(params).then(res => {
}) })
// this.$refs.form.validate((valid) => {
// if (valid) {
// // 校验通过，提交表单或进行其他操作
// if (this.form.businessId !== undefined) {
// updataInfo(this.form).then(res => {
// if (res.code === 200) {
// this.open = false
// this.$message.success('操作成功')
// this.getList()
// this.reFrom()
// this.queryParams.page = 1
// } else if (res.code === null) {
// this.$message.error(res.message)
// }
// })
// } else {
// add(this.form).then(res => {
// if (res.code === 200) {
// this.open = false
// this.$message.success('操作成功')
// this.getList()
// this.reFrom()
// this.queryParams.page = 1
// } else if (res.code === null) {
// this.$message.error(res.message)
// }
// })
// }
// }
// })
}, },
// 初始化获取数据 // 初始化获取数据
getList() { getList() {
...@@ -373,8 +406,9 @@ export default { ...@@ -373,8 +406,9 @@ export default {
handleExport() { handleExport() {
}, },
// 开始识别
startOcr() { startOcr() {
this.ocr(this.businessId) this.ocr(this.pictureId)
}, },
cancel() { cancel() {
this.open = false this.open = false
...@@ -391,36 +425,41 @@ export default { ...@@ -391,36 +425,41 @@ export default {
} }
this.$refs.form.clearValidate() this.$refs.form.clearValidate()
}, },
handleChange(value) { // 上传图片成功后的回调方法
switch (value[0]) { updateFileSuccess(res) {
case 'a': this.pictureId = res.data.businessId
this.showPdfTable01 = true
this.showPdfTable02 = false
break
case 'b':
this.showPdfTable01 = false
this.showPdfTable02 = true
break
}
}, },
saveBusId(res) { // 获取识别数据
this.businessId = res.data.businessId ocr(pictureId) {
}, const params = {
ocr(businessId) { businessId: 129,
aliOcr(businessId).then(res => { type: 1
this.ocrArray = res.data.chJson }
// console.log(ocrArray) getOcrData(params).then(res => {
this.ocrArray = res.data
// 遍历this.ocrArray 将最后一项全部改为OK for循环
for (let i = 0; i < this.ocrArray.length; i++) {
if (this.ocrArray[i].length > 0) {
if (i !== this.ocrArray.length - 1) {
// 不是最后一行数据
this.ocrArray[i][this.ocrArray[i].length - 1] = 'OK'// 修改最后一个元素
} else {
// 最后一行数据
this.ocrArray[i][0] = 'OK'// 修改最后一个元素
}
}
}
}) })
}, },
selectHandler(val) { selectHandler(val) {
switch (val) { switch (val) {
case 'a1': case '1':
this.showSelectedTableA1 = true this.showModelType1 = true
this.showSelectedTableA2 = false this.showModelType2 = false
break break
case 'a2': case '2':
this.showSelectedTableA2 = true this.showModelType2 = true
this.showSelectedTableA1 = false this.showModelType1 = false
break break
} }
} }
......
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