guoxiangbin
/
ocr-web
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

bug

Browse Source
pull/64/head
Dragon 1 year ago
parent d430e612a8
commit 508eb09709
3 changed files with 174 additions and 109 deletions
Show Stats Download Patch File Download Diff File

175
src/views/task/aside/Aside.vue
Unescape View File

@ -1,5 +1,5 @@
<script lang="ts" setup> <script lang="ts" setup>
import { debounce } from "lodash-es"; import { debounce } from 'lodash-es'
import { import {
computed, computed,
inject, inject,
@ -9,89 +9,89 @@ import {
shallowRef, shallowRef,
unref, unref,
watch, watch,
} from "vue"; } from 'vue'
import CustomFieldModal from "../modal/CustomFieldModal.vue"; import CustomFieldModal from '../modal/CustomFieldModal.vue'
import AdvanceFilter from "../../home/aside/comp/AdvanceFilter.vue"; import AdvanceFilter from '../../home/aside/comp/AdvanceFilter.vue'
import { FilterModalVue } from "../../home/aside/comp/modals"; import { FilterModalVue } from '../../home/aside/comp/modals'
import NewFilterModalVue from "../modal/NewFilterModal.vue"; import NewFilterModalVue from '../modal/NewFilterModal.vue'
import TaskList from "./TaskList.vue"; import TaskList from './TaskList.vue'
import type { AsideEntity } from "@/config/aside"; import type { AsideEntity } from '@/config/aside'
import { useUser } from "@/store/modules/user"; import { useUser } from '@/store/modules/user'
import { getAllfieldList, getfieldList } from "@/api/home/filter"; import { getAllfieldList, getfieldList } from '@/api/home/filter'
import { useTaskStore } from "@/store/modules/task"; import { useTaskStore } from '@/store/modules/task'
import emitter from "@/utils/mitt"; import emitter from '@/utils/mitt'
import { useConfig } from "@/store/modules/asideConfig"; import { useConfig } from '@/store/modules/asideConfig'
const CustomFieldModalRef = ref(null); const CustomFieldModalRef = ref(null)
const collapse = ref(false); const collapse = ref(false)
const taskStore = useTaskStore(); const taskStore = useTaskStore()
const taskListRef: any = ref(null); const taskListRef: any = ref(null)
// 展示字段 // 展示字段
const showFieldList = ref<any[]>([]); const showFieldList = ref<any[]>([])
const search = ref(""); const search = ref('')
function collapseHandler() { function collapseHandler() {
collapse.value = !collapse.value; collapse.value = !collapse.value
} }
const mousetrap = inject("mousetrap") as any; const mousetrap = inject('mousetrap') as any
mousetrap.bind("[", collapseHandler); mousetrap.bind('[', collapseHandler)
const asideWidth = computed(() => { const asideWidth = computed(() => {
return collapse.value ? 0 : 308; return collapse.value ? 0 : 308
}); })
const asideStyle = computed(() => { const asideStyle = computed(() => {
return { return {
width: `${asideWidth.value}px`, width: `${asideWidth.value}px`,
}; }
}); })
const collapseIcon = computed(() => { const collapseIcon = computed(() => {
return collapse.value ? "expand-cir" : "collapse-cir"; return collapse.value ? 'expand-cir' : 'collapse-cir'
}); })
const asideEnter = ref(false); const asideEnter = ref(false)
const showCollapse = computed(() => { const showCollapse = computed(() => {
return collapse.value ? true : asideEnter.value; return collapse.value ? true : asideEnter.value
}); })
watch( watch(
() => taskStore.immersion, () => taskStore.immersion,
() => { () => {
collapse.value = true; collapse.value = true
} },
); )
function showFilter() { function showFilter() {
const modal = unref(CustomFieldModalRef)! as any; const modal = unref(CustomFieldModalRef)! as any
modal.showModal(); modal.showModal()
} }
const showSearch = ref(false); const showSearch = ref(false)
function setShowSearch(value: boolean) { function setShowSearch(value: boolean) {
if (!value) { if (!value) {
console.log("setShowSearch", value); console.log('setShowSearch', value)
search.value = ""; search.value = ''
taskListRef.value.search(""); taskListRef.value.search('')
return; return
} }
showSearch.value = value; showSearch.value = value
} }
const inputHandler = debounce((word) => { const inputHandler = debounce((word) => {
(taskListRef.value as any).search(word); (taskListRef.value as any).search(word)
}, 500); }, 500)
const reviewType = 2; const reviewType = 2
async function getshowFieldList() { async function getshowFieldList() {
showFieldList.value = []; showFieldList.value = []
const userStore = useUser(); const userStore = useUser()
const userInfo = userStore.getUserInfo; const userInfo = userStore.getUserInfo
let res; let res
res = await getAllfieldList(reviewType); // 所有筛选项目 res = await getAllfieldList(reviewType) // 所有筛选项目
const allList = res.data; const allList = res.data
res = await getfieldList(reviewType, userInfo.id); // 当前用户选择的项目 res = await getfieldList(reviewType, userInfo.id) // 当前用户选择的项目
const useList = res.data; const useList = res.data
/** /**
* name 标题 * name 标题
* id 键值 * id 键值
@ -99,19 +99,20 @@ async function getshowFieldList() {
* checked 是否选中 * checked 是否选中
*/ */
if (useList?.userFieldFixed) { if (useList?.userFieldFixed) {
useList?.userFieldFixed?.split(",").map((v) => { useList?.userFieldFixed?.split(',').map((v) => {
let item = allList.find((v2) => v2.name == v); let item = allList.find(v2 => v2.name == v)
if (item) { if (item) {
item = { item = {
name: item.fieldDesc, name: item.fieldDesc,
id: item.name, id: item.name,
fix: item.isrequired == 2, fix: item.isrequired == 2,
checked: true, checked: true,
}; }
showFieldList.value.push(item); showFieldList.value.push(item)
} }
}); })
} else { }
else {
// 若为首次获取 则赋默认值 // 若为首次获取 则赋默认值
allList?.map((v) => { allList?.map((v) => {
if (v.isrequired == 2) { if (v.isrequired == 2) {
@ -120,58 +121,58 @@ async function getshowFieldList() {
id: v.name, id: v.name,
fix: v.isrequired == 2, fix: v.isrequired == 2,
checked: true, checked: true,
}; }
showFieldList.value.push(item); showFieldList.value.push(item)
} }
}); })
} }
} }
onMounted(() => { onMounted(() => {
getshowFieldList(); getshowFieldList()
}); })
// 滚动容器，让key对应模块处于可视区域 // 滚动容器，让key对应模块处于可视区域
function scrollHandler(key: string) { function scrollHandler(key: string) {
const element = document.querySelector(`#${key}`); const element = document.querySelector(`#${key}`)
element?.scrollIntoView(true); element?.scrollIntoView(true)
} }
// 选择某个过滤配置，刷新图片墙 // 选择某个过滤配置，刷新图片墙
function filterHandler(searchId: string) { function filterHandler(searchId: string) {
emitter.emit("filter", searchId); emitter.emit('filter', searchId)
} }
function showModal(modalRef: any) { function showModal(modalRef: any) {
const modal = unref(modalRef)! as any; const modal = unref(modalRef)! as any
modal.showModal(); modal.showModal()
} }
// 当前显示的模块，按照数组顺序显示 // 当前显示的模块，按照数组顺序显示
const showItems = shallowRef<{ key: string; config: AsideEntity }[]>([]); const showItems = shallowRef<{ key: string, config: AsideEntity }[]>([])
const filterModalRef: any = ref(null); const filterModalRef: any = ref(null)
const newFilterModalRef = ref(null); const newFilterModalRef = ref(null)
const customModalRef = ref(null); const customModalRef = ref(null)
function editFilter(filter: any) { function editFilter(filter: any) {
const modal = unref(newFilterModalRef)! as any; const modal = unref(newFilterModalRef)! as any
modal.showModal(); modal.showModal()
modal.edit(filter); modal.edit(filter)
} }
const configStore = useConfig(); const configStore = useConfig()
const newFilterOk = () => { function newFilterOk() {
filterModalRef.value.query( filterModalRef.value.query(
filterModalRef.value.pagination.page, filterModalRef.value.pagination.page,
filterModalRef.value.pagination.pageSize filterModalRef.value.pagination.pageSize,
); )
}; }
onBeforeMount(async () => { onBeforeMount(async () => {
configStore.fetchConfig(); configStore.fetchConfig()
configStore.fetchCustomConfig(); configStore.fetchCustomConfig()
}); })
function setAsideItemName(text) { function setAsideItemName(text) {
taskListRef.value.setStatusName(text); taskListRef.value.setStatusName(text)
} }
defineExpose({ defineExpose({
setAsideItemName, setAsideItemName,
}); })
</script> </script>
<template> <template>
@ -255,7 +256,7 @@ defineExpose({
@show-new-filter="showModal(newFilterModalRef)" @show-new-filter="showModal(newFilterModalRef)"
/> />
<!-- 新增过滤 --> <!-- 新增过滤 -->
<NewFilterModalVue ref="newFilterModalRef" @onOk="newFilterOk" /> <NewFilterModalVue ref="newFilterModalRef" @on-ok="newFilterOk" />
</div> </div>
</template> </template>

20
src/views/task/content/Content.vue
Unescape View File

@ -33,7 +33,7 @@ const selectItems = ref<any[]>([])
const message = useMessage() const message = useMessage()
const dialog = useDialog() const dialog = useDialog()
const notPassModalRef = ref(null) const notPassModalRef = ref(null)
const batchModalRef = ref(null) const batchModalRef: any = ref(null)
const totalCount = ref(0) const totalCount = ref(0)
const taskId: any = ref('') // 任务id const taskId: any = ref('') // 任务id
const packageId: any = ref('') // 包id const packageId: any = ref('') // 包id
@ -61,7 +61,7 @@ const showActions = computed(() => {
const taskpagination = reactive({ const taskpagination = reactive({
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 30,
}) })
const taskStore = useTask() const taskStore = useTask()
const overTask = ref<any>(null) const overTask = ref<any>(null)
@ -198,7 +198,7 @@ function approvalHandler(items?: any) {
function rejectHandler(items?: any) { function rejectHandler(items?: any) {
const modal = unref(notPassModalRef)! as any const modal = unref(notPassModalRef)! as any
modal.showModal(selectItems.value) modal.showModal(items)
} }
function singleRejectHandler() { function singleRejectHandler() {
@ -213,13 +213,14 @@ function doAudit(param: any) {
message.success(res.message) message.success(res.message)
setBatch(false) setBatch(false)
reloadList(param, '通过') reloadList(param, '通过')
batchModalRef.value.reload()
} }
}) })
} }
function showModal(modalRef: any) { function showModal(modalRef: any) {
const modal = unref(modalRef)! as any const modal = unref(modalRef)! as any
modal.showModal() modal.showModal(taskId.value)
} }
function forwardHandler() { function forwardHandler() {
@ -429,7 +430,7 @@ function switchBatch() {
class="btn-approval btn-left" class="btn-approval btn-left"
src="@/assets/images/task/btn-not-pass.png" src="@/assets/images/task/btn-not-pass.png"
alt="" alt=""
@click.stop="rejectHandler" @click.stop="rejectHandler(selectItems)"
> >
<SvgIcon size="24" name="vs" /> <SvgIcon size="24" name="vs" />
<img <img
@ -639,13 +640,18 @@ function switchBatch() {
<History :data="taskDetailInfo" /> <History :data="taskDetailInfo" />
</n-tab-pane> </n-tab-pane>
</n-tabs> </n-tabs>
<NotPassed ref="notPassModalRef" @success="(param) => reloadList(param, '不通过')" /> <NotPassed
ref="notPassModalRef" @success="(param) => {
batchModalRef.value.reload()
reloadList(param, '不通过')
}"
/>
<BatchModal <BatchModal
ref="batchModalRef" ref="batchModalRef"
@reject="rejectHandler" @reject="rejectHandler"
@approval="approvalHandler" @approval="approvalHandler"
/> />
<CustomSettingModal ref="CustomSettingModalRef" @onOk="getDetail"/> <CustomSettingModal ref="CustomSettingModalRef" @on-ok="getDetail" />
</div> </div>
</template> </template>

88
src/views/task/modal/BatchModal.vue
Unescape View File

@ -25,6 +25,7 @@ const cardStyle = {
const totalCount = ref(0) const totalCount = ref(0)
const timeRange = ref('all') const timeRange = ref('all')
const taskId = ref('')
const timeLabel = computed(() => { const timeLabel = computed(() => {
const item = timeOptions.find((option) => { const item = timeOptions.find((option) => {
return option.value === timeRange.value return option.value === timeRange.value
@ -110,9 +111,8 @@ useInfiniteScroll(
async function loadMore() { async function loadMore() {
if (loading.value || el.value == null) if (loading.value || el.value == null)
return return
const taskId = taskStore.getActiveId
if (!taskId) if (!taskId.value)
return return
const more = await fetchList() const more = await fetchList()
@ -241,7 +241,9 @@ onMounted(() => {
show.value && addListeners() show.value && addListeners()
}) })
function showModal() { function showModal(value) {
taskId.value = value
refreshHandler()
show.value = true show.value = true
} }
@ -249,10 +251,6 @@ function closeModal(event: MouseEvent) {
show.value = false show.value = false
} }
defineExpose({
showModal,
})
function forwardHandler() { function forwardHandler() {
taskStore.forward() taskStore.forward()
} }
@ -314,11 +312,9 @@ function reset() {
async function refreshHandler() { async function refreshHandler() {
reset() reset()
const taskId = taskStore.getActiveId if (!taskId.value)
if (!taskId)
return return
taskDetailInfo.value = await getTaskDetailInfo(taskId, '') taskDetailInfo.value = await getTaskDetailInfo(taskId.value, '')
nextTick(() => { nextTick(() => {
useInfiniteScroll( useInfiniteScroll(
@ -332,12 +328,23 @@ async function refreshHandler() {
} }
watch(() => taskStore.activeId, async (newValue, oldValue) => { watch(() => taskStore.activeId, async (newValue, oldValue) => {
taskId.value = taskStore.activeId
selectIds.value = []
refreshHandler() refreshHandler()
}) })
function switchBatch() { function switchBatch() {
setBatch(!batch.value) setBatch(!batch.value)
} }
function reload() {
selectIds.value = []
refreshHandler()
}
defineExpose({
showModal,
reload,
})
</script> </script>
<template> <template>
@ -356,7 +363,7 @@ function switchBatch() {
<span style="margin-left: 8px;">任务审批</span> <span style="margin-left: 8px;">任务审批</span>
</div> </div>
<div class="wrapper-title wrapper-m32"> <div class="wrapper-title wrapper-m32">
<span>任务ID:{{ taskStore.getActiveId }}</span> <span>任务ID:{{ taskDetailInfo.fromtaskname }}</span>
<SvgIcon size="22" class="forward" name="arrow-left" @click="backHandler" /> <SvgIcon size="22" class="forward" name="arrow-left" @click="backHandler" />
<SvgIcon size="22" class="back" name="arrow-right" @click="forwardHandler" /> <SvgIcon size="22" class="back" name="arrow-right" @click="forwardHandler" />
</div> </div>
@ -386,14 +393,27 @@ function switchBatch() {
<td> <td>
{{ taskDetailInfo?.createusername }} {{ taskDetailInfo?.createusername }}
</td> </td>
<td>{{ TASK_STATUS_OBJ[taskDetailInfo?.states] }}</td> <td>
<div
class="status-tag"
:class="{
'status-red': taskDetailInfo?.states === 3,
'status-green': taskDetailInfo?.states === 2,
}"
>
{{ TASK_STATUS_OBJ[taskDetailInfo?.states] }}
</div>
</td>
<td>{{ taskDetailInfo?.ocrPicture?.createTime }}</td> <td>{{ taskDetailInfo?.ocrPicture?.createTime }}</td>
<td>{{ taskDetailInfo?.fromsourceid }}</td> <td>{{ taskDetailInfo?.pictureInfo?.source }}</td>
<td>{{ totalCount }}</td> <td>{{ totalCount }}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
<div class="title wrapper-m32">
相似图片
</div>
<div class="wrapper-content"> <div class="wrapper-content">
<div class="wrapper-content-form wrapper-m32"> <div class="wrapper-content-form wrapper-m32">
@ -500,6 +520,16 @@ function switchBatch() {
position: relative; position: relative;
} }
.title{
font-size: 18px;
font-family: PingFang SC, PingFang SC-Medium;
font-weight: 500;
text-align: left;
color: #333333;
margin-top: 14px;
margin-bottom: 24px;
}
.small-mark{ .small-mark{
width: 100%; width: 100%;
height: 36px; height: 36px;
@ -544,6 +574,29 @@ function switchBatch() {
} }
} }
.status-tag{
display: inline-block;
padding: 0 12px;
height: 22px;
background: #ffc671;
border-radius: 12px;
align-items: center;
justify-content: center;
font-size: 13px;
font-family: PingFang SC, PingFang SC-Medium;
font-weight: 500;
text-align: left;
color: #ffffff;
}
.status-tag-green{
background: #53c21d;
}
.status-tag-red{
background: #e45656;
}
.close { .close {
position: absolute; position: absolute;
right: -90px; right: -90px;
@ -610,11 +663,16 @@ function switchBatch() {
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
text-align: left; text-align: left;
font-size: 14px;
font-family: PingFang SC, PingFang SC-Medium;
font-weight: 500;
text-align: left;
color: #333333;
} }
} }
&-m32 { &-m32 {
margin-left: 32px; margin-left: 19px;
} }
&-content { &-content {

Write Preview
Loading…
Cancel
Save