|
|
|
|
@ -115,20 +115,21 @@ const layout = debounce(() => {
|
|
|
|
|
percentPosition: true,
|
|
|
|
|
stagger: 10,
|
|
|
|
|
})
|
|
|
|
|
loading.value = false
|
|
|
|
|
// 暂时注释，请忽略
|
|
|
|
|
// _imagesload = imagesloaded('.grid-item')
|
|
|
|
|
|
|
|
|
|
// _imagesload.on('done', (instance) => {
|
|
|
|
|
// (_masonry as any).layout()
|
|
|
|
|
// if (!el.value)
|
|
|
|
|
// return
|
|
|
|
|
// loading.value = false
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
_imagesload = imagesloaded('.grid-item')
|
|
|
|
|
|
|
|
|
|
_imagesload.on('done', (instance) => {
|
|
|
|
|
(_masonry as any).layout()
|
|
|
|
|
if (!el.value)
|
|
|
|
|
return
|
|
|
|
|
loading.value = false
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
_imagesload.on('fail', (instance) => {
|
|
|
|
|
message.error('图片错误')
|
|
|
|
|
loading.value = false
|
|
|
|
|
})
|
|
|
|
|
// _imagesload.on('fail', (instance) => {
|
|
|
|
|
// message.error('图片错误')
|
|
|
|
|
// loading.value = false
|
|
|
|
|
// })
|
|
|
|
|
}, 300)
|
|
|
|
|
|
|
|
|
|
useInfiniteScroll(
|
|
|
|
|
@ -250,7 +251,7 @@ async function featchList(userSearchId?: string) {
|
|
|
|
|
const list = data.map((item) => {
|
|
|
|
|
return {
|
|
|
|
|
imgUrl: item.imgurl,
|
|
|
|
|
thumburl: item.serverThumbnailUrl || item.imgurl || '',
|
|
|
|
|
thumburl: item.serverThumbnailUrl || item.imgurl || bgLoadingImg,
|
|
|
|
|
upname: item.upname,
|
|
|
|
|
ocrPictureclass: item.ocrPictureclass,
|
|
|
|
|
uphead: item.uphead,
|
|
|
|
|
@ -295,6 +296,16 @@ const gridHeight = computed(() => {
|
|
|
|
|
return height
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
const gridMinHeight = computed(() => {
|
|
|
|
|
let height = ''
|
|
|
|
|
if (viewMode.value === 'masonry' && loading.value)
|
|
|
|
|
height = '145px'
|
|
|
|
|
else
|
|
|
|
|
height = ''
|
|
|
|
|
|
|
|
|
|
return height
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
async function oneCheck() {
|
|
|
|
|
const asideVal = cloneDeep(configStore.getAsideValue)
|
|
|
|
|
asideVal.upUserName = searchValue.value
|
|
|
|
|
@ -699,7 +710,7 @@ defineExpose({
|
|
|
|
|
<div
|
|
|
|
|
v-for="(item, index) in listData"
|
|
|
|
|
:key="index"
|
|
|
|
|
:style="{ height: gridHeight }"
|
|
|
|
|
:style="{ height: gridHeight, minHeight: gridMinHeight }"
|
|
|
|
|
class="grid-item"
|
|
|
|
|
>
|
|
|
|
|
<!-- <div :style="{ 'background-color': randomColor(0.2) }" class="wrapper-content-item-img" /> -->
|
|
|
|
|
@ -724,17 +735,27 @@ defineExpose({
|
|
|
|
|
:preview-src="item.imgUrl"
|
|
|
|
|
:src="item.thumburl"
|
|
|
|
|
:fallback-src="bgLoadingImg"
|
|
|
|
|
style="display: none"
|
|
|
|
|
/>
|
|
|
|
|
<img @click="
|
|
|
|
|
($event) => {
|
|
|
|
|
previewHandler(index, $event);
|
|
|
|
|
hideDownload($event);
|
|
|
|
|
}
|
|
|
|
|
" v-lazy="item.thumburl" class="img" :class="{
|
|
|
|
|
'img-fit': viewMode === 'horizontalVersion',
|
|
|
|
|
'img-full': viewMode === '3:4' || viewMode === 'verticalVersion',
|
|
|
|
|
}" alt="">
|
|
|
|
|
<img
|
|
|
|
|
v-if="item.states == 3"
|
|
|
|
|
class="tag-status"
|
|
|
|
|
src="@/assets/images/task/tag-pass.png"
|
|
|
|
|
src="@/assets/images/pass.png"
|
|
|
|
|
alt=""
|
|
|
|
|
>
|
|
|
|
|
<img
|
|
|
|
|
v-if="item.states == 5"
|
|
|
|
|
class="tag-status"
|
|
|
|
|
src="@/assets/images/task/tag-not-pass.png"
|
|
|
|
|
src="@/assets/images/not-pass.png"
|
|
|
|
|
alt=""
|
|
|
|
|
>
|
|
|
|
|
<!-- @load="loadImgOver(item)" -->
|
|
|
|
|
@ -941,7 +962,7 @@ defineExpose({
|
|
|
|
|
width: 182px;
|
|
|
|
|
border-radius: 7px;
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
overflow-x: visible;
|
|
|
|
|
position: relative;
|
|
|
|
|
transition: 0.5s;
|
|
|
|
|
margin: 0 6px 10px 6px;
|
|
|
|
|
@ -950,7 +971,7 @@ defineExpose({
|
|
|
|
|
width: 46px;
|
|
|
|
|
height: 22px;
|
|
|
|
|
position: absolute;
|
|
|
|
|
left: -1px;
|
|
|
|
|
left: -3px;
|
|
|
|
|
top: 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
