|
|
|
|
@ -3,36 +3,35 @@ import Masonry from 'masonry-layout'
|
|
|
|
|
import { useDialog, useMessage } from 'naive-ui'
|
|
|
|
|
import { computed, nextTick, onBeforeMount, onMounted, onUpdated, reactive, ref, unref, watch } from 'vue'
|
|
|
|
|
|
|
|
|
|
import { dubiousfilelist, removeFiles } from '@/api/task/task'
|
|
|
|
|
import { viewOptions } from '@/config/home'
|
|
|
|
|
import { useInfiniteScroll } from '@vueuse/core'
|
|
|
|
|
import imagesloaded from 'imagesloaded'
|
|
|
|
|
import { debounce, cloneDeep } from 'lodash-es'
|
|
|
|
|
import { cloneDeep, debounce } from 'lodash-es'
|
|
|
|
|
import ConfrimModal from './ConfrimModal.vue'
|
|
|
|
|
import { audit, dubiousfilelist, removeFiles } from '@/api/task/task'
|
|
|
|
|
import { viewOptions } from '@/config/home'
|
|
|
|
|
|
|
|
|
|
import { audit } from '@/api/task/task'
|
|
|
|
|
import NotPassed from '@/components/Approval/NotPassed.vue'
|
|
|
|
|
import { formatToDateHMS } from '@/utils/dateUtil'
|
|
|
|
|
import { off, on } from '@/utils/domUtils'
|
|
|
|
|
import ConfrimModal from "./ConfrimModal.vue"
|
|
|
|
|
|
|
|
|
|
const cardStyle = {
|
|
|
|
|
'--n-padding-bottom': '40px',
|
|
|
|
|
'--n-padding-left': '120px',
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
let startTime = 0;
|
|
|
|
|
let endTime = 0;
|
|
|
|
|
let startCalTime = false;
|
|
|
|
|
let startTime = 0
|
|
|
|
|
let endTime = 0
|
|
|
|
|
let startCalTime = false
|
|
|
|
|
const message = useMessage()
|
|
|
|
|
const timeRange = ref('desc')
|
|
|
|
|
const similarRange = ref('desc')
|
|
|
|
|
const batch = ref(false)
|
|
|
|
|
const imageRef = ref<ComponentElRef | null>();
|
|
|
|
|
let filterId = null;
|
|
|
|
|
const imageRef = ref<ComponentElRef | null>()
|
|
|
|
|
const filterId = null
|
|
|
|
|
const isTop = ref(false)
|
|
|
|
|
let sortObj: any = {
|
|
|
|
|
orderByUptime: 'desc'
|
|
|
|
|
};
|
|
|
|
|
orderByUptime: 'desc',
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const timeOptions = [{
|
|
|
|
|
label: '升序',
|
|
|
|
|
@ -68,12 +67,12 @@ const viewLabel = computed(() => {
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const maxHeight = computed(() => {
|
|
|
|
|
let height = "800";
|
|
|
|
|
const screenWidth = window.screen.width;
|
|
|
|
|
if(screenWidth <= 1920) {
|
|
|
|
|
height = "600";
|
|
|
|
|
}
|
|
|
|
|
return height + 'px';
|
|
|
|
|
let height = '800'
|
|
|
|
|
const screenWidth = window.screen.width
|
|
|
|
|
if (screenWidth <= 1920)
|
|
|
|
|
height = '600'
|
|
|
|
|
|
|
|
|
|
return `${height}px`
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const masonryRef = ref<ComponentRef>(null)
|
|
|
|
|
@ -87,10 +86,10 @@ const pagination = reactive({
|
|
|
|
|
let loading = false
|
|
|
|
|
let _masonry: null | Masonry = null
|
|
|
|
|
const show = ref(false)
|
|
|
|
|
const selectedApproveItems = ref<any[]>([]); // 审核批量选中
|
|
|
|
|
const dialog = useDialog();
|
|
|
|
|
let processItems: any[] = [];
|
|
|
|
|
const confrimModalRef = ref<any>();
|
|
|
|
|
const selectedApproveItems = ref<any[]>([]) // 审核批量选中
|
|
|
|
|
const dialog = useDialog()
|
|
|
|
|
let processItems: any[] = []
|
|
|
|
|
const confrimModalRef = ref<any>()
|
|
|
|
|
|
|
|
|
|
const layout = debounce(() => {
|
|
|
|
|
if (!show.value)
|
|
|
|
|
@ -111,11 +110,11 @@ const layout = debounce(() => {
|
|
|
|
|
const scrollHeight = el.value!.scrollHeight
|
|
|
|
|
const clientHeight = el.value!.clientHeight
|
|
|
|
|
const top = scrollHeight - clientHeight - 20
|
|
|
|
|
if(isTop.value) {
|
|
|
|
|
if (isTop.value)
|
|
|
|
|
el.value!.scrollTo({ top: 0, behavior: 'instant' })
|
|
|
|
|
}else {
|
|
|
|
|
else
|
|
|
|
|
el.value!.scrollTo({ top, behavior: 'instant' })
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// let height = 800 - 15;
|
|
|
|
|
// const screenWidth = window.screen.width;
|
|
|
|
|
// if(screenWidth <= 1920) {
|
|
|
|
|
@ -123,28 +122,28 @@ const layout = debounce(() => {
|
|
|
|
|
// }
|
|
|
|
|
// el.value!.scrollTo({ top: height, behavior: 'instant' })
|
|
|
|
|
loading = false
|
|
|
|
|
console.log("loading---------------", loading);
|
|
|
|
|
console.log("pagination.pageNo---------------", pagination.pageNo);
|
|
|
|
|
if(pagination.pageNo == 3) {
|
|
|
|
|
let timer;
|
|
|
|
|
if(timer) {
|
|
|
|
|
clearTimeout(timer);
|
|
|
|
|
}
|
|
|
|
|
console.log('loading---------------', loading)
|
|
|
|
|
console.log('pagination.pageNo---------------', pagination.pageNo)
|
|
|
|
|
if (pagination.pageNo == 3) {
|
|
|
|
|
let timer
|
|
|
|
|
if (timer)
|
|
|
|
|
clearTimeout(timer)
|
|
|
|
|
|
|
|
|
|
timer = setTimeout(() => {
|
|
|
|
|
isTop.value = false
|
|
|
|
|
console.log("isTop.value---------------", isTop.value);
|
|
|
|
|
console.log('isTop.value---------------', isTop.value)
|
|
|
|
|
}, 1000)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}, 300)
|
|
|
|
|
|
|
|
|
|
watch(viewMode, () => {
|
|
|
|
|
isTop.value = true;
|
|
|
|
|
isTop.value = true
|
|
|
|
|
layout()
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
onBeforeMount(async () => {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
let canloadMore = true
|
|
|
|
|
@ -153,7 +152,7 @@ useInfiniteScroll(
|
|
|
|
|
el as any,
|
|
|
|
|
() => {
|
|
|
|
|
loading = false
|
|
|
|
|
console.log("加载了000000000000000---------------------------");
|
|
|
|
|
console.log('加载了000000000000000---------------------------')
|
|
|
|
|
loadMore()
|
|
|
|
|
},
|
|
|
|
|
{ distance: 10, canLoadMore: () => canloadMore },
|
|
|
|
|
@ -163,15 +162,15 @@ async function featchList() {
|
|
|
|
|
loading = true
|
|
|
|
|
try {
|
|
|
|
|
// const result = await dubiousfilelist({ ...pagination, orderbyname: timeRange.value })
|
|
|
|
|
console.log("pagination.pageNo------------", pagination.pageNo);
|
|
|
|
|
console.log('pagination.pageNo------------', pagination.pageNo)
|
|
|
|
|
const result = await dubiousfilelist({ ...pagination, ...sortObj })
|
|
|
|
|
// TODO：测试数据
|
|
|
|
|
// result.data = Array.from({ length: 30 })
|
|
|
|
|
const { data, pageCount } = result
|
|
|
|
|
// canloadMore = pageCount >= pagination.pageNo && pageCount > 0;
|
|
|
|
|
canloadMore = data.pages >= pagination.pageNo && data.pages > 0;
|
|
|
|
|
console.log("canloadMore------------", canloadMore);
|
|
|
|
|
|
|
|
|
|
canloadMore = data.pages >= pagination.pageNo && data.pages > 0
|
|
|
|
|
console.log('canloadMore------------', canloadMore)
|
|
|
|
|
|
|
|
|
|
return result.data.records
|
|
|
|
|
// const list = data.map((item) => {
|
|
|
|
|
// return {
|
|
|
|
|
@ -181,32 +180,31 @@ async function featchList() {
|
|
|
|
|
// return list
|
|
|
|
|
}
|
|
|
|
|
catch (error) {
|
|
|
|
|
canloadMore = false;
|
|
|
|
|
canloadMore = false
|
|
|
|
|
return []
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function loadMore() {
|
|
|
|
|
|
|
|
|
|
console.log("执行l------------------------", loading, el.value, pagination.pageNo);
|
|
|
|
|
console.log('执行l------------------------', loading, el.value, pagination.pageNo)
|
|
|
|
|
if (loading || el.value == null)
|
|
|
|
|
return
|
|
|
|
|
|
|
|
|
|
// loading = true
|
|
|
|
|
pagination.pageNo = pagination.pageNo + 1;
|
|
|
|
|
pagination.pageNo = pagination.pageNo + 1
|
|
|
|
|
const more = await featchList()
|
|
|
|
|
console.log("more------------------------", more);
|
|
|
|
|
console.log('more------------------------', more)
|
|
|
|
|
listData.value.push(...more)
|
|
|
|
|
layout()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
onUpdated(() => {
|
|
|
|
|
if(startCalTime) {
|
|
|
|
|
endTime = new Date().getTime();
|
|
|
|
|
if(endTime - startTime > 500) {
|
|
|
|
|
if (startCalTime) {
|
|
|
|
|
endTime = new Date().getTime()
|
|
|
|
|
if (endTime - startTime > 500)
|
|
|
|
|
createDom()
|
|
|
|
|
}
|
|
|
|
|
}else {
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
removeDom()
|
|
|
|
|
}
|
|
|
|
|
// if(elwc.value) {
|
|
|
|
|
@ -220,8 +218,8 @@ let selectionBox: HTMLDivElement | null
|
|
|
|
|
const selectIds = ref<string[]>([])
|
|
|
|
|
|
|
|
|
|
function downHandler(event: MouseEvent) {
|
|
|
|
|
startTime = new Date().getTime();
|
|
|
|
|
startCalTime = true;
|
|
|
|
|
startTime = new Date().getTime()
|
|
|
|
|
startCalTime = true
|
|
|
|
|
if (!selectionBox)
|
|
|
|
|
return
|
|
|
|
|
|
|
|
|
|
@ -264,17 +262,14 @@ function imUpdateSelectIds(x: number, y: number, w: number, h: number) {
|
|
|
|
|
// selectedApproveItems.value.splice(tempApproveIndex, 1);
|
|
|
|
|
// }
|
|
|
|
|
})
|
|
|
|
|
selectedApproveItems.value = [];
|
|
|
|
|
selectedApproveItems.value = []
|
|
|
|
|
// 选中复选框
|
|
|
|
|
listData.value.map(item => {
|
|
|
|
|
if(selectIds.value.includes(String(item.pictureId))) {
|
|
|
|
|
item.checked = true;
|
|
|
|
|
selectedApproveItems.value.push(item);
|
|
|
|
|
listData.value.forEach((item) => {
|
|
|
|
|
if (selectIds.value.includes(String(item.pictureId))) {
|
|
|
|
|
item.checked = true
|
|
|
|
|
selectedApproveItems.value.push(item)
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function isSelected(pictureId: number) {
|
|
|
|
|
@ -282,12 +277,12 @@ function isSelected(pictureId: number) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function moveHandler(e: MouseEvent) {
|
|
|
|
|
if(startCalTime) {
|
|
|
|
|
endTime = new Date().getTime();
|
|
|
|
|
if(endTime - startTime > 500) {
|
|
|
|
|
if (startCalTime) {
|
|
|
|
|
endTime = new Date().getTime()
|
|
|
|
|
if (endTime - startTime > 500)
|
|
|
|
|
createDom()
|
|
|
|
|
}
|
|
|
|
|
}else {
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
removeDom()
|
|
|
|
|
}
|
|
|
|
|
if (!selectionBox || !start)
|
|
|
|
|
@ -307,68 +302,66 @@ function moveHandler(e: MouseEvent) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function createDom() {
|
|
|
|
|
let dom = document.createElement('div');
|
|
|
|
|
dom.className = "selection-box";
|
|
|
|
|
dom.style.width = "1px";
|
|
|
|
|
dom.style.border = "1px dotted black";
|
|
|
|
|
dom.style.position = "absolute";
|
|
|
|
|
dom.style.display = "block";
|
|
|
|
|
dom.style.zIndex = '9999';
|
|
|
|
|
document.body.appendChild(dom);
|
|
|
|
|
const dom = document.createElement('div')
|
|
|
|
|
dom.className = 'selection-box'
|
|
|
|
|
dom.style.width = '1px'
|
|
|
|
|
dom.style.border = '1px dotted black'
|
|
|
|
|
dom.style.position = 'absolute'
|
|
|
|
|
dom.style.display = 'block'
|
|
|
|
|
dom.style.zIndex = '9999'
|
|
|
|
|
document.body.appendChild(dom)
|
|
|
|
|
selectionBox = document.querySelector('.selection-box') as HTMLDivElement
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function removeDom() {
|
|
|
|
|
let dom = document.getElementsByClassName("selection-box")[0];
|
|
|
|
|
if(dom) {
|
|
|
|
|
document.body.removeChild(dom);
|
|
|
|
|
}
|
|
|
|
|
const dom = document.getElementsByClassName('selection-box')[0]
|
|
|
|
|
if (dom)
|
|
|
|
|
document.body.removeChild(dom)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function upHandler(event: MouseEvent) {
|
|
|
|
|
endTime = new Date().getTime();
|
|
|
|
|
startCalTime = false;
|
|
|
|
|
if(endTime - startTime > 500) {
|
|
|
|
|
endTime = new Date().getTime()
|
|
|
|
|
startCalTime = false
|
|
|
|
|
if (endTime - startTime > 500)
|
|
|
|
|
createDom()
|
|
|
|
|
}else {
|
|
|
|
|
else
|
|
|
|
|
removeDom()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (!selectionBox)
|
|
|
|
|
return
|
|
|
|
|
return
|
|
|
|
|
selectionBox.style.display = 'none'
|
|
|
|
|
start = null
|
|
|
|
|
if(selectionBox.style.width == "0px") {
|
|
|
|
|
if (selectionBox.style.width == '0px') {
|
|
|
|
|
removeDom()
|
|
|
|
|
if(event.target?.className.indexOf("n-checkbox-box__border") != -1 ) {
|
|
|
|
|
if (event.target?.className.indexOf('n-checkbox-box__border') != -1)
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
selectIds.value = []
|
|
|
|
|
selectedApproveItems.value.forEach((item) => (item.checked = false));
|
|
|
|
|
selectedApproveItems.value.length = 0;
|
|
|
|
|
listData.value.map(item => {
|
|
|
|
|
item.checked = false;
|
|
|
|
|
});
|
|
|
|
|
selectedApproveItems.value.forEach(item => (item.checked = false))
|
|
|
|
|
selectedApproveItems.value.length = 0
|
|
|
|
|
listData.value.forEach((item) => {
|
|
|
|
|
item.checked = false
|
|
|
|
|
})
|
|
|
|
|
// batch.value = false;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const gridHeight = computed(() => {
|
|
|
|
|
// return viewMode.value !== 'masonry' ? '157px' : ''
|
|
|
|
|
let height = "";
|
|
|
|
|
if (viewMode.value === "masonry") {
|
|
|
|
|
height = "";
|
|
|
|
|
} else if (viewMode.value === "horizontalVersion") {
|
|
|
|
|
height = "145px";
|
|
|
|
|
} else if (viewMode.value === "verticalVersion") {
|
|
|
|
|
height = "300px";
|
|
|
|
|
} else if (viewMode.value === "3:4") {
|
|
|
|
|
height = "240px";
|
|
|
|
|
}
|
|
|
|
|
return height;
|
|
|
|
|
let height = ''
|
|
|
|
|
if (viewMode.value === 'masonry')
|
|
|
|
|
height = ''
|
|
|
|
|
else if (viewMode.value === 'horizontalVersion')
|
|
|
|
|
height = '145px'
|
|
|
|
|
else if (viewMode.value === 'verticalVersion')
|
|
|
|
|
height = '300px'
|
|
|
|
|
else if (viewMode.value === '3:4')
|
|
|
|
|
height = '240px'
|
|
|
|
|
|
|
|
|
|
return height
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
function addListeners() {
|
|
|
|
|
|
|
|
|
|
// selectionBox.style['z-index'] = '-1'
|
|
|
|
|
on(el.value!, 'mousedown', downHandler)
|
|
|
|
|
on(el.value!, 'mousemove', moveHandler)
|
|
|
|
|
@ -391,7 +384,7 @@ function afterLeave() {
|
|
|
|
|
removeListeners()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
onMounted(async() => {
|
|
|
|
|
onMounted(async () => {
|
|
|
|
|
show.value && addListeners()
|
|
|
|
|
removeDom()
|
|
|
|
|
})
|
|
|
|
|
@ -406,38 +399,38 @@ async function showModal() {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function onChange() {
|
|
|
|
|
if(timeRange.value == "desc") {
|
|
|
|
|
timeRange.value = "asc";
|
|
|
|
|
}else {
|
|
|
|
|
timeRange.value = "desc";
|
|
|
|
|
}
|
|
|
|
|
if (timeRange.value == 'desc')
|
|
|
|
|
timeRange.value = 'asc'
|
|
|
|
|
else
|
|
|
|
|
timeRange.value = 'desc'
|
|
|
|
|
|
|
|
|
|
sortObj = {
|
|
|
|
|
// orderbyname: val,
|
|
|
|
|
orderByUptime: timeRange.value
|
|
|
|
|
orderByUptime: timeRange.value,
|
|
|
|
|
}
|
|
|
|
|
pagination.pageNo = 1;
|
|
|
|
|
canloadMore = true;
|
|
|
|
|
pagination.pageNo = 1
|
|
|
|
|
canloadMore = true
|
|
|
|
|
const list = await featchList()
|
|
|
|
|
listData.value = list
|
|
|
|
|
isTop.value = true;
|
|
|
|
|
isTop.value = true
|
|
|
|
|
layout()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function onChangeView() {
|
|
|
|
|
if(similarRange.value == "desc") {
|
|
|
|
|
similarRange.value = "asc";
|
|
|
|
|
}else {
|
|
|
|
|
similarRange.value = "desc";
|
|
|
|
|
}
|
|
|
|
|
if (similarRange.value == 'desc')
|
|
|
|
|
similarRange.value = 'asc'
|
|
|
|
|
else
|
|
|
|
|
similarRange.value = 'desc'
|
|
|
|
|
|
|
|
|
|
sortObj = {
|
|
|
|
|
// orderbyname: val,
|
|
|
|
|
orderBySimilarity: similarRange.value
|
|
|
|
|
orderBySimilarity: similarRange.value,
|
|
|
|
|
}
|
|
|
|
|
pagination.pageNo = 1;
|
|
|
|
|
canloadMore = true;
|
|
|
|
|
pagination.pageNo = 1
|
|
|
|
|
canloadMore = true
|
|
|
|
|
const list = await featchList()
|
|
|
|
|
listData.value = list
|
|
|
|
|
isTop.value = true;
|
|
|
|
|
isTop.value = true
|
|
|
|
|
layout()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -454,6 +447,7 @@ async function commit() {
|
|
|
|
|
const list = await featchList()
|
|
|
|
|
listData.value = list
|
|
|
|
|
layout()
|
|
|
|
|
setBatch(false)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
function remove() {
|
|
|
|
|
@ -465,17 +459,16 @@ function remove() {
|
|
|
|
|
confrimModalRef?.value?.showModal()
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function setBatch(value) {
|
|
|
|
|
if (value && batch.value) {
|
|
|
|
|
batch.value = !value;
|
|
|
|
|
} else {
|
|
|
|
|
batch.value = value;
|
|
|
|
|
}
|
|
|
|
|
if (value && batch.value)
|
|
|
|
|
batch.value = !value
|
|
|
|
|
else
|
|
|
|
|
batch.value = value
|
|
|
|
|
|
|
|
|
|
if (value === false) {
|
|
|
|
|
selectIds.value = []
|
|
|
|
|
selectedApproveItems.value.forEach((item) => (item.checked = false));
|
|
|
|
|
selectedApproveItems.value.length = 0;
|
|
|
|
|
selectedApproveItems.value.forEach(item => (item.checked = false))
|
|
|
|
|
selectedApproveItems.value.length = 0
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@ -485,26 +478,24 @@ defineExpose({
|
|
|
|
|
|
|
|
|
|
const notPassModalRef = ref(null)
|
|
|
|
|
const showActions = computed(() => {
|
|
|
|
|
return selectedApproveItems.value.length > 0 && batch;
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
return selectedApproveItems.value.length > 0 && batch
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
function onCheckChange(checked: any, item: any) {
|
|
|
|
|
|
|
|
|
|
item.checked = checked
|
|
|
|
|
const index = selectedApproveItems.value.indexOf(item);
|
|
|
|
|
const picIndex = selectIds.value.indexOf(item.pictureId);
|
|
|
|
|
const index = selectedApproveItems.value.indexOf(item)
|
|
|
|
|
const picIndex = selectIds.value.indexOf(item.pictureId)
|
|
|
|
|
|
|
|
|
|
if (index === -1 && checked) {
|
|
|
|
|
if (index === -1 && checked)
|
|
|
|
|
selectedApproveItems.value.push(item)
|
|
|
|
|
} else {
|
|
|
|
|
selectedApproveItems.value.splice(index, 1);
|
|
|
|
|
}
|
|
|
|
|
if (picIndex === -1 && checked) {
|
|
|
|
|
selectIds.value.push(item.pictureId);
|
|
|
|
|
} else {
|
|
|
|
|
selectIds.value.splice(picIndex, 1);
|
|
|
|
|
}
|
|
|
|
|
else
|
|
|
|
|
selectedApproveItems.value.splice(index, 1)
|
|
|
|
|
|
|
|
|
|
if (picIndex === -1 && checked)
|
|
|
|
|
selectIds.value.push(item.pictureId)
|
|
|
|
|
else
|
|
|
|
|
selectIds.value.splice(picIndex, 1)
|
|
|
|
|
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
nextTick(() => {
|
|
|
|
|
batch.value = true
|
|
|
|
|
@ -518,28 +509,29 @@ function rejectHandler() {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function reset() {
|
|
|
|
|
batch.value = false;
|
|
|
|
|
batch.value = false
|
|
|
|
|
// pagination.pageNo = 1;
|
|
|
|
|
pagination.pageNo = 1;
|
|
|
|
|
pagination.pageSize = 20;
|
|
|
|
|
selectIds.value = [];
|
|
|
|
|
selectedApproveItems.value.length = 0;
|
|
|
|
|
loading = false;
|
|
|
|
|
canloadMore = true;
|
|
|
|
|
layout();
|
|
|
|
|
pagination.pageNo = 1
|
|
|
|
|
pagination.pageSize = 20
|
|
|
|
|
selectIds.value = []
|
|
|
|
|
selectedApproveItems.value.length = 0
|
|
|
|
|
loading = false
|
|
|
|
|
canloadMore = true
|
|
|
|
|
layout()
|
|
|
|
|
}
|
|
|
|
|
function validate(items: any[]) {
|
|
|
|
|
if (items.length === 0) return "至少选中一个任务";
|
|
|
|
|
return null;
|
|
|
|
|
if (items.length === 0)
|
|
|
|
|
return '至少选中一个任务'
|
|
|
|
|
return null
|
|
|
|
|
}
|
|
|
|
|
function approvalHandler(items?: any) {
|
|
|
|
|
// if (batch.value) {
|
|
|
|
|
processItems = selectedApproveItems.value
|
|
|
|
|
processItems = selectedApproveItems.value
|
|
|
|
|
// }
|
|
|
|
|
// 任务包图片 => 点击 => 通过/不通过按钮
|
|
|
|
|
if (items !== undefined && !(items instanceof PointerEvent))
|
|
|
|
|
processItems = [items]
|
|
|
|
|
console.log("batch-------------",batch.value,selectedApproveItems.value,processItems);
|
|
|
|
|
console.log('batch-------------', batch.value, selectedApproveItems.value, processItems)
|
|
|
|
|
const msg = validate(processItems)
|
|
|
|
|
|
|
|
|
|
if (msg !== null) {
|
|
|
|
|
@ -586,9 +578,8 @@ function doAudit(param: any) {
|
|
|
|
|
message.info(res.message)
|
|
|
|
|
// emitter.emit('refresh')
|
|
|
|
|
refreshHandler()
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
else message.error(res.message)
|
|
|
|
|
else { message.error(res.message) }
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
function reloadList() {
|
|
|
|
|
@ -597,11 +588,11 @@ function reloadList() {
|
|
|
|
|
async function refreshHandler(filtersearchId?: any) {
|
|
|
|
|
// 注释 rao start
|
|
|
|
|
reset()
|
|
|
|
|
pagination.pageNo = 1;
|
|
|
|
|
pagination.pageNo = 1
|
|
|
|
|
const list = await featchList()
|
|
|
|
|
listData.value = list
|
|
|
|
|
layout()
|
|
|
|
|
// 注释 rao end
|
|
|
|
|
// 注释 rao end
|
|
|
|
|
// reset();
|
|
|
|
|
|
|
|
|
|
// if (filtersearchId) {
|
|
|
|
|
@ -613,53 +604,51 @@ async function refreshHandler(filtersearchId?: any) {
|
|
|
|
|
useInfiniteScroll(
|
|
|
|
|
el as any,
|
|
|
|
|
() => {
|
|
|
|
|
console.log("加载了333333333333333333333333---------------------------");
|
|
|
|
|
loadMore();
|
|
|
|
|
console.log('加载了333333333333333333333333---------------------------')
|
|
|
|
|
loadMore()
|
|
|
|
|
},
|
|
|
|
|
{ distance: 10, canLoadMore: () => canloadMore }
|
|
|
|
|
);
|
|
|
|
|
}, 300);
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
watch(() => show.value,
|
|
|
|
|
async(newVal) => {
|
|
|
|
|
if(show.value) {
|
|
|
|
|
pagination.pageNo = 1;
|
|
|
|
|
const list = await featchList()
|
|
|
|
|
listData.value = list
|
|
|
|
|
console.log("加载了1111111111111---------------------------", listData.value);
|
|
|
|
|
layout()
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
)
|
|
|
|
|
{ distance: 10, canLoadMore: () => canloadMore },
|
|
|
|
|
)
|
|
|
|
|
}, 300)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
watch(() => show.value, async (newVal) => {
|
|
|
|
|
if (show.value) {
|
|
|
|
|
pagination.pageNo = 1
|
|
|
|
|
const list = await featchList()
|
|
|
|
|
listData.value = list
|
|
|
|
|
console.log('加载了1111111111111---------------------------', listData.value)
|
|
|
|
|
layout()
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
watch(() => pagination.pageNo,
|
|
|
|
|
(newVal, oldVal) => {
|
|
|
|
|
console.log("加载了22222222222222222---------------------------", newVal, oldVal, canloadMore);
|
|
|
|
|
if(newVal == oldVal) {
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if((newVal == 1 || newVal == 2) && canloadMore) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
nextTick(() => {
|
|
|
|
|
loading = false
|
|
|
|
|
loadMore();
|
|
|
|
|
})
|
|
|
|
|
}, 500)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
);
|
|
|
|
|
watch(() => pagination.pageNo, (newVal, oldVal) => {
|
|
|
|
|
console.log('加载了22222222222222222---------------------------', newVal, oldVal, canloadMore)
|
|
|
|
|
if (newVal == oldVal)
|
|
|
|
|
return
|
|
|
|
|
|
|
|
|
|
if ((newVal == 1 || newVal == 2) && canloadMore) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
nextTick(() => {
|
|
|
|
|
loading = false
|
|
|
|
|
loadMore()
|
|
|
|
|
})
|
|
|
|
|
}, 500)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<n-modal v-model:show="show" :mask-closable="false" style="position: relative;" transform-origin="center"
|
|
|
|
|
@after-enter="afterEnter" @after-leave="afterLeave">
|
|
|
|
|
<n-card ref="elwc" :style="cardStyle" class="card card-1" style="position: fixed;top:64px" :bordered="false" size="huge"
|
|
|
|
|
role="dialog" aria-modal="true">
|
|
|
|
|
<n-modal
|
|
|
|
|
v-model:show="show" :mask-closable="false" style="position: relative;" transform-origin="center"
|
|
|
|
|
@after-enter="afterEnter" @after-leave="afterLeave"
|
|
|
|
|
>
|
|
|
|
|
<n-card
|
|
|
|
|
ref="elwc" :style="cardStyle" class="card card-1" style="position: fixed;top:64px" :bordered="false" size="huge"
|
|
|
|
|
role="dialog" aria-modal="true"
|
|
|
|
|
>
|
|
|
|
|
<div class="wrapper">
|
|
|
|
|
<div class="wrapper-m32">
|
|
|
|
|
<SvgIcon name="recycle" size="16" />
|
|
|
|
|
@ -709,7 +698,7 @@ watch(() => pagination.pageNo,
|
|
|
|
|
<div class="remove" @click="remove">
|
|
|
|
|
移除可疑文件夹
|
|
|
|
|
</div>
|
|
|
|
|
<div class="wrapper-content-form-button" @click="setBatch(true)" v-show="!showActions">
|
|
|
|
|
<div v-show="!showActions" class="wrapper-content-form-button" @click="setBatch(true)">
|
|
|
|
|
<SvgIcon style="margin-right: 6px;" size="14" name="tf" />
|
|
|
|
|
批量审批
|
|
|
|
|
</div>
|
|
|
|
|
@ -731,32 +720,38 @@ watch(() => pagination.pageNo,
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div ref="el" class="scroll" :style="{height: maxHeight}">
|
|
|
|
|
<div ref="el" class="scroll" :style="{ height: maxHeight }">
|
|
|
|
|
<!-- <n-scrollbar :on-scroll="scrollHandler"> -->
|
|
|
|
|
<div ref="masonryRef" class="grid">
|
|
|
|
|
<div v-for="(item, index) in listData" :key="item.pictureId" :data-id="item.pictureId"
|
|
|
|
|
<div
|
|
|
|
|
v-for="(item) in listData" :key="item.pictureId" :data-id="item.pictureId"
|
|
|
|
|
:class="{ 'grid-item-selected': isSelected(item.pictureId) }" :style="{ height: gridHeight }"
|
|
|
|
|
class="grid-item">
|
|
|
|
|
class="grid-item"
|
|
|
|
|
>
|
|
|
|
|
<n-image
|
|
|
|
|
ref="imageRef"
|
|
|
|
|
:src="item.imgUrl"
|
|
|
|
|
:preview-src="item.imgUrl"
|
|
|
|
|
class="img "
|
|
|
|
|
:class="{
|
|
|
|
|
'img-fit': viewMode === 'horizontalVersion',
|
|
|
|
|
'img-full': viewMode === '3:4' || viewMode === 'verticalVersion' }"
|
|
|
|
|
/>
|
|
|
|
|
<n-checkbox v-if="batch && item.historyStates === 1" v-model:checked="item.checked"
|
|
|
|
|
ref="imageRef"
|
|
|
|
|
:src="item.imgUrl"
|
|
|
|
|
:preview-src="item.imgUrl"
|
|
|
|
|
class="img "
|
|
|
|
|
:class="{
|
|
|
|
|
'img-fit': viewMode === 'horizontalVersion',
|
|
|
|
|
'img-full': viewMode === '3:4' || viewMode === 'verticalVersion' }"
|
|
|
|
|
/>
|
|
|
|
|
<n-checkbox
|
|
|
|
|
v-if="batch && item.historyStates === 1" v-model:checked="item.checked"
|
|
|
|
|
style="position:absolute;left:20px;top:20px" @click.prevent.stop
|
|
|
|
|
@update:checked="onCheckChange($event, item)" />
|
|
|
|
|
@update:checked="onCheckChange($event, item)"
|
|
|
|
|
/>
|
|
|
|
|
<img v-if="item.historyStates === 2" class="tag-status" src="@/assets/images/task/tag-pass.png" alt="">
|
|
|
|
|
<img v-if="item.historyStates === 3" class="tag-status" src="@/assets/images/task/tag-not-pass.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img
|
|
|
|
|
v-if="item.historyStates === 3" class="tag-status" src="@/assets/images/task/tag-not-pass.png"
|
|
|
|
|
alt=""
|
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
<div :class="{ 'percent-red': item.similarityScore === 100 }" class="percent">
|
|
|
|
|
{{ item.similarityScore }}<span class="percent-unit">%</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="time" >
|
|
|
|
|
<div class="time">
|
|
|
|
|
<!-- <div class="time-item">
|
|
|
|
|
<SvgIcon class="svg-time" color="#FFF" size="16" name="camera-time" />
|
|
|
|
|
<span>{{ item?.photoDateTimestamp ?
|
|
|
|
|
@ -769,13 +764,13 @@ watch(() => pagination.pageNo,
|
|
|
|
|
</div> -->
|
|
|
|
|
<div class="time-item" style="margin-bottom: 4px;">
|
|
|
|
|
<SvgIcon color="#FFF" size="16" name="camera" style="margin-right: 4px;" />
|
|
|
|
|
<span class="time-value">{{ item?.photoDateTimestamp ?
|
|
|
|
|
formatToDateHMS(Number(item.photoDateTimestamp)) : '-' }} </span>
|
|
|
|
|
<span class="time-value">{{ item?.photoDateTimestamp
|
|
|
|
|
? formatToDateHMS(Number(item.photoDateTimestamp)) : '-' }} </span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="time-item">
|
|
|
|
|
<SvgIcon class="svg-time" color="#FFF" size="16" name="time" />
|
|
|
|
|
<span>{{ item.submitDateTimestamp ?
|
|
|
|
|
formatToDateHMS(Number(item.submitDateTimestamp)) : '-' }}</span>
|
|
|
|
|
<span>{{ item.submitDateTimestamp
|
|
|
|
|
? formatToDateHMS(Number(item.submitDateTimestamp)) : '-' }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -791,8 +786,7 @@ watch(() => pagination.pageNo,
|
|
|
|
|
</n-card>
|
|
|
|
|
</n-modal>
|
|
|
|
|
<NotPassed ref="notPassModalRef" @success="reloadList" />
|
|
|
|
|
<ConfrimModal ref="confrimModalRef" @commit="commit" :selectedTotal="selectIds.length" />
|
|
|
|
|
|
|
|
|
|
<ConfrimModal ref="confrimModalRef" :selected-total="selectIds.length" @commit="commit" />
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
@ -977,7 +971,6 @@ watch(() => pagination.pageNo,
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.scroll {
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
// height: calc(100vh - 282px);
|
|
|
|
|
@ -1005,4 +998,5 @@ watch(() => pagination.pageNo,
|
|
|
|
|
height: 100%;
|
|
|
|
|
object-fit: cover;
|
|
|
|
|
}
|
|
|
|
|
}</style>
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
