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

feat: 工单功能

Browse Source
pull/1/head
lizijiee 1 year ago
parent a35a1b8ff7
commit a0af7173ac
7 changed files with 156 additions and 86 deletions
Show Stats Download Patch File Download Diff File

45
src/api/work/work.ts
Unescape View File

@ -1,5 +1,5 @@
import { http } from '@/utils/http/axios' import { http } from '@/utils/http/axios'
import type { PageParam, PictureSortParam, SetTFParam } from '/#/api' import type { PageParam, PictureSortParam, SetTFParam, SimilarityPictureSortParam } from '/#/api'
import { ContentTypeEnum } from '@/enums/httpEnum' import { ContentTypeEnum } from '@/enums/httpEnum'
@ -21,6 +21,24 @@ export async function getPackageList(params: PageParam, packagename: string) {
} }
} }
/**
* 任务包列表主图-新
* @returns
*/
export async function getPackagePicture(params: PageParam, packagename: string) {
const res = await http.request({
url: `/ocr/ocrPicture/getPackagePicture`,
method: 'get',
params: { ...params, packagename },
})
const { data: { records, pages } } = res
return {
pageCount: pages,
data: records,
}
}
/** /**
* 获取某个任务包内任务列表 * 获取某个任务包内任务列表
* @param id 任务包id * @param id 任务包id
@ -44,16 +62,14 @@ export async function getPackageTaskList(packageid: string, params: PageParam) {
} }
/** /**
* 获取某个任务详情(字段信息) * 任务包列表主图-新
* @param id 任务id * @param checkDuplicateId 查重id
* @param packageid 任务包id
* @returns * @returns
*/ */
export async function getTaskDetailInfo(taskId: string, packageid: string) { export async function getTaskDetailInfo(checkDuplicateId: string) {
const pid = packageid || 0
const res = await http.request({ const res = await http.request({
url: `/backstage/jifen/ocrtaskchildpicture/getdata/${taskId}/${pid}`, url: `/ocr/ocrPicture/getPackagePicture?checkDuplicateId=${checkDuplicateId}`,
method: 'get', method: 'get',
}) })
@ -67,11 +83,10 @@ export async function getTaskDetailInfo(taskId: string, packageid: string) {
* @param params * @param params
* @returns * @returns
*/ */
export async function getTaskDetailPictureList(packageid: string, taskchildpictureid: string, params: PageParam & PictureSortParam) { export async function getTaskDetailPictureList(params: PageParam & PictureSortParam & SimilarityPictureSortParam) {
const pid = packageid || 0
const res = await http.request({ const res = await http.request({
url: `/backstage/jifen/ocrtaskchildpicture/listbypictureid/${pid}/${taskchildpictureid}`, url: `/backstage/jifen/ocrtaskchildpicture/getPictureSimilarityList`,
method: 'get', method: 'get',
params, params,
}) })
@ -79,20 +94,22 @@ export async function getTaskDetailPictureList(packageid: string, taskchildpictu
const { data: { records, pages, total } } = res const { data: { records, pages, total } } = res
// 精简一下数据 // 精简一下数据
const list = records.map((item) => { const list = records.map((item,index) => {
return { return {
id: item.id, id: item.id,
taskId: item.taskId, taskId: item.taskId,
taskname: item.fromtaskname, taskname: item.fromtaskname,
assignee: item.assignee, assignee: item.assignee,
pictureid: item.pictureid, pictureid: item.pictureid,
imgurl: item.ocrPicture.imgurl, imgurl: item.imgUrl,
thumburl: item.ocrPicture.serverThumbnailUrl || item.ocrPicture.imgurl, thumburl: item.ocrPicture?.serverThumbnailUrl || item.ocrPicture?.imgurl,
iztrueorfalse: item.iztrueorfalse, iztrueorfalse: item.iztrueorfalse,
states: item.states, states: item.states,
history: hasHistory(item.ocpictureid, item.picturecompare), history: item.ocpictureid && item.picturecompare && hasHistory(item.ocpictureid, item.picturecompare),
} }
}) })
return { return {
pageCount: pages, pageCount: pages,
data: list, data: list,

10
src/store/modules/workOrder.ts
Unescape View File

@ -1,8 +1,8 @@
import { defineStore } from 'pinia'
import type { OrderState, PackageListItem } from '/#/workorder'
import { useMessage } from 'naive-ui'
import { getPackageList } from '@/api/work/work' import { getPackageList } from '@/api/work/work'
import { store } from '@/store' import { store } from '@/store'
import { useMessage } from 'naive-ui'
import { defineStore } from 'pinia'
import type { OrderState, PackageListItem } from '/#/workorder'
export const useWorkOrderStore = defineStore({ export const useWorkOrderStore = defineStore({
id: 'work-order', id: 'work-order',
@ -11,6 +11,7 @@ export const useWorkOrderStore = defineStore({
activeId: '', activeId: '',
packageList: [], packageList: [],
immersion: false, immersion: false,
name: ''
}), }),
getters: { getters: {
getActiveId: (state: OrderState) => state.activeId, getActiveId: (state: OrderState) => state.activeId,
@ -24,7 +25,7 @@ export const useWorkOrderStore = defineStore({
setActive(index: number, orderId?: string) { setActive(index: number, orderId?: string) {
this.currentIndex = index this.currentIndex = index
const order = this.packageList[index] const order = this.packageList[index]
this.activeId = orderId || order?.id this.activeId = orderId || order?.checkDuplicateId
}, },
forward() { forward() {
const len = this.packageList.length const len = this.packageList.length
@ -45,7 +46,6 @@ export const useWorkOrderStore = defineStore({
}, },
async fetchOrderList(pagination, keyword) { async fetchOrderList(pagination, keyword) {
const res = await getPackageList(pagination, keyword) const res = await getPackageList(pagination, keyword)
if (res.data&&res.data.length > 0) { if (res.data&&res.data.length > 0) {
this.packageList.push(...res.data) this.packageList.push(...res.data)
if (!this.activeId) if (!this.activeId)

4
src/views/worksheet/aside/WorkSheetList.vue
Unescape View File

@ -41,7 +41,7 @@ function showModal(modalRef: any, id) {
function selectHandler(id: string, index: number) { function selectHandler(id: string, index: number) {
workStore.setActive(index) workStore.setActive(index)
showModal(approvalModalRef, id) // showModal(approvalModalRef, id)
} }
useInfiniteScroll( useInfiniteScroll(
@ -139,7 +139,7 @@ defineExpose({
<ListItem <ListItem
v-for="(item, index) in data" v-for="(item, index) in data"
:key="item.id" :key="item.id"
:selected="activeId === item.id" :selected="activeId === item.checkDuplicateId"
:list-item="item" :list-item="item"
:show-field-list="showFieldList" :show-field-list="showFieldList"
:dicts="dicts" :dicts="dicts"

168
src/views/worksheet/content/Content.vue
Unescape View File

@ -1,23 +1,22 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, onUnmounted, onUpdated, reactive, ref, unref, watch } from "vue";
import { useDialog, useMessage } from "naive-ui";
import { clone, debounce, pickBy } from "lodash-es";
import { useInfiniteScroll } from "@vueuse/core";
import imagesloaded from "imagesloaded";
import ConfrimModal from "../modal/ConfrimModal.vue";
import type { PictureSortParam, SetTFParam } from "/#/api";
import { useWorkOrder } from "@/store/modules/workOrder";
import { formatToDateHMS } from "@/utils/dateUtil";
import { import {
clearTF, clearTF, getTaskDetailInfo,
getPackageTaskList, getTaskDetailPictureList,
getTaskDetailInfo, setTF
getTaskDetailPictureList,
setTF,
} from "@/api/work/work"; } from "@/api/work/work";
import { fieldMap } from "@/config/workorder"; import { fieldMap } from "@/config/workorder";
import { hideDownload } from "@/utils/image"; import { useWorkOrder } from "@/store/modules/workOrder";
import { isEmpty } from "@/utils"; import { isEmpty } from "@/utils";
import { formatToDateHMS } from "@/utils/dateUtil";
import { hideDownload } from "@/utils/image";
import { useInfiniteScroll } from "@vueuse/core";
import { format } from 'date-fns';
import imagesloaded from "imagesloaded";
import { clone, debounce, pickBy } from "lodash-es";
import { useDialog, useMessage } from "naive-ui";
import { computed, onUnmounted, onUpdated, reactive, ref, unref, watch } from "vue";
import ConfrimModal from "../modal/ConfrimModal.vue";
import type { SetTFParam, SimilarityPictureSortParam } from "/#/api";
const batch = ref(false); const batch = ref(false);
const selectItems = ref<any[]>([]); const selectItems = ref<any[]>([]);
@ -54,9 +53,9 @@ const taskpagination = reactive({
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 10,
}); });
const sortBy: PictureSortParam = { const sortBy: SimilarityPictureSortParam = {
orderbyname: "asc", orderType: "asc",
orderbyvalue: "pictureResult", orderName: "similarityScore",
}; };
const workStore = useWorkOrder(); const workStore = useWorkOrder();
const selectTask = ref<any>(null); const selectTask = ref<any>(null);
@ -208,7 +207,7 @@ async function refreshHandler() {
useInfiniteScroll( useInfiniteScroll(
el as any, el as any,
() => { () => {
loadMore(); loadMore();
}, },
{ distance: 10, canLoadMore: () => canloadMore } { distance: 10, canLoadMore: () => canloadMore }
@ -223,20 +222,20 @@ async function loadMore() {
} }
async function featchList() { async function featchList() {
loading.value = true; loading.value = true;
try { try {
taskpagination.pageNo += 1; taskpagination.pageNo += 1;
const taskId = selectTask.value.id;
const { data, total, pageCount } = await getTaskDetailPictureList( const { data, total, pageCount } = await getTaskDetailPictureList(
workStore.activeId, { ...taskpagination, ...sortBy ,checkDuplicateId: workStore.activeId}
taskId,
{ ...taskpagination, ...sortBy }
); );
totalCount.value = total; totalCount.value = total;
canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0; canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0;
return data; return data;
} catch (error) { } catch (error) {
debugger
canloadMore = false; canloadMore = false;
return []; return [];
} }
@ -272,23 +271,33 @@ watch(
totalCount.value = 0; totalCount.value = 0;
return; return;
} }
queryDetail(packageid)
const res = await getPackageTaskList(newValue, packagepagination); // const res = await getPackageTaskList(newValue, packagepagination);
const { data } = res; // const { data } = res;
taskList.value = data; // taskList.value = data;
if (taskList.value.length > 0) handleSelect(taskList.value[0]); // if (taskList.value.length > 0) handleSelect(taskList.value[0]); // 暂时注释掉
} }
); );
const packageName = computed(() => { const packageName = computed(() => {
const index = workStore.getCurrentIndex; const index = workStore.getCurrentIndex;
return workStore.getOrderList[index]?.packagename || ""; return workStore.getOrderList[index]?.name || "";
}); });
async function queryDetail(checkDuplicateId: any) {
taskDetailInfo.value = await getTaskDetailInfo(checkDuplicateId);
const packageid = workStore.getActiveId;
if (isEmpty(packageid)) {
listData.value.length = 0;
totalCount.value = 0;
return;
}
refreshHandler();
}
async function handleSelect(item: any) { async function handleSelect(item: any) {
selectTask.value = item; taskDetailInfo.value = await getTaskDetailInfo( workStore.activeId);
const taskId = item.id;
taskDetailInfo.value = await getTaskDetailInfo(taskId, workStore.activeId);
const packageid = workStore.getActiveId; const packageid = workStore.getActiveId;
@ -301,11 +310,10 @@ async function handleSelect(item: any) {
refreshHandler(); refreshHandler();
} }
async function sortHandler(orderby: "pictureResult" | "fromuptime") { async function sortHandler(orderby: "similarityScore" | "createdate") {
if (!selectTask.value) return;
sortBy.orderbyvalue = orderby; sortBy.orderName = orderby;
sortBy.orderbyname = sortBy.orderbyname === "asc" ? "desc" : "asc"; sortBy.orderType = sortBy.orderType === "asc" ? "desc" : "asc";
refreshHandler(); refreshHandler();
} }
@ -359,8 +367,8 @@ onUnmounted(() => {
function getPercent(pictureid: string) { function getPercent(pictureid: string) {
const { ocpictureid, pictureresult } = taskDetailInfo.value; const { ocpictureid, pictureresult } = taskDetailInfo.value;
const index = ocpictureid.split(",").indexOf(String(pictureid)); const index = ocpictureid ? ocpictureid.split(",").indexOf(String(pictureid)):'';
const results = pictureresult.split(","); const results = pictureresult ? pictureresult.split(",") : '';
const percent = results[index] || "0"; const percent = results[index] || "0";
const val = Math.floor(Number.parseFloat(percent)); const val = Math.floor(Number.parseFloat(percent));
return `${val}%`; return `${val}%`;
@ -440,7 +448,7 @@ function previewHandler(event: MouseEvent) {
<div class="wrapper-detail"> <div class="wrapper-detail">
<div <div
class="left" class="left"
:style="{ 'background-image': `url(${taskDetailInfo?.ocrPicture?.imgurl})` }" :style="{ 'background-image': `url(${taskDetailInfo?.imgurl})` }"
@click="showAction" @click="showAction"
@mouseleave="leaveTaskHandler" @mouseleave="leaveTaskHandler"
> >
@ -461,12 +469,12 @@ function previewHandler(event: MouseEvent) {
</div> </div>
<div class="time"> <div class="time">
<SvgIcon color="#FFF" size="16" name="time" /> <SvgIcon color="#FFF" size="16" name="time" />
<span>{{ formatToDateHMS(taskDetailInfo.createdate || 0) }}</span> <span>{{ taskDetailInfo.createTime }} </span>
</div> </div>
<!-- 右下信息 --> <!-- 右下信息 -->
<div class="info"> <div class="info">
<n-grid x-gap="16" y-gap="0" :cols="12"> <n-grid x-gap="16" y-gap="0" :cols="12">
<n-gi span="4"> <!-- <n-gi span="4">
<span style="color: #8b8d8f"> <span style="color: #8b8d8f">
<SvgIcon name="m1" /> <SvgIcon name="m1" />
</span> </span>
@ -482,7 +490,7 @@ function previewHandler(event: MouseEvent) {
> >
<span>{{ mark }}</span> <span>{{ mark }}</span>
<span>图片标记</span> <span>图片标记</span>
</n-gi> </n-gi> -->
<n-gi span="4"> <n-gi span="4">
<span style="color: #8b8d8f"> <span style="color: #8b8d8f">
<SvgIcon name="m2" /> <SvgIcon name="m2" />
@ -511,7 +519,7 @@ function previewHandler(event: MouseEvent) {
<n-image <n-image
ref="imageRef" ref="imageRef"
:img-props="{ onClick: hideDownload }" :img-props="{ onClick: hideDownload }"
:src="taskDetailInfo?.ocrPicture?.imgurl" :src="taskDetailInfo?.imgurl"
/> />
</div> </div>
<!-- 操作 --> <!-- 操作 -->
@ -530,20 +538,66 @@ function previewHandler(event: MouseEvent) {
</div> </div>
<div class="right"> <div class="right">
<n-scrollbar style="max-height: 100%"> <n-scrollbar style="max-height: 100%">
<span class="name">图片名称</span> <span class="name">任务ID：{{taskDetailInfo.taskname}}</span>
<div class="tags"> <div class="tags">
<div class="tag tag-actived">重复图片</div> <div class="tag tag-actived">重复图片</div>
<div class="tag">基线任务</div> <div class="tag">基线任务</div>
</div> </div>
<n-divider /> <n-divider />
<div class="property"> <div class="property">
<span class="property-name top" style="font-weight: bold; color: #333333" <span class="property-name top" style=" color: #666666"
>拜访终端 >图片大小
</span>
<span style=" color: #333333; font-size: 16px"
>{{ (taskDetailInfo?.pictureInfo?.imgSize /1000).toFixed(2) }}KB</span
>
</div>
<div class="property">
<span class="property-name top" style=" color: #666666"
>图片格式
</span>
<span style=" color: #333333; font-size: 16px"
>{{ taskDetailInfo?.pictureInfo?.imgSpace }}</span
>
</div>
<div class="property">
<span class="property-name top" style=" color: #666666"
>图片尺寸
</span>
<span style=" color: #333333; font-size: 16px"
>{{ taskDetailInfo?.pictureInfo?.imgMeasure }}</span
>
</div>
<div class="property">
<span class="property-name top" style=" color: #666666"
>色彩空间
</span> </span>
<span style="font-weight: bold; color: #333333; font-size: 16px" <span style=" color: #333333; font-size: 16px"
>拜访终端</span >{{ taskDetailInfo?.pictureInfo?.imgMeasure }}</span
> >
</div> </div>
<div class="property">
<span class="property-name top" style=" color: #666666"
>提报人
</span>
<span style=" color: #333333; font-size: 16px"
>{{ taskDetailInfo?.pictureInfo?.source || "-" }}</span
>
</div>
<div class="property">
<span class="property-name top" style=" color: #666666"
>创建时间
</span>
<span style=" color: #333333; font-size: 16px"
>{{ taskDetailInfo?.pictureInfo && format(taskDetailInfo?.pictureInfo?.createTime, 'yyyy-MM-dd HH:mm:ss')}}</span>
</div>
<div class="property">
<span class="property-name top" style=" color: #666666"
>提报时间
</span>
<span style=" color: #333333; font-size: 16px"
>{{ taskDetailInfo?.uploadTime && format(taskDetailInfo?.pictureInfo?.uploadTime, 'yyyy-MM-dd HH:mm:ss') || '-'}}</span>
</div>
<div v-for="key in Object.keys(propertys)" :key="key" class="property"> <div v-for="key in Object.keys(propertys)" :key="key" class="property">
<span class="property-name">{{ fieldMap[key] }}</span> <span class="property-name">{{ fieldMap[key] }}</span>
<span class="property-content">{{ propertys[key] }}</span> <span class="property-content">{{ propertys[key] }}</span>
@ -557,13 +611,13 @@ function previewHandler(event: MouseEvent) {
><span>({{ totalCount }})</span> ><span>({{ totalCount }})</span>
</div> </div>
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<div style="cursor: pointer" @click="sortHandler('fromuptime')"> <div style="cursor: pointer" @click="sortHandler('createdate')">
<span>按时间排序</span> <span>按时间排序</span>
<SvgIcon style="margin-left: 8px" name="sort" size="12" /> <SvgIcon style="margin-left: 8px" name="sort" size="12" />
</div> </div>
<div <div
style="margin-left: 15px; cursor: pointer" style="margin-left: 15px; cursor: pointer"
@click="sortHandler('pictureResult')" @click="sortHandler('similarityScore')"
> >
<span>相似度排序</span> <span>相似度排序</span>
<SvgIcon style="margin-left: 8px" name="sort" size="12" /> <SvgIcon style="margin-left: 8px" name="sort" size="12" />
@ -582,7 +636,7 @@ function previewHandler(event: MouseEvent) {
> >
<div <div
class="img-wrapper" class="img-wrapper"
:style="{ 'background-image': `url(${item.thumburl})` }" :style="{ 'background-image': `url(${item.imgurl})` }"
/> />
<div class="time"> <div class="time">
<SvgIcon color="#FFF" size="16" name="time" /> <SvgIcon color="#FFF" size="16" name="time" />
@ -744,7 +798,7 @@ function previewHandler(event: MouseEvent) {
right: 2%; right: 2%;
bottom: 2%; bottom: 2%;
width: 136px; width: 136px;
height: 119px; height: 60px;
opacity: 0.44; opacity: 0.44;
background: rgba(216, 216, 216, 0.4); background: rgba(216, 216, 216, 0.4);
border-radius: 7px; border-radius: 7px;
@ -813,15 +867,7 @@ function previewHandler(event: MouseEvent) {
} }
.top { .top {
&::after {
position: absolute;
left: 72px;
top: 4px;
content: "";
width: 1px;
height: 12px;
background: #979797;
}
} }
.property-content { .property-content {

8
src/views/worksheet/index.vue
Unescape View File

@ -1,11 +1,11 @@
<script lang="ts" setup> <script lang="ts" setup>
import Aside from './aside/Aside.vue' import DataHeader from '@/components/DataHeader/index.vue';
import Content from './content/Content.vue' import Aside from './aside/Aside.vue';
import DataHeader from '@/components/DataHeader/index.vue' import Content from './content/Content.vue';
</script> </script>
<template> <template>
<div> <div style="width: 100%;">
<div class="header"> <div class="header">
<DataHeader v-show="false"/> <DataHeader v-show="false"/>
</div> </div>

5
types/api.d.ts vendored
Unescape View File

@ -7,6 +7,11 @@ export interface PictureSortParam {
orderbyname?: 'asc' | 'desc' orderbyname?: 'asc' | 'desc'
orderbyvalue?: 'pictureResult' | 'fromuptime' orderbyvalue?: 'pictureResult' | 'fromuptime'
} }
export interface SimilarityPictureSortParam {
checkDuplicateId?: string
orderType?: 'asc' | 'desc'
orderName?: 'similarityScore' | 'createdate'
}
export interface FilterSearchParam { export interface FilterSearchParam {
search_searchname?: { search_searchname?: {

2
types/workorder.d.ts vendored
Unescape View File

@ -1,5 +1,6 @@
// 任务包 // 任务包
export interface PackageListItem { export interface PackageListItem {
checkDuplicateId: string
id: string id: string
packagename: string packagename: string
pictureno: number pictureno: number
@ -11,6 +12,7 @@ export interface PackageListItem {
// 任务包状态 // 任务包状态
export interface OrderState { export interface OrderState {
name: string
activeId: string activeId: string
currentIndex: number currentIndex: number
packageList: PackageListItem[] packageList: PackageListItem[]

Write Preview
Loading…
Cancel
Save