|
|
|
|
@ -1,17 +1,15 @@
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
import { audit } from '@/api/task/task';
|
|
|
|
|
import {
|
|
|
|
|
getPictureSimilarityList, getTaskDetailInfo
|
|
|
|
|
} from "@/api/work/work";
|
|
|
|
|
import NotPassed from '@/components/Approval/NotPassed.vue';
|
|
|
|
|
import { TASK_STATUS_OBJ } from '@/enums/index';
|
|
|
|
|
import { audit } from "@/api/task/task";
|
|
|
|
|
import { getPictureSimilarityList, getTaskDetailInfo } from "@/api/work/work";
|
|
|
|
|
import NotPassed from "@/components/Approval/NotPassed.vue";
|
|
|
|
|
import { TASK_STATUS_OBJ } from "@/enums/index";
|
|
|
|
|
import { useWorkOrder } from "@/store/modules/workOrder";
|
|
|
|
|
import { isEmpty } from "@/utils";
|
|
|
|
|
import { formatToDateHMS } from "@/utils/dateUtil";
|
|
|
|
|
import { hideDownload } from "@/utils/image";
|
|
|
|
|
import emitter from '@/utils/mitt';
|
|
|
|
|
import emitter from "@/utils/mitt";
|
|
|
|
|
import { useInfiniteScroll } from "@vueuse/core";
|
|
|
|
|
import { format } from 'date-fns';
|
|
|
|
|
import { format } from "date-fns";
|
|
|
|
|
import imagesloaded from "imagesloaded";
|
|
|
|
|
import { clone, cloneDeep, debounce, pickBy } from "lodash-es";
|
|
|
|
|
import { useDialog, useMessage } from "naive-ui";
|
|
|
|
|
@ -68,10 +66,10 @@ const imageRef = ref<ComponentElRef | null>();
|
|
|
|
|
const listData = ref<any[]>([]);
|
|
|
|
|
const loading = ref(false);
|
|
|
|
|
const el = ref<HTMLDivElement | null>(null);
|
|
|
|
|
const selectedSortName = ref('');
|
|
|
|
|
const selectedSortName = ref("");
|
|
|
|
|
const isFullScreen = ref(false);
|
|
|
|
|
const notPassModalRef = ref(null)
|
|
|
|
|
const mainImageModalRef = ref(null)
|
|
|
|
|
const notPassModalRef = ref(null);
|
|
|
|
|
const mainImageModalRef = ref(null);
|
|
|
|
|
|
|
|
|
|
let canloadMore = true;
|
|
|
|
|
|
|
|
|
|
@ -131,13 +129,15 @@ async function loadMore() {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function featchList() {
|
|
|
|
|
|
|
|
|
|
loading.value = true;
|
|
|
|
|
try {
|
|
|
|
|
taskpagination.pageNo += 1;
|
|
|
|
|
const { data, total, pageCount } = await getPictureSimilarityList(
|
|
|
|
|
{ ...taskpagination, ...sortBy, checkDuplicateId: workStore.activeId, pictureId: taskDetailInfo.value.id }
|
|
|
|
|
);
|
|
|
|
|
const { data, total, pageCount } = await getPictureSimilarityList({
|
|
|
|
|
...taskpagination,
|
|
|
|
|
...sortBy,
|
|
|
|
|
checkDuplicateId: workStore.activeId,
|
|
|
|
|
pictureId: taskDetailInfo.value.id,
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
totalCount.value = total;
|
|
|
|
|
canloadMore = pageCount >= taskpagination.pageNo && pageCount > 0;
|
|
|
|
|
@ -165,14 +165,13 @@ const layout = debounce(() => {
|
|
|
|
|
});
|
|
|
|
|
}, 300);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const fullscreenStyles = computed<any>(() => ({
|
|
|
|
|
'width': isFullScreen.value ? '100vw' : '',
|
|
|
|
|
'height': isFullScreen.value ? '100vh' : '',
|
|
|
|
|
'position': isFullScreen.value ? 'fixed' : '',
|
|
|
|
|
'top': isFullScreen.value ? '0' : '',
|
|
|
|
|
'left': isFullScreen.value ? '0' : '',
|
|
|
|
|
'zIndex': isFullScreen.value ? '100' : '',
|
|
|
|
|
width: isFullScreen.value ? "100vw" : "",
|
|
|
|
|
height: isFullScreen.value ? "100vh" : "",
|
|
|
|
|
position: isFullScreen.value ? "fixed" : "",
|
|
|
|
|
top: isFullScreen.value ? "0" : "",
|
|
|
|
|
left: isFullScreen.value ? "0" : "",
|
|
|
|
|
zIndex: isFullScreen.value ? "100" : "",
|
|
|
|
|
}));
|
|
|
|
|
|
|
|
|
|
// 切换全屏状态
|
|
|
|
|
@ -180,7 +179,6 @@ const toggleFullScreen = () => {
|
|
|
|
|
isFullScreen.value = !isFullScreen.value;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
onUpdated(() => {
|
|
|
|
|
layout();
|
|
|
|
|
});
|
|
|
|
|
@ -192,10 +190,10 @@ watch(
|
|
|
|
|
if (isEmpty(packageid)) {
|
|
|
|
|
listData.value.length = 0;
|
|
|
|
|
totalCount.value = 0;
|
|
|
|
|
taskDetailInfo.value = {}
|
|
|
|
|
taskDetailInfo.value = {};
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
queryDetail(packageid)
|
|
|
|
|
queryDetail(packageid);
|
|
|
|
|
// const res = await getPackageTaskList(newValue, packagepagination);
|
|
|
|
|
// const { data } = res;
|
|
|
|
|
// taskList.value = data;
|
|
|
|
|
@ -273,7 +271,7 @@ function immersionHandler() {
|
|
|
|
|
function showAction() {
|
|
|
|
|
const item = taskDetailInfo.value;
|
|
|
|
|
if (item.historyStates === 2 || item.historyStates === 3) {
|
|
|
|
|
return
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
if (batch.value === false) overTask.value = item;
|
|
|
|
|
}
|
|
|
|
|
@ -290,161 +288,157 @@ function previewHandler(event: MouseEvent) {
|
|
|
|
|
(imageRef.value as any).mergedOnClick();
|
|
|
|
|
}
|
|
|
|
|
function rejectHandler() {
|
|
|
|
|
const modal = unref(notPassModalRef)! as any
|
|
|
|
|
modal.showModal(selectItems.value)
|
|
|
|
|
const modal = unref(notPassModalRef)! as any;
|
|
|
|
|
modal.showModal(selectItems.value);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function singleRejectHandler(item) {
|
|
|
|
|
const modal = unref(notPassModalRef)! as any
|
|
|
|
|
modal.showModal([item])
|
|
|
|
|
const modal = unref(notPassModalRef)! as any;
|
|
|
|
|
modal.showModal([item]);
|
|
|
|
|
}
|
|
|
|
|
function reject(idOrDesc: string, backId: string, isOther: boolean) {
|
|
|
|
|
const formIds: string[] = processItems.map(item => item.id)
|
|
|
|
|
const taskIds: string[] = processItems.map(item => item.taskId)
|
|
|
|
|
const tasknames: string[] = processItems.map(item => item.taskname)
|
|
|
|
|
const formIds: string[] = processItems.map((item) => item.id);
|
|
|
|
|
const taskIds: string[] = processItems.map((item) => item.taskId);
|
|
|
|
|
const tasknames: string[] = processItems.map((item) => item.taskname);
|
|
|
|
|
|
|
|
|
|
const param: ApprovalParam = {
|
|
|
|
|
formid: formIds,
|
|
|
|
|
taskId: taskIds,
|
|
|
|
|
approvd: false,
|
|
|
|
|
taskComment: idOrDesc,
|
|
|
|
|
taskname: isOther ? tasknames : ['其他'],
|
|
|
|
|
}
|
|
|
|
|
taskname: isOther ? tasknames : ["其他"],
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
doAudit(param)
|
|
|
|
|
doAudit(param);
|
|
|
|
|
}
|
|
|
|
|
function handleRejectMainImage() {
|
|
|
|
|
const modal = unref(mainImageModalRef)! as any
|
|
|
|
|
const params = cloneDeep(taskDetailInfo.value)
|
|
|
|
|
params.id = params.taskchildpictureid
|
|
|
|
|
modal.showModal([params])
|
|
|
|
|
const modal = unref(mainImageModalRef)! as any;
|
|
|
|
|
const params = cloneDeep(taskDetailInfo.value);
|
|
|
|
|
params.id = params.taskchildpictureid;
|
|
|
|
|
modal.showModal([params]);
|
|
|
|
|
}
|
|
|
|
|
async function reloadDetailInfo(){
|
|
|
|
|
async function reloadDetailInfo() {
|
|
|
|
|
const packageid = workStore.getActiveId;
|
|
|
|
|
taskDetailInfo.value = await getTaskDetailInfo(packageid);
|
|
|
|
|
}
|
|
|
|
|
function handleApproveMainImage(items?: any) {
|
|
|
|
|
let cloneItem: any
|
|
|
|
|
let cloneItem: any;
|
|
|
|
|
if (overTask.value) {
|
|
|
|
|
cloneItem = clone(overTask.value)
|
|
|
|
|
cloneItem.id = cloneItem.taskchildpictureid
|
|
|
|
|
processItems = [cloneItem]
|
|
|
|
|
cloneItem = clone(overTask.value);
|
|
|
|
|
cloneItem.id = cloneItem.taskchildpictureid;
|
|
|
|
|
processItems = [cloneItem];
|
|
|
|
|
}
|
|
|
|
|
const msg = validate(processItems)
|
|
|
|
|
const msg = validate(processItems);
|
|
|
|
|
if (msg !== null) {
|
|
|
|
|
message.error(msg)
|
|
|
|
|
return
|
|
|
|
|
message.error(msg);
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const list: any = []
|
|
|
|
|
const list: any = [];
|
|
|
|
|
processItems.forEach((item) => {
|
|
|
|
|
list.push({
|
|
|
|
|
formId: item.id,
|
|
|
|
|
taskId: item.taskId,
|
|
|
|
|
taskName: item.fromTaskName,
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const param = {
|
|
|
|
|
result: true,
|
|
|
|
|
comment: '',
|
|
|
|
|
disposeType: '',
|
|
|
|
|
disposeTypeId: '',
|
|
|
|
|
failCauseId: '',
|
|
|
|
|
failCauseName: '',
|
|
|
|
|
comment: "",
|
|
|
|
|
disposeType: "",
|
|
|
|
|
disposeTypeId: "",
|
|
|
|
|
failCauseId: "",
|
|
|
|
|
failCauseName: "",
|
|
|
|
|
flowTaskInfoList: list,
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
dialog.info({
|
|
|
|
|
title: '确认提示',
|
|
|
|
|
content: '确认给该任务审批为【通过】吗?',
|
|
|
|
|
positiveText: '确定',
|
|
|
|
|
negativeText: '取消',
|
|
|
|
|
title: "确认提示",
|
|
|
|
|
content: "确认给该任务审批为【通过】吗?",
|
|
|
|
|
positiveText: "确定",
|
|
|
|
|
negativeText: "取消",
|
|
|
|
|
onPositiveClick: () => {
|
|
|
|
|
audit(param).then(async(res) => {
|
|
|
|
|
const { code } = res
|
|
|
|
|
if (code === 'OK') {
|
|
|
|
|
message.info(res.message)
|
|
|
|
|
audit(param).then(async (res) => {
|
|
|
|
|
const { code } = res;
|
|
|
|
|
if (code === "OK") {
|
|
|
|
|
message.info(res.message);
|
|
|
|
|
const packageid = workStore.getActiveId;
|
|
|
|
|
taskDetailInfo.value = await getTaskDetailInfo(packageid);
|
|
|
|
|
}
|
|
|
|
|
else message.error(res.message)
|
|
|
|
|
})
|
|
|
|
|
} else message.error(res.message);
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
onNegativeClick: () => { },
|
|
|
|
|
})
|
|
|
|
|
onNegativeClick: () => {},
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
function approvalHandler(items?: any) {
|
|
|
|
|
let cloneItem: any
|
|
|
|
|
let cloneItem: any;
|
|
|
|
|
if (batch.value) {
|
|
|
|
|
processItems = selectItems.value
|
|
|
|
|
}
|
|
|
|
|
else if (overTask.value) {
|
|
|
|
|
cloneItem = clone(overTask.value)
|
|
|
|
|
processItems = [cloneItem]
|
|
|
|
|
processItems = selectItems.value;
|
|
|
|
|
} else if (overTask.value) {
|
|
|
|
|
cloneItem = clone(overTask.value);
|
|
|
|
|
processItems = [cloneItem];
|
|
|
|
|
}
|
|
|
|
|
// 任务包图片 => 点击 => 通过/不通过按钮
|
|
|
|
|
if (items !== undefined && !(items instanceof PointerEvent))
|
|
|
|
|
processItems = [items]
|
|
|
|
|
if (items !== undefined && !(items instanceof PointerEvent)) processItems = [items];
|
|
|
|
|
|
|
|
|
|
const msg = validate(processItems)
|
|
|
|
|
const msg = validate(processItems);
|
|
|
|
|
|
|
|
|
|
if (msg !== null) {
|
|
|
|
|
message.error(msg)
|
|
|
|
|
return
|
|
|
|
|
message.error(msg);
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const list: any = []
|
|
|
|
|
const list: any = [];
|
|
|
|
|
processItems.forEach((item) => {
|
|
|
|
|
list.push({
|
|
|
|
|
formId: item.id,
|
|
|
|
|
taskId: item.taskId,
|
|
|
|
|
taskName: item.fromTaskName,
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const param = {
|
|
|
|
|
result: true,
|
|
|
|
|
comment: '',
|
|
|
|
|
disposeType: '',
|
|
|
|
|
disposeTypeId: '',
|
|
|
|
|
failCauseId: '',
|
|
|
|
|
failCauseName: '',
|
|
|
|
|
comment: "",
|
|
|
|
|
disposeType: "",
|
|
|
|
|
disposeTypeId: "",
|
|
|
|
|
failCauseId: "",
|
|
|
|
|
failCauseName: "",
|
|
|
|
|
flowTaskInfoList: list,
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
dialog.info({
|
|
|
|
|
title: '确认提示',
|
|
|
|
|
content: '确认给该任务审批为【通过】吗?',
|
|
|
|
|
positiveText: '确定',
|
|
|
|
|
negativeText: '取消',
|
|
|
|
|
title: "确认提示",
|
|
|
|
|
content: "确认给该任务审批为【通过】吗?",
|
|
|
|
|
positiveText: "确定",
|
|
|
|
|
negativeText: "取消",
|
|
|
|
|
onPositiveClick: () => {
|
|
|
|
|
doAudit(param)
|
|
|
|
|
doAudit(param);
|
|
|
|
|
},
|
|
|
|
|
onNegativeClick: () => { },
|
|
|
|
|
})
|
|
|
|
|
onNegativeClick: () => {},
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function doAudit(param: any) {
|
|
|
|
|
audit(param).then((res) => {
|
|
|
|
|
const { code } = res
|
|
|
|
|
setBatch(false)
|
|
|
|
|
if (code === 'OK') {
|
|
|
|
|
message.info(res.message)
|
|
|
|
|
emitter.emit('refresh')
|
|
|
|
|
refreshHandler()
|
|
|
|
|
}
|
|
|
|
|
else message.error(res.message)
|
|
|
|
|
})
|
|
|
|
|
const { code } = res;
|
|
|
|
|
setBatch(false);
|
|
|
|
|
if (code === "OK") {
|
|
|
|
|
message.info(res.message);
|
|
|
|
|
emitter.emit("refresh");
|
|
|
|
|
refreshHandler();
|
|
|
|
|
} else message.error(res.message);
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function reloadList() {
|
|
|
|
|
setBatch(false)
|
|
|
|
|
refreshHandler()
|
|
|
|
|
setBatch(false);
|
|
|
|
|
refreshHandler();
|
|
|
|
|
}
|
|
|
|
|
defineExpose({
|
|
|
|
|
queryDetail
|
|
|
|
|
})
|
|
|
|
|
queryDetail,
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
@ -462,8 +456,20 @@ defineExpose({
|
|
|
|
|
批量审批
|
|
|
|
|
</div>
|
|
|
|
|
<div class="icon-wrap">
|
|
|
|
|
<SvgIcon size="20" v-if="isFullScreen" name="power-off" @click="immersionHandler" style="cursor: pointer;" />
|
|
|
|
|
<SvgIcon size="20" v-else name="immersion-model" @click="immersionHandler" style="cursor: pointer;" />
|
|
|
|
|
<SvgIcon
|
|
|
|
|
size="20"
|
|
|
|
|
v-if="isFullScreen"
|
|
|
|
|
name="power-off"
|
|
|
|
|
@click="immersionHandler"
|
|
|
|
|
style="cursor: pointer"
|
|
|
|
|
/>
|
|
|
|
|
<SvgIcon
|
|
|
|
|
size="20"
|
|
|
|
|
v-else
|
|
|
|
|
name="immersion-model"
|
|
|
|
|
@click="immersionHandler"
|
|
|
|
|
style="cursor: pointer"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
@ -489,50 +495,73 @@ defineExpose({
|
|
|
|
|
<div ref="el" class="scroll">
|
|
|
|
|
<div class="wrapper-detail">
|
|
|
|
|
<!-- 左侧大图 图片信息 -->
|
|
|
|
|
<div class="left" :style="{ 'background-image': `url(${taskDetailInfo?.imgurl})` }" @click="showAction"
|
|
|
|
|
@mouseleave="leaveTaskHandler">
|
|
|
|
|
<div
|
|
|
|
|
class="left"
|
|
|
|
|
:style="{ 'background-image': `url(${taskDetailInfo?.imgurl})` }"
|
|
|
|
|
@click="showAction"
|
|
|
|
|
@mouseleave="leaveTaskHandler"
|
|
|
|
|
>
|
|
|
|
|
<div class="footer-times">
|
|
|
|
|
<div class="time" style="margin-bottom: 4px;">
|
|
|
|
|
<div class="time" style="margin-bottom: 4px">
|
|
|
|
|
<SvgIcon color="#FFF" size="16" name="camera" />
|
|
|
|
|
<span class="time-value">{{ taskDetailInfo?.photoDateTimestamp ? format(
|
|
|
|
|
taskDetailInfo.photoDateTimestamp, 'yyyy-MM-dd HH:mm:ss') : '-' }} </span>
|
|
|
|
|
<span class="time-value">{{ taskDetailInfo?.photoDateTimestamp }} </span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="time">
|
|
|
|
|
<SvgIcon color="#FFF" size="16" name="save" />
|
|
|
|
|
<span class="time-value">{{
|
|
|
|
|
taskDetailInfo?.submitDateTimestamp ? format(taskDetailInfo?.submitDateTimestamp, 'yyyy-MM-dd HH:mm:ss')
|
|
|
|
|
:
|
|
|
|
|
'-'
|
|
|
|
|
}} </span>
|
|
|
|
|
<span class="time-value"
|
|
|
|
|
>{{
|
|
|
|
|
taskDetailInfo?.submitDateTimestamp
|
|
|
|
|
? format(taskDetailInfo?.submitDateTimestamp, "yyyy-MM-dd HH:mm:ss")
|
|
|
|
|
: "-"
|
|
|
|
|
}}
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="status">
|
|
|
|
|
<img v-show="taskDetailInfo?.historyStates === 2" class="img-status" src="@/assets/images/task/pass.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-show="taskDetailInfo?.historyStates === 3" class="img-status" src="@/assets/images/task/not_pass.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img
|
|
|
|
|
v-show="taskDetailInfo?.historyStates === 2"
|
|
|
|
|
class="img-status"
|
|
|
|
|
src="@/assets/images/task/pass.png"
|
|
|
|
|
alt=""
|
|
|
|
|
/>
|
|
|
|
|
<img
|
|
|
|
|
v-show="taskDetailInfo?.historyStates === 3"
|
|
|
|
|
class="img-status"
|
|
|
|
|
src="@/assets/images/task/not_pass.png"
|
|
|
|
|
alt=""
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 右下信息 -->
|
|
|
|
|
<div class="info img-info">
|
|
|
|
|
<n-grid x-gap="12" y-gap="10" :cols="12">
|
|
|
|
|
<n-gi span="4" class="gi1">
|
|
|
|
|
<span>
|
|
|
|
|
<img class="icon-status" src="@/assets/images/task/status.png" alt="">
|
|
|
|
|
<img
|
|
|
|
|
class="icon-status"
|
|
|
|
|
src="@/assets/images/task/status.png"
|
|
|
|
|
alt=""
|
|
|
|
|
/>
|
|
|
|
|
</span>
|
|
|
|
|
</n-gi>
|
|
|
|
|
<n-gi span="8" class="gi2">
|
|
|
|
|
<span class="value">{{ TASK_STATUS_OBJ[taskDetailInfo.historyStates] }}</span>
|
|
|
|
|
<span class="value">{{
|
|
|
|
|
TASK_STATUS_OBJ[taskDetailInfo.historyStates]
|
|
|
|
|
}}</span>
|
|
|
|
|
<span class="label">审批状态</span>
|
|
|
|
|
</n-gi>
|
|
|
|
|
<n-gi span="4" class="gi1">
|
|
|
|
|
<span>
|
|
|
|
|
<img class="icon-status" src="@/assets/images/task/similarity.png" alt="">
|
|
|
|
|
<img
|
|
|
|
|
class="icon-status"
|
|
|
|
|
src="@/assets/images/task/similarity.png"
|
|
|
|
|
alt=""
|
|
|
|
|
/>
|
|
|
|
|
</span>
|
|
|
|
|
</n-gi>
|
|
|
|
|
<n-gi span="8" class="gi2">
|
|
|
|
|
<span class="value num">{{
|
|
|
|
|
totalCount
|
|
|
|
|
}}<span class="unit">张</span> </span>
|
|
|
|
|
<span class="value num"
|
|
|
|
|
>{{ totalCount }}<span class="unit">张</span>
|
|
|
|
|
</span>
|
|
|
|
|
<span class="label">相似匹配</span>
|
|
|
|
|
</n-gi>
|
|
|
|
|
</n-grid>
|
|
|
|
|
@ -543,73 +572,150 @@ defineExpose({
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 预览大图组件 -->
|
|
|
|
|
<div style="display: none">
|
|
|
|
|
<n-image ref="imageRef" :img-props="{ onClick: hideDownload }" :src="taskDetailInfo?.imgurl" />
|
|
|
|
|
<n-image
|
|
|
|
|
ref="imageRef"
|
|
|
|
|
:img-props="{ onClick: hideDownload }"
|
|
|
|
|
:src="taskDetailInfo?.imgurl"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 操作 -->
|
|
|
|
|
<div v-show="overTask && overTask.id === taskDetailInfo.id" class="action" @click.stop="hideAction">
|
|
|
|
|
<SvgIcon style="cursor: pointer" name="t1" @click.stop="handleApproveMainImage" />
|
|
|
|
|
<SvgIcon style="cursor: pointer; margin-left: 30px" name="t2" @click.stop="handleRejectMainImage" />
|
|
|
|
|
<div
|
|
|
|
|
v-show="overTask && overTask.id === taskDetailInfo.id"
|
|
|
|
|
class="action"
|
|
|
|
|
@click.stop="hideAction"
|
|
|
|
|
>
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="cursor: pointer"
|
|
|
|
|
name="t1"
|
|
|
|
|
@click.stop="handleApproveMainImage"
|
|
|
|
|
/>
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="cursor: pointer; margin-left: 30px"
|
|
|
|
|
name="t2"
|
|
|
|
|
@click.stop="handleRejectMainImage"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<PictureInfo :taskDetailInfo="taskDetailInfo"></PictureInfo>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="display: flex; justify-content: space-between; padding: 12px 0px 3px 0">
|
|
|
|
|
<div
|
|
|
|
|
style="display: flex; justify-content: space-between; padding: 12px 0px 3px 0"
|
|
|
|
|
>
|
|
|
|
|
<div>
|
|
|
|
|
<span
|
|
|
|
|
style="font-size: 18px; font-weight: Medium;color: #333333;font-family: PingFang SC, PingFang SC-Medium;">任务包图片</span>
|
|
|
|
|
style="
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
font-weight: Medium;
|
|
|
|
|
color: #333333;
|
|
|
|
|
font-family: PingFang SC, PingFang SC-Medium;
|
|
|
|
|
"
|
|
|
|
|
>任务包图片</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="display: flex; align-items: center;font-size: 14px;margin-right: 25px;color:#323233">
|
|
|
|
|
<div
|
|
|
|
|
style="
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
margin-right: 25px;
|
|
|
|
|
color: #323233;
|
|
|
|
|
"
|
|
|
|
|
>
|
|
|
|
|
<div style="cursor: pointer" @click="sortHandler('createdate')">
|
|
|
|
|
<span>时间排序</span>
|
|
|
|
|
<SvgIcon style="margin-left: 5px" name="sort" size="12" v-show="selectedSortName !== 'createdate'" />
|
|
|
|
|
<SvgIcon style="margin-left: 5px" name="active-sort" size="12" v-show="selectedSortName === 'createdate'" />
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="margin-left: 5px"
|
|
|
|
|
name="sort"
|
|
|
|
|
size="12"
|
|
|
|
|
v-show="selectedSortName !== 'createdate'"
|
|
|
|
|
/>
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="margin-left: 5px"
|
|
|
|
|
name="active-sort"
|
|
|
|
|
size="12"
|
|
|
|
|
v-show="selectedSortName === 'createdate'"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="margin-left: 15px; cursor: pointer" @click="sortHandler('similarityScore')">
|
|
|
|
|
<div
|
|
|
|
|
style="margin-left: 15px; cursor: pointer"
|
|
|
|
|
@click="sortHandler('similarityScore')"
|
|
|
|
|
>
|
|
|
|
|
<span>相似度排序</span>
|
|
|
|
|
<SvgIcon style="margin-left: 5px" name="sort" size="12" v-show="selectedSortName !== 'similarityScore'" />
|
|
|
|
|
<SvgIcon style="margin-left: 5px" name="active-sort" size="12"
|
|
|
|
|
v-show="selectedSortName === 'similarityScore'" />
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="margin-left: 5px"
|
|
|
|
|
name="sort"
|
|
|
|
|
size="12"
|
|
|
|
|
v-show="selectedSortName !== 'similarityScore'"
|
|
|
|
|
/>
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="margin-left: 5px"
|
|
|
|
|
name="active-sort"
|
|
|
|
|
size="12"
|
|
|
|
|
v-show="selectedSortName === 'similarityScore'"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="wrapper-list">
|
|
|
|
|
<div v-for="(item, index) in listData" :key="index" :class="{ 'item-selected': item === selectTask }"
|
|
|
|
|
class="grid-item" @click="handleSelect(item)" @mouseover="overTaskHandelr(item)"
|
|
|
|
|
@mouseleave="leaveTaskHandler">
|
|
|
|
|
<div class="img-wrapper" :style="{ 'background-image': `url(${item.imgurl})` }" />
|
|
|
|
|
<div
|
|
|
|
|
v-for="(item, index) in listData"
|
|
|
|
|
:key="index"
|
|
|
|
|
:class="{ 'item-selected': item === selectTask }"
|
|
|
|
|
class="grid-item"
|
|
|
|
|
@click="handleSelect(item)"
|
|
|
|
|
@mouseover="overTaskHandelr(item)"
|
|
|
|
|
@mouseleave="leaveTaskHandler"
|
|
|
|
|
>
|
|
|
|
|
<div
|
|
|
|
|
class="img-wrapper"
|
|
|
|
|
:style="{ 'background-image': `url(${item.imgurl})` }"
|
|
|
|
|
/>
|
|
|
|
|
<div class="time-wrapper">
|
|
|
|
|
<div class="time">
|
|
|
|
|
<SvgIcon color="#FFF" size="16" name="camera" />
|
|
|
|
|
<span class="current-time">{{ item.photoDateTimestamp ? formatToDateHMS(Number(item.photoDateTimestamp) ||
|
|
|
|
|
0) : '-'
|
|
|
|
|
<span class="current-time">{{
|
|
|
|
|
item.photoDateTimestamp
|
|
|
|
|
? formatToDateHMS(Number(item.photoDateTimestamp) || 0)
|
|
|
|
|
: "-"
|
|
|
|
|
}}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="time">
|
|
|
|
|
<SvgIcon color="#FFF" size="16" name="save" />
|
|
|
|
|
<span class="current-time">{{ item.submitDateTimestamp ? formatToDateHMS(Number(item.submitDateTimestamp)
|
|
|
|
|
|| 0) : '-'
|
|
|
|
|
<span class="current-time">{{
|
|
|
|
|
item.submitDateTimestamp
|
|
|
|
|
? formatToDateHMS(Number(item.submitDateTimestamp) || 0)
|
|
|
|
|
: "-"
|
|
|
|
|
}}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="check">
|
|
|
|
|
<n-checkbox v-show="batch && item.historyStates !== 2 && item.historyStates !== 3"
|
|
|
|
|
v-model:checked="item.checked" @click.stop @update:checked="onCheckChange($event, item)" />
|
|
|
|
|
<n-checkbox
|
|
|
|
|
v-show="batch && item.historyStates !== 2 && item.historyStates !== 3"
|
|
|
|
|
v-model:checked="item.checked"
|
|
|
|
|
@click.stop
|
|
|
|
|
@update:checked="onCheckChange($event, item)"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="percent" :class="{ 'percent-red': item?.maxSimilarity >= 100 }">
|
|
|
|
|
<div class="val">
|
|
|
|
|
{{ item?.maxSimilarity && Number(item?.maxSimilarity).toFixed(0) }}<span class="percent-unit">%</span>
|
|
|
|
|
{{ item?.maxSimilarity && Number(item?.maxSimilarity).toFixed(0)
|
|
|
|
|
}}<span class="percent-unit">%</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="pass-status" v-if="item.historyStates === 2">
|
|
|
|
|
<SvgIcon name="pass-icon" style="width:52;height:24px" />
|
|
|
|
|
<SvgIcon name="pass-icon" style="width: 52; height: 24px" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="pass-status" v-else-if="item.historyStates === 3">
|
|
|
|
|
<SvgIcon name="no-pass-icon" style="width:52;height:24px" />
|
|
|
|
|
<SvgIcon name="no-pass-icon" style="width: 52; height: 24px" />
|
|
|
|
|
</div>
|
|
|
|
|
<div v-show="overTask && overTask.id === item.id" class="action">
|
|
|
|
|
<SvgIcon style="cursor: pointer" name="t1" @click.stop="approvalHandler" />
|
|
|
|
|
<SvgIcon style="cursor: pointer;margin-left: 40px;" name="t2" @click.stop="singleRejectHandler(item)" />
|
|
|
|
|
<SvgIcon
|
|
|
|
|
style="cursor: pointer; margin-left: 40px"
|
|
|
|
|
name="t2"
|
|
|
|
|
@click.stop="singleRejectHandler(item)"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -732,7 +838,7 @@ defineExpose({
|
|
|
|
|
z-index: 3;
|
|
|
|
|
width: 30px;
|
|
|
|
|
height: 30px;
|
|
|
|
|
background: rgba(255, 255, 255, 0.20);
|
|
|
|
|
background: rgba(255, 255, 255, 0.2);
|
|
|
|
|
border-radius: 6px;
|
|
|
|
|
backdrop-filter: blur(10px);
|
|
|
|
|
display: flex;
|
|
|
|
|
@ -772,7 +878,11 @@ defineExpose({
|
|
|
|
|
.footer-times {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 80px;
|
|
|
|
|
background: linear-gradient(180deg, rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 0.71) 100%);
|
|
|
|
|
background: linear-gradient(
|
|
|
|
|
180deg,
|
|
|
|
|
rgba(0, 0, 0, 0.01),
|
|
|
|
|
rgba(0, 0, 0, 0.71) 100%
|
|
|
|
|
);
|
|
|
|
|
border-radius: 0px 8px 8px 0px;
|
|
|
|
|
position: absolute;
|
|
|
|
|
bottom: 0;
|
|
|
|
|
@ -824,7 +934,7 @@ defineExpose({
|
|
|
|
|
justify-content: center;
|
|
|
|
|
width: 30px;
|
|
|
|
|
height: 30px;
|
|
|
|
|
background: rgba(80, 122, 253, .1);
|
|
|
|
|
background: rgba(80, 122, 253, 0.1);
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
margin-left: 10px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
@ -863,7 +973,6 @@ defineExpose({
|
|
|
|
|
.unit {
|
|
|
|
|
font-size: 11px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -885,7 +994,6 @@ defineExpose({
|
|
|
|
|
padding: 24px;
|
|
|
|
|
// background: lime;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.task-name {
|
|
|
|
|
display: inline-block;
|
|
|
|
|
width: 100%;
|
|
|
|
|
@ -926,18 +1034,18 @@ defineExpose({
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tag-submited {
|
|
|
|
|
color: #507AFD;
|
|
|
|
|
border: 1px solid #507AFD;
|
|
|
|
|
color: #507afd;
|
|
|
|
|
border: 1px solid #507afd;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tag-submiting {
|
|
|
|
|
color: #FFB800;
|
|
|
|
|
border: 1px solid #FFB800;
|
|
|
|
|
color: #ffb800;
|
|
|
|
|
border: 1px solid #ffb800;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tag-passed {
|
|
|
|
|
color: #02C984;
|
|
|
|
|
border: 1px solid #02C984;
|
|
|
|
|
color: #02c984;
|
|
|
|
|
border: 1px solid #02c984;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tag-not-passed {
|
|
|
|
|
@ -965,7 +1073,8 @@ defineExpose({
|
|
|
|
|
margin-right: 32px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.top {}
|
|
|
|
|
.top {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.property-content {
|
|
|
|
|
flex: 1;
|
|
|
|
|
@ -1007,7 +1116,11 @@ defineExpose({
|
|
|
|
|
bottom: 9px;
|
|
|
|
|
width: calc(100% - 11px);
|
|
|
|
|
height: 58px;
|
|
|
|
|
background: linear-gradient(180deg, rgba(0, 0, 0, 0.01), rgba(0, 0, 0, 0.71) 100%);
|
|
|
|
|
background: linear-gradient(
|
|
|
|
|
180deg,
|
|
|
|
|
rgba(0, 0, 0, 0.01),
|
|
|
|
|
rgba(0, 0, 0, 0.71) 100%
|
|
|
|
|
);
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
@ -1077,7 +1190,6 @@ defineExpose({
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.action {
|
|
|
|
|
position: absolute;
|
|
|
|
|
z-index: 5;
|
|
|
|
|
@ -1091,8 +1203,6 @@ defineExpose({
|
|
|
|
|
justify-content: center;
|
|
|
|
|
background-color: rgba(0, 0, 0, 0.48);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
