相似图片

src/api/task/task.ts

@@ -75,3 +75,40 @@ export async function removeFiles(params) {
 
   return res
 }
+
+/**
+ *  获取某个任务详情(相似图片列表)
+ * @param packageid 任务包id
+ * @param taskchildpictureid 任务详情的id
+ * @param params
+ * @returns
+ */
+export async function getSimilarityList(params: any) {
+  const res = await http.request({
+    url: `/backstage/jifen/ocrtaskchildpicture/getSimilarityList`,
+    method: 'get',
+    params,
+  })
+
+  const { data: { records, pages, total } } = res
+  // 精简一下数据
+  const list = records.map((item) => {
+    return {
+      id: item.id,
+      taskId: item.taskId,
+      taskname: item.fromtaskname,
+      assignee: item.assignee,
+      pictureid: item.pictureid,
+      imgurl: item.imgUrl,
+      thumburl: item.imgUrl,
+      iztrueorfalse: item.iztrueorfalse,
+      states: item.states,
+    }
+  })
+
+  return {
+    pageCount: pages,
+    data: records,
+    total,
+  }
+}

src/assets/icons/more-blue.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1711468398773" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7494" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M227.552 512a56.896 56.896 0 1 1 113.792 0 56.896 56.896 0 0 1-113.792 0zM512 568.896a56.896 56.896 0 1 0 0-113.792 56.896 56.896 0 0 0 0 113.792z m227.552 0a56.896 56.896 0 1 0 0-113.792 56.896 56.896 0 0 0 0 113.792z" p-id="7495" fill="#507AFD"></path></svg>

src/views/final/comp/RepeatModal.vue

@@ -274,11 +274,13 @@ defineExpose({
   .img-btn1{
     width: 162px;
     height: 54px;
+    cursor: pointer;
   }
 
   .img-btn{
     width: 173px;
     height: 54px;
+    cursor: pointer;
   }
 }
 </style>

src/views/task/content/Content.vue

@@ -6,7 +6,7 @@ import { useRoute } from 'vue-router'
 import BatchModal from '../modal/BatchModal.vue'
 import { getAllfieldList, getfieldList } from '@/api/home/filter'
 
-import { audit, dubiousfileyd } from '@/api/task/task'
+import { audit, dubiousfileyd, getSimilarityList } from '@/api/task/task'
 import { getTaskDetailInfo, getTaskDetailPictureList } from '@/api/work/work'
 import { useTask } from '@/store/modules/task'
 import { useUser } from '@/store/modules/user'
@@ -32,9 +32,9 @@ const CustomSettingModalRef = ref(null)
 const taskTableData = ref<any[]>([])
 const route = useRoute()
 
-const sortBy: PictureSortParam = {
-  orderbyname: 'asc',
-  orderbyvalue: 'pictureResult',
+const sortBy: any = {
+  orderType: 'asc',
+  orderName: 'similarityScore',
 }
 
 function setBatch(value: boolean) {
@@ -294,6 +294,7 @@ watch(
     if (isEmpty(taskId))
       return
     taskDetailInfo.value = await getTaskDetailInfo(taskId, packageid)
+    console.log(taskDetailInfo.value)
     getTableData()
     // TODO mock备份 确认逻辑无误后删除
     // let showFieldData = taskDetailInfo.value.ocrPicture;
@@ -315,13 +316,14 @@ watch(
     //     }
     //   }
     // }
-    if (!isEmpty(packageid)) {
-      const { data, total } = await getTaskDetailPictureList(
-        packageid,
-        taskId,
-        { ...taskpagination, ...sortBy },
+    if (!isEmpty(taskDetailInfo.value.ocrPicture.id)) {
+      const { data, total } = await getSimilarityList(
+        { pictureId: taskDetailInfo.value.ocrPicture.id, ...taskpagination, ...sortBy },
       )
+      console.log(data)
+
       taskDetailPictureList.value = data
+      console.log(taskDetailPictureList.value)
       totalCount.value = total
     }
     else {
@@ -417,12 +419,38 @@ function getPercent(pictureid: string) {
             <SvgIcon style="margin-right: 6px" size="22" name="batch" />
             批量审批
           </div>
-          <SvgIcon
-            style="cursor: pointer"
-            size="20"
-            name="immersion-model"
-            @click="immersionHandler"
-          />
+          <n-popover
+            ref="popover"
+            :style="{ padding: '0px' }"
+            style="width: 148px"
+            :show-arrow="false"
+            placement="bottom-start"
+            trigger="click"
+          >
+            <template #trigger>
+              <div class="icon-wrap">
+                <SvgIcon size="20" name="more-blue" />
+              </div>
+            </template>
+            <ul class="wrapper-header-action">
+              <li @click="importHandler">
+                <SvgIcon size="20" name="download" /><span style="margin-left: 5px">批量导入数据</span>
+              </li>
+              <li @click="exportHandler">
+                <SvgIcon size="20" name="download" /><span style="margin-left: 5px">导出待审数据</span>
+              </li>
+              <li>
+                <SvgIcon size="20" name="download" /><span style="margin-left: 5px">导出全部数据</span>
+              </li>
+            </ul>
+          </n-popover>
+          <div class="icon-wrap">
+            <SvgIcon
+              size="20"
+              name="immersion-model"
+              @click="immersionHandler"
+            />
+          </div>
         </div>
         <div v-show="showActions" class="batch">
           <n-button text @click="setBatch(false)">
@@ -546,13 +574,13 @@ function getPercent(pictureid: string) {
           <div class="list">
             <div
               v-for="(item, index) in taskDetailPictureList"
-              :key="index"
+              :key="item.id"
               class="item"
             >
               <div
                 draggable="true"
                 class="img-wrapper"
-                :style="{ 'background-image': `url(${item.thumburl})` }"
+                :style="{ 'background-image': `url(${item.imgUrl})` }"
                 @dragend="(event) => { handleDragEnd(event, item) }"
               />
               <div class="check">
@@ -604,6 +632,32 @@ function getPercent(pictureid: string) {
 ::v-deep(.n-tabs-tab--active .n-tabs-tab__label) {
   color: #507AFD;
 }
+
+.wrapper-header-action {
+  padding: 8px;
+
+  li {
+    height: 32px;
+    line-height: 32px;
+    cursor: pointer;
+
+    &:hover {
+      background-color: #f3f8ff;
+    }
+  }
+}
+
+.icon-wrap{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 30px;
+  height: 30px;
+  background: rgba(80,122,253,.1);
+  border-radius: 8px;
+  margin-left: 10px;
+  cursor: pointer;
+}
 .wrapper {
   display: flex;
   flex: 1;
@@ -802,7 +856,7 @@ function getPercent(pictureid: string) {
       }
 
       .item {
-        flex-basis: calc((100% - 48px) / 3);
+        // flex-basis: calc((100% - 48px) / 3);
         box-sizing: border-box;
         border-radius: 8px;
         position: relative;
@@ -810,8 +864,8 @@ function getPercent(pictureid: string) {
         margin: 0px 16px 27px 0px;
 
         .img-wrapper {
-          // width: 230px;
-          height: 130px;
+          width: 122px;
+          height: 70px;
           overflow: hidden;
           background-size: cover;
           background-position: center;