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 type { PageParam, PictureSortParam, SetTFParam } from '/#/api'
import type { PageParam, PictureSortParam, SetTFParam, SimilarityPictureSortParam } from '/#/api'
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
@ -44,16 +62,14 @@ export async function getPackageTaskList(packageid: string, params: PageParam) {
}
/**
* 获取某个任务详情(字段信息)
* @param id 任务id
* @param packageid 任务包id
* 任务包列表主图-新
* @param checkDuplicateId 查重id
* @returns
*/
export async function getTaskDetailInfo(taskId: string, packageid: string) {
const pid = packageid || 0
export async function getTaskDetailInfo(checkDuplicateId: string) {
const res = await http.request({
url: `/backstage/jifen/ocrtaskchildpicture/getdata/${taskId}/${pid}`,
url: `/ocr/ocrPicture/getPackagePicture?checkDuplicateId=${checkDuplicateId}`,
method: 'get',
})
@ -67,11 +83,10 @@ export async function getTaskDetailInfo(taskId: string, packageid: string) {
* @param params
* @returns
*/
export async function getTaskDetailPictureList(packageid: string, taskchildpictureid: string, params: PageParam & PictureSortParam) {
const pid = packageid || 0
export async function getTaskDetailPictureList(params: PageParam & PictureSortParam & SimilarityPictureSortParam) {
const res = await http.request({
url: `/backstage/jifen/ocrtaskchildpicture/listbypictureid/${pid}/${taskchildpictureid}`,
url: `/backstage/jifen/ocrtaskchildpicture/getPictureSimilarityList`,
method: 'get',
params,
})
@ -79,20 +94,22 @@ export async function getTaskDetailPictureList(packageid: string, taskchildpictu
const { data: { records, pages, total } } = res
// 精简一下数据
const list = records.map((item) => {
const list = records.map((item,index) => {
return {
id: item.id,
taskId: item.taskId,
taskname: item.fromtaskname,
assignee: item.assignee,
pictureid: item.pictureid,
imgurl: item.ocrPicture.imgurl,
thumburl: item.ocrPicture.serverThumbnailUrl || item.ocrPicture.imgurl,
imgurl: item.imgUrl,
thumburl: item.ocrPicture?.serverThumbnailUrl || item.ocrPicture?.imgurl,
iztrueorfalse: item.iztrueorfalse,
states: item.states,
history: hasHistory(item.ocpictureid, item.picturecompare),
history: item.ocpictureid && item.picturecompare && hasHistory(item.ocpictureid, item.picturecompare),
}
})
return {
pageCount: pages,
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 { store } from '@/store'
import { useMessage } from 'naive-ui'
import { defineStore } from 'pinia'
import type { OrderState, PackageListItem } from '/#/workorder'
export const useWorkOrderStore = defineStore({
id: 'work-order',
@ -11,6 +11,7 @@ export const useWorkOrderStore = defineStore({
activeId: '',
packageList: [],
immersion: false,
name: ''
}),
getters: {
getActiveId: (state: OrderState) => state.activeId,
@ -24,7 +25,7 @@ export const useWorkOrderStore = defineStore({
setActive(index: number, orderId?: string) {
this.currentIndex = index
const order = this.packageList[index]
this.activeId = orderId || order?.id
this.activeId = orderId || order?.checkDuplicateId
},
forward() {
const len = this.packageList.length
@ -45,7 +46,6 @@ export const useWorkOrderStore = defineStore({
},
async fetchOrderList(pagination, keyword) {
const res = await getPackageList(pagination, keyword)
if (res.data&&res.data.length > 0) {
this.packageList.push(...res.data)
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) {
workStore.setActive(index)
showModal(approvalModalRef, id)
// showModal(approvalModalRef, id)
}
useInfiniteScroll(
@ -139,7 +139,7 @@ defineExpose({
<ListItem
v-for="(item, index) in data"
:key="item.id"
:selected="activeId === item.id"
:selected="activeId === item.checkDuplicateId"
:list-item="item"
:show-field-list="showFieldList"
:dicts="dicts"

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

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

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

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

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

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

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

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

Write Preview
Loading…
Cancel
Save