fix:ocr识别开发
After Width: | Height: | Size: 3.2 KiB |
After Width: | Height: | Size: 3.3 KiB |
After Width: | Height: | Size: 3.2 KiB |
After Width: | Height: | Size: 534 B |
After Width: | Height: | Size: 855 B |
After Width: | Height: | Size: 932 B |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 58 KiB |
After Width: | Height: | Size: 571 B |
After Width: | Height: | Size: 77 KiB |
After Width: | Height: | Size: 1.0 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 892 B |
After Width: | Height: | Size: 77 KiB |
After Width: | Height: | Size: 616 B |
After Width: | Height: | Size: 64 KiB |
@ -0,0 +1,246 @@
|
||||
<template>
|
||||
<div class="EvidenceProofread">
|
||||
<div class="FormInfo">
|
||||
<el-form ref="form" :model="dataInfo" :rules="rules" label-width="80px" style="margin-top: 10px">
|
||||
<el-row :gutter="10" class="form-content">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="案件编号">
|
||||
<span>11111</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="案件名称">
|
||||
<span>的点点滴滴</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="证据名称" prop="questioner">
|
||||
<el-input v-model="dataInfo['questioner']" placeholder="请输入证据名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="证据类型" prop="questioner">
|
||||
<el-input v-model="dataInfo['questioner']" placeholder="请输入证据类型" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="提供人" prop="questioner">
|
||||
<el-input v-model="dataInfo['questioner']" placeholder="请输入提供人" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="proofread-content">
|
||||
<div class="left">
|
||||
<el-scrollbar noresize class="left-scroll">
|
||||
<vuedraggable v-model="dataList" animation="400" class="img_list">
|
||||
<div v-for="(item,index) in dataList" :key="index" class="img_item">{{ item }}</div>
|
||||
</vuedraggable>
|
||||
</el-scrollbar>
|
||||
<div class="show-img">
|
||||
<img :src="activedImg" alt="">
|
||||
</div>
|
||||
|
||||
<span class="boder1" />
|
||||
<span class="boder2" />
|
||||
<span class="boder3" />
|
||||
<span class="boder4" />
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="title">识别结果</div>
|
||||
<span class="boder1" />
|
||||
<span class="boder2" />
|
||||
<span class="boder3" />
|
||||
<span class="boder4" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-btns">
|
||||
<div class="reset_btn" @click="back">重置</div>
|
||||
<div class="btn" @click="back">保存</div>
|
||||
<div class="btn" @click="next">确认并提交</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import * as vuedraggable from 'vuedraggable'
|
||||
import { baseURL } from '@/config'
|
||||
import { commonDownloadFile } from '@/api/config/uploadApi'
|
||||
export default {
|
||||
name: 'EvidenceProofread',
|
||||
components: { vuedraggable },
|
||||
data() {
|
||||
return {
|
||||
dataList: [
|
||||
'1111',
|
||||
'2222',
|
||||
'3333',
|
||||
'44444',
|
||||
'1111',
|
||||
'2222',
|
||||
'3333',
|
||||
'44444'
|
||||
],
|
||||
dataInfo: {},
|
||||
activedImg: `${baseURL}${commonDownloadFile}1829334930064207873`
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.EvidenceProofread {
|
||||
display: flex;
|
||||
margin: 24px;
|
||||
width: 100%;
|
||||
.FormInfo {
|
||||
width: 470px;
|
||||
background: #F6F8F9;
|
||||
border-radius: 8px 8px 8px 8px;
|
||||
// height: calc(100vh - 350px);
|
||||
padding: 0 24px;
|
||||
margin-bottom: 72px;
|
||||
}
|
||||
:deep(.el-scrollbar__wrap) {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.proofread-content {
|
||||
flex: 1;
|
||||
margin-left: 18px;
|
||||
display: flex;
|
||||
margin-bottom: 72px;
|
||||
.left {
|
||||
width: 55%;
|
||||
margin-right: 24px;
|
||||
position: relative;
|
||||
// background: #F6F8F9;
|
||||
border: 1px solid #DCE3EB;
|
||||
display: flex;
|
||||
padding: 8px;
|
||||
.left-scroll {
|
||||
// height: calc(100vh - 308px);
|
||||
background: #F6F8F9;
|
||||
width: 150px;
|
||||
margin-right: 14px;
|
||||
}
|
||||
.show-img {
|
||||
padding: 16px 28px;
|
||||
flex: 1;
|
||||
background: #F6F8F9;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right {
|
||||
width: 45%;
|
||||
position: relative;
|
||||
border: 1px solid #DCE3EB;
|
||||
display: flex;
|
||||
padding: 8px;
|
||||
.title {
|
||||
background: #F6F8F9;
|
||||
border-bottom: 1px solid #DCE3EB;
|
||||
height: 70px;
|
||||
padding-left: 24px;
|
||||
line-height: 70px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
color: #333333;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.img_list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 25px;
|
||||
overflow-x: hidden;
|
||||
padding: 24px;
|
||||
background: #F6F8F9;
|
||||
.img_item {
|
||||
width: 98px;
|
||||
height: 138px;
|
||||
margin-bottom: 16px;
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
border: 1px solid #D1D3D6;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.boder1 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-top: 2px solid #2073FF;
|
||||
border-left: 2px solid #2073FF;
|
||||
}
|
||||
.boder2 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
right: 0;
|
||||
top: 0;
|
||||
border-top: 2px solid #2073FF;
|
||||
border-right: 2px solid #2073FF;
|
||||
}
|
||||
.boder3 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
border-bottom: 2px solid #2073FF;
|
||||
border-left: 2px solid #2073FF;
|
||||
}
|
||||
.boder4 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-bottom: 2px solid #2073FF;
|
||||
border-right: 2px solid #2073FF;
|
||||
}
|
||||
}
|
||||
.footer-btns {
|
||||
position: absolute;
|
||||
right: 24px;
|
||||
bottom: 24px;
|
||||
display: flex;
|
||||
.btn {
|
||||
width: 188px;
|
||||
height: 48px;
|
||||
background: #3763FF;
|
||||
box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.04);
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
text-align: center;
|
||||
line-height: 48px;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
margin-left: 24px;
|
||||
}
|
||||
.reset_btn {
|
||||
width: 188px;
|
||||
height: 48px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.04);
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
border: 1px solid #3763FF;
|
||||
text-align: center;
|
||||
line-height: 48px;
|
||||
font-size: 16px;
|
||||
color: #3763FF;
|
||||
cursor: pointer;
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -0,0 +1,89 @@
|
||||
<template>
|
||||
<div class="FormInfo">
|
||||
<el-form ref="form" :model="recordForm" :rules="rules" label-width="80px" style="margin-top: 10px">
|
||||
<el-row :gutter="10" class="form-content">
|
||||
<el-col :span="24">
|
||||
<el-form-item label="案件编号">
|
||||
<span>11111</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="案件名称">
|
||||
<span>的点点滴滴</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="姓名" prop="userId">
|
||||
<div class="flex-row" style="justify-content: space-between">
|
||||
<el-select v-model="recordForm.userId" placeholder="请选择姓名" style="width: 80%">
|
||||
<el-option
|
||||
v-for="item in userList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:label:="item.name"
|
||||
/>
|
||||
</el-select>
|
||||
<el-button type="primary" @click="handleAdd">新增</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="第" prop="number">
|
||||
<div class="flex-row">
|
||||
<el-input v-model="recordForm['number']" placeholder="请输入数字" type="number" style="width: 100px" />
|
||||
<span style="margin-left: 10px;color: #333333">询问笔录</span>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="询问人" prop="questioner">
|
||||
<el-input v-model="recordForm['questioner']" placeholder="请输入询问人,多人可用英文逗号隔开" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="供述时间" prop="confessionTime">
|
||||
<el-date-picker
|
||||
v-model="recordForm['confessionTime']"
|
||||
type="datetimerange"
|
||||
format="yyyy-MM-dd HH:MM"
|
||||
start-placeholder="请选择开始时间"
|
||||
end-placeholder="请选择结束时间"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<!--新增用户-->
|
||||
<add-case-user ref="add" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import AddCaseUser from '@/views/caseDetails/components/edit/AddCaseUser.vue'
|
||||
export default {
|
||||
name: 'FormInfo',
|
||||
components: { AddCaseUser },
|
||||
data() {
|
||||
return {
|
||||
recordForm: {},
|
||||
// 用户
|
||||
userList: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 新增用户
|
||||
handleAdd() {
|
||||
this.$refs.add.show()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.FormInfo {
|
||||
width: 470px;
|
||||
background: #F6F8F9;
|
||||
border-radius: 8px 8px 8px 8px;
|
||||
height: calc(100vh - 350px);
|
||||
padding: 0 24px;
|
||||
}
|
||||
</style>
|
@ -0,0 +1,198 @@
|
||||
<template>
|
||||
<div class="RecordProofread">
|
||||
<FormInfo />
|
||||
<div class="proofread-content">
|
||||
<div class="left">
|
||||
<el-scrollbar class="left-scroll">
|
||||
<vuedraggable v-model="dataList" animation="400" class="img_list">
|
||||
<div v-for="(item,index) in dataList" :key="index" class="img_item">{{ item }}</div>
|
||||
</vuedraggable>
|
||||
</el-scrollbar>
|
||||
<img :src="activedImg" class="act_img" alt="">
|
||||
<span class="boder1" />
|
||||
<span class="boder2" />
|
||||
<span class="boder3" />
|
||||
<span class="boder4" />
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="title">识别结果</div>
|
||||
<span class="boder1" />
|
||||
<span class="boder2" />
|
||||
<span class="boder3" />
|
||||
<span class="boder4" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-btns">
|
||||
<div class="reset_btn" @click="back">重置</div>
|
||||
<div class="btn" @click="back">保存</div>
|
||||
<div class="btn" @click="next">确认并提交</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import * as vuedraggable from 'vuedraggable'
|
||||
import FormInfo from './FormInfo.vue'
|
||||
import { baseURL } from '@/config'
|
||||
import { commonDownloadFile } from '@/api/config/uploadApi'
|
||||
export default {
|
||||
name: 'RecordProofread',
|
||||
components: { vuedraggable, FormInfo },
|
||||
data() {
|
||||
return {
|
||||
dataList: [
|
||||
'1111',
|
||||
'2222',
|
||||
'3333',
|
||||
'44444',
|
||||
'1111',
|
||||
'2222',
|
||||
'3333',
|
||||
'44444'
|
||||
],
|
||||
activedImg: `${baseURL}${commonDownloadFile}1829334930064207873`
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.RecordProofread {
|
||||
display: flex;
|
||||
padding: 0 24px;
|
||||
:deep(.el-scrollbar__wrap) {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.proofread-content {
|
||||
flex: 1;
|
||||
margin-left: 18px;
|
||||
display: flex;
|
||||
.left {
|
||||
width: 55%;
|
||||
margin-right: 24px;
|
||||
position: relative;
|
||||
// background: #F6F8F9;
|
||||
border: 1px solid #DCE3EB;
|
||||
display: flex;
|
||||
padding: 8px;
|
||||
.left-scroll {
|
||||
height: calc(100vh - 368px);
|
||||
background: #F6F8F9;
|
||||
}
|
||||
.act_img {
|
||||
padding: 16px 28px;
|
||||
flex: 1;
|
||||
background: #F6F8F9;
|
||||
height: calc(100vh - 400px);
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
width: 45%;
|
||||
position: relative;
|
||||
border: 1px solid #DCE3EB;
|
||||
display: flex;
|
||||
padding: 8px;
|
||||
.title {
|
||||
background: #F6F8F9;
|
||||
border-bottom: 1px solid #DCE3EB;
|
||||
height: 70px;
|
||||
padding-left: 24px;
|
||||
line-height: 70px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
color: #333333;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.img_list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 25px;
|
||||
overflow-x: hidden;
|
||||
padding: 24px;
|
||||
background: #F6F8F9;
|
||||
.img_item {
|
||||
width: 98px;
|
||||
height: 138px;
|
||||
margin-bottom: 16px;
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
border: 1px solid #D1D3D6;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.boder1 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-top: 2px solid #2073FF;
|
||||
border-left: 2px solid #2073FF;
|
||||
}
|
||||
.boder2 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
right: 0;
|
||||
top: 0;
|
||||
border-top: 2px solid #2073FF;
|
||||
border-right: 2px solid #2073FF;
|
||||
}
|
||||
.boder3 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
border-bottom: 2px solid #2073FF;
|
||||
border-left: 2px solid #2073FF;
|
||||
}
|
||||
.boder4 {
|
||||
position: absolute;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-bottom: 2px solid #2073FF;
|
||||
border-right: 2px solid #2073FF;
|
||||
}
|
||||
}
|
||||
.footer-btns {
|
||||
position: absolute;
|
||||
right: 24px;
|
||||
bottom: 24px;
|
||||
display: flex;
|
||||
.btn {
|
||||
width: 188px;
|
||||
height: 48px;
|
||||
background: #3763FF;
|
||||
box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.04);
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
text-align: center;
|
||||
line-height: 48px;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
margin-left: 24px;
|
||||
}
|
||||
.reset_btn {
|
||||
width: 188px;
|
||||
height: 48px;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.04);
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
border: 1px solid #3763FF;
|
||||
text-align: center;
|
||||
line-height: 48px;
|
||||
font-size: 16px;
|
||||
color: #3763FF;
|
||||
cursor: pointer;
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -0,0 +1,119 @@
|
||||
|
||||
<template>
|
||||
<div class="evidence-content">
|
||||
<vxe-grid ref="xTable" v-bind="gridOptions">
|
||||
<template #result_edit="{row}">
|
||||
<el-select v-model="row['atomicResult']" placeholder="请选择" @change="save">
|
||||
<el-option
|
||||
v-for="item in resultOptions"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:label="item.label"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
<template #remark_edit="{row}">
|
||||
<el-input @blur="save" v-model="row['remark']" placeholder="请输入" />
|
||||
</template>
|
||||
</vxe-grid>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import mixin from '@/views/mixin'
|
||||
import { listCaseAtomicIndex, saveCaseAtomicResult } from '@/api/caseDetails'
|
||||
import { debounce } from '@/utils'
|
||||
export default {
|
||||
name: 'CaseEvidence',
|
||||
mixins: [mixin],
|
||||
props: {
|
||||
// 是否编辑
|
||||
isEdit: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 是否展开
|
||||
isExpand: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
searchName: '',
|
||||
gridOptions: {
|
||||
...mixin.data().gridOptions,
|
||||
editConfig: {
|
||||
trigger: 'click',
|
||||
mode: 'cell'
|
||||
},
|
||||
editRules: {
|
||||
atomicResult: [{ required: true, message: '判断结果不能为空!' }]
|
||||
},
|
||||
columns: [
|
||||
{ title: '序号', type: 'seq', width: '50px' },
|
||||
{ title: '指标名称', field: 'indexName', align: 'left' },
|
||||
{ title: '原子指标', field: 'automicIndexName', align: 'left' },
|
||||
{ title: '判断结果', field: 'atomicResult', width: '150px', formatter: ({ cellValue }) => {
|
||||
return cellValue ? this.resultOptions.find(item => item.value === cellValue).label : ''
|
||||
}, editRender: {}, slots: { edit: 'result_edit' }},
|
||||
{ title: '备注', field: 'remark', width: '500px', formatter: ({ cellValue }) => {
|
||||
return cellValue || ''
|
||||
}, editRender: {}, slots: { edit: 'remark_edit' }}
|
||||
],
|
||||
data: []
|
||||
},
|
||||
resultOptions: JSON.parse(sessionStorage.getItem('judge_result'))
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
isExpand: {
|
||||
handler: function(newVal, oldVal) {
|
||||
if (newVal !== oldVal) {
|
||||
this.tableHeight(this.isExpand ? this.isEdit ? 580 : 530 : this.isEdit ? 400 : 320)
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
searchName: function() {
|
||||
this.debounceSearch(this)
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.caseId = this.$route.params.id
|
||||
this.$nextTick(() => {
|
||||
this.tableHeight(this.isExpand ? (this.isEdit ? 580 : 530) : (this.isEdit ? 400 : 320))
|
||||
})
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
// 防抖查询数据
|
||||
debounceSearch: debounce((_this) => {
|
||||
_this.fetchData()
|
||||
}),
|
||||
// 保存
|
||||
async save() {
|
||||
await saveCaseAtomicResult({
|
||||
caseAtomicIndexList: this.gridOptions.data,
|
||||
caseId: this.caseId
|
||||
})
|
||||
},
|
||||
// 获取数据
|
||||
fetchData() {
|
||||
const params = {
|
||||
caseId: this.caseId
|
||||
}
|
||||
listCaseAtomicIndex(params).then(res => {
|
||||
this.gridOptions.data = res.data
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.evidence-content {
|
||||
|
||||
}
|
||||
</style>
|