Commit 3bf78e93 authored by Zachary's avatar Zachary

feat(新增):单元格按需变色

parent 8348ee8e
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
}, },
"dependencies": { "dependencies": {
"@riophae/vue-treeselect": "^0.4.0", "@riophae/vue-treeselect": "^0.4.0",
"async-validator": "^4.2.5",
"axios": "0.18.1", "axios": "0.18.1",
"bpmn-js": "^6.1.1", "bpmn-js": "^6.1.1",
"bpmn-js-properties-panel": "^0.33.1", "bpmn-js-properties-panel": "^0.33.1",
......
...@@ -32,9 +32,10 @@ ...@@ -32,9 +32,10 @@
<el-input <el-input
v-model="scope.row.one" v-model="scope.row.one"
:class="{ 'error-border': scope.row.error }" :class="{ 'error-border': scope.row.error }"
@change="(value)=>ocrVerify(value,scope.row,scope.row.index,scope.column.index)" style="background-color: transparent"
@change="(value)=>ocrVerify(value,scope.row,scope.column.property)"
/> />
<!-- 错误提示 -->
<div v-if="scope.row.error" class="error-message"> <div v-if="scope.row.error" class="error-message">
{{ scope.row.error }} {{ scope.row.error }}
</div> </div>
...@@ -298,7 +299,7 @@ export default { ...@@ -298,7 +299,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 0 col: 0
}, },
{ {
...@@ -318,7 +319,7 @@ export default { ...@@ -318,7 +319,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 1 col: 1
}, },
{ {
...@@ -338,7 +339,7 @@ export default { ...@@ -338,7 +339,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 2 col: 2
}, },
{ {
...@@ -358,7 +359,7 @@ export default { ...@@ -358,7 +359,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 3 col: 3
}, },
{ {
...@@ -378,7 +379,7 @@ export default { ...@@ -378,7 +379,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 4 col: 4
}, },
{ {
...@@ -398,7 +399,7 @@ export default { ...@@ -398,7 +399,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 5 col: 5
}, },
{ {
...@@ -418,7 +419,7 @@ export default { ...@@ -418,7 +419,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 6 col: 6
}, },
{ {
...@@ -438,7 +439,7 @@ export default { ...@@ -438,7 +439,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 7 col: 7
}, },
{ {
...@@ -458,7 +459,7 @@ export default { ...@@ -458,7 +459,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 8 col: 8
}, },
{ {
...@@ -478,7 +479,7 @@ export default { ...@@ -478,7 +479,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 9 col: 9
}, },
{ {
...@@ -498,7 +499,7 @@ export default { ...@@ -498,7 +499,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 10 col: 10
}, },
{ {
...@@ -518,7 +519,7 @@ export default { ...@@ -518,7 +519,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 11 col: 11
}, },
{ {
...@@ -538,7 +539,7 @@ export default { ...@@ -538,7 +539,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 12 col: 12
}, },
{ {
...@@ -558,7 +559,7 @@ export default { ...@@ -558,7 +559,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 13 col: 13
}, },
{ {
...@@ -578,7 +579,7 @@ export default { ...@@ -578,7 +579,7 @@ export default {
X: undefined, X: undefined,
R: undefined, R: undefined,
res: undefined, res: undefined,
error: '', error: {},
col: 14 col: 14
} }
] ]
...@@ -588,8 +589,6 @@ export default { ...@@ -588,8 +589,6 @@ export default {
watch: { watch: {
ocrArray: { ocrArray: {
handler(newValue, oldValue) { handler(newValue, oldValue) {
// console.log('ocrArray11111111111111', this.ocrArray)
const ocrResArr = JSON.parse(this.ocrArray) const ocrResArr = JSON.parse(this.ocrArray)
// 去除已识别的行数 // 去除已识别的行数
ocrResArr.splice(0, 1) ocrResArr.splice(0, 1)
...@@ -612,52 +611,54 @@ export default { ...@@ -612,52 +611,54 @@ export default {
methods: { methods: {
ocrRender(res) { ocrRender(res) {
for (let i = 0; i < res.length; i++) { for (let i = 0; i < res.length; i++) {
this.tableData[i].one = res[i].one // 合并当前行数据与 OCR 数据,并确保 error 对象存在
this.tableData[i].two = res[i].two const newRow = {
this.tableData[i].three = res[i].three ...this.tableData[i], // 保留原有数据(如 NO/difference 等)
this.tableData[i].four = res[i].four ...res[i], // 覆盖 OCR 识别的数值字段(one/two...)
this.tableData[i].five = res[i].five error: {
this.tableData[i].six = res[i].six ...(this.tableData[i].error || {}), // 保留已有错误状态
this.tableData[i].seven = res[i].seven ...(res[i].error || {}) // 合并 OCR 可能的错误信息(可选)
this.tableData[i].eight = res[i].eight }
this.tableData[i].nine = res[i].nine
this.tableData[i].ten = res[i].ten
this.tableData[i].X = res[i].X
this.tableData[i].R = res[i].R
this.tableData[i].res = res[i].res
} }
},
ocrVerify(value, rowDatas, row, col) {
console.log('#####', row, '????', col)
// 定义校验规则 // 使用 Vue.set 触发响应式更新
this.$set(this.tableData, i, newRow)
}
},
ocrVerify(value, row, field) {
console.log(field)
const schema = new Schema({ const schema = new Schema({
one: { [field]: {
type: 'string', type: 'number',
required: true, required: true,
message: '字段不能为空' message: '请输入有效数值'
} }
// 其他规则...
}) })
schema.validate({ [field]: value }, (errors) => {
// 执行校验
schema.validate({ one: value }, (errors) => {
console.log(value)
if (errors) { if (errors) {
console.log(errors) this.$set(row.error, field, errors[0].message)
// 将错误信息更新到当前行
rowDatas.error = errors[0].message
} else { } else {
rowDatas.error = '' // 校验通过,清空错误 this.$delete(row.error, field)
} }
}) })
}, },
cellStyle({ row, column, rowIndex, columnIndex }) { cellStyle({ row, column }) {
row.row = rowIndex const value = row[column.property]
column.index = columnIndex const hasError = !!row.error[column.property]
/* if (row.error.length > 0 && column.property && column) {
return { 'border': '2px red solid' } // 空值或存在错误时变红
}*/ if (
value === '' ||
value === null ||
value === undefined ||
hasError
) {
return {
backgroundColor: 'red' // 半透明红色
}
}
return {}
} }
} }
...@@ -666,5 +667,14 @@ export default { ...@@ -666,5 +667,14 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
/*.el-input /deep/ .el-input__inner {
border-color: transparent !important;
}*/
/* 错误提示样式 */
.error-message {
color: #ff0000;
font-size: 12px;
}
</style> </style>
...@@ -122,7 +122,7 @@ module.exports = { ...@@ -122,7 +122,7 @@ module.exports = {
// target: `http://192.144.239.97:20070/`, // target: `http://192.144.239.97:20070/`,
// === // ===
// target: `http://192.168.1.37:8088/`, // target: `http://192.168.1.37:8088/`,
target: `http://localhost:8082/`, target: `http://localhost:8089/`,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: '' ['^' + process.env.VUE_APP_BASE_API]: ''
......
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