Merge pull request 'feat: 修改问题' (#297) from fix/updatesyspic into test

Reviewed-on: #297
pull/300/head^2
yaoshuli 1 year ago
commit f635040995

@ -213,17 +213,18 @@ async function loadMore() {
const more = await featchList() const more = await featchList()
more.forEach((item) => { more.forEach((item) => {
item.calHeight = 182 * item.high / item.wide item.calHeight = 182 * item.high / item.wide
item.thumburl = item.serverThumbnailUrl || item.imgUrl
}) })
if (pagination.pageNo <= 1) { if (pagination.pageNo <= 1) {
listData.value = [] listData.value = []
listData.value = listData.value.concat(more) listData.value = listData.value.concat(more)
console.log('listData.value出来了11111111111111', listData.value, pagination.pageNo) console.log('listData.value可疑文件夹出来了11111111111111', listData.value, pagination.pageNo)
if (pagination.pageNo <= 1) if (pagination.pageNo <= 1)
waterfallRef.value?.resize() waterfallRef.value?.resize()
} }
else { else {
listData.value = listData.value.concat(more) listData.value = listData.value.concat(more)
console.log('listData.value出来了2222222222', listData.value, pagination.pageNo) console.log('listData.value可疑文件夹出来了2222222222', listData.value, pagination.pageNo)
// waterfallRef.value?.mix() // waterfallRef.value?.mix()
updateHtml() updateHtml()
} }
@ -680,7 +681,7 @@ onBeforeMount(async () => {
else if (screenWidth < 1792 && screenWidth > 1440) else if (screenWidth < 1792 && screenWidth > 1440)
cols.value = 7 cols.value = 7
else if (screenWidth <= 1440) else if (screenWidth <= 1440)
cols.value = 6 cols.value = 5
}) })
function previewHandler(index: number, event: MouseEvent, thumburl, imgUrl) { function previewHandler(index: number, event: MouseEvent, thumburl, imgUrl) {
@ -784,7 +785,7 @@ watch(() => show.value, async (newVal) => {
> >
<img <img
:key="item.pictureId" :key="item.pictureId"
v-lazy="item.imgUrl" v-lazy="item.thumburl"
:class="{ :class="{
'img-fit': viewMode === 'horizontalVersion', 'img-fit': viewMode === 'horizontalVersion',
'img-full': viewMode === '3:4' || viewMode === 'verticalVersion', 'img-full': viewMode === '3:4' || viewMode === 'verticalVersion',
@ -845,7 +846,7 @@ watch(() => show.value, async (newVal) => {
> >
<img <img
:key="item.pictureId" :key="item.pictureId"
v-lazy="item.imgUrl" v-lazy="item.thumburl"
:class="{ :class="{
'img-fit': viewMode === 'horizontalVersion', 'img-fit': viewMode === 'horizontalVersion',
'img-full': viewMode === '3:4' || viewMode === 'verticalVersion', 'img-full': viewMode === '3:4' || viewMode === 'verticalVersion',
@ -1075,7 +1076,7 @@ watch(() => show.value, async (newVal) => {
border-radius: 6px 0px 6px 0px; border-radius: 6px 0px 6px 0px;
z-index: 5; z-index: 5;
right: 16px; right: 16px;
top: 6px; top: 12px;
color: #fff; color: #fff;
font-size: 14px; font-size: 14px;

@ -6,7 +6,7 @@ import { useInfiniteScroll } from '@vueuse/core'
import dayjs from 'dayjs' import dayjs from 'dayjs'
// import imagesloaded from 'imagesloaded' // import imagesloaded from 'imagesloaded'
import { cloneDeep } from 'lodash-es' import { cloneDeep, debounce } from 'lodash-es'
// import Masonry from 'masonry-layout' // import Masonry from 'masonry-layout'
import { NIcon, useMessage } from 'naive-ui' import { NIcon, useMessage } from 'naive-ui'
@ -226,10 +226,15 @@ watch(() => collapse.value, (newVal, oldVal) => {
} }
}) })
const asideLoadMore = debounce(() => {
// console.log("--------------------");
loadMore()
}, 200)
watch( watch(
() => searchValue.value, () => searchValue.value,
async (newVal, oldVal) => { async (newVal, oldVal) => {
// console.log('', newVal, oldVal) // console.log('', newVal, oldVal)
if (newVal) { if (newVal) {
isInitSeaerch.value = true isInitSeaerch.value = true
// pagination.pageNo = 0 // pagination.pageNo = 0
@ -238,29 +243,30 @@ watch(
// isInitSeaerch.value = false // isInitSeaerch.value = false
// // configStore.setSearchValue(""); // // configStore.setSearchValue("");
reset() reset()
loadMore() // loadMore()
asideLoadMore()
isInitSeaerch.value = false isInitSeaerch.value = false
} }
else { // else {
isInitSeaerch.value = true // isInitSeaerch.value = true
// pagination.pageNo = 0 // // pagination.pageNo = 0
// const more = await featchList() // // const more = await featchList()
// listData.value = more // // listData.value = more
// // isInitSeaerch.value = false
// reset()
// loadMore()
// isInitSeaerch.value = false // isInitSeaerch.value = false
reset() // }
loadMore()
isInitSeaerch.value = false
}
}, },
) )
watch( watch(
() => configStore.getAsideValue, () => configStore.getAsideValue,
async (newVal, oldVal) => { async (newVal, oldVal) => {
// console.log('configStore.getAsideValue', configStore.getAsideValue, pagination.pageNo) // console.log('configStore.getAsideValue', newVal, oldVal, Object.entries(newVal).toString() === Object.entries(oldVal).toString(), pagination.pageNo)
if (pagination.pageNo > 1 && newVal && !(Object.entries(newVal).toString() === Object.entries(oldVal).toString())) { if (pagination.pageNo > 1 && newVal && !(Object.entries(newVal).toString() === Object.entries(oldVal).toString())) {
reset() reset()
loadMore() asideLoadMore()
} }
}, },
) )
@ -579,7 +585,9 @@ async function refreshHandler(filtersearchId?: any) {
if (filtersearchId) if (filtersearchId)
filterId = filtersearchId filterId = filtersearchId
loadMore() // console.log("");
// loadMore()
asideLoadMore()
// nextTick(() => { // nextTick(() => {
// setTimeout(() => { // setTimeout(() => {
// useInfiniteScroll( // useInfiniteScroll(
@ -1082,6 +1090,10 @@ defineExpose({
margin-right: 16px; margin-right: 16px;
width: 100%; width: 100%;
::v-deep(.vue-waterfall) {
padding-top: 2px;
}
&-header { &-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

Loading…
Cancel
Save