flx:优化进度计划轮播滚动

This commit is contained in:
Rain_ 2025-04-08 11:30:10 +08:00
parent 2cbfc1b5c7
commit 28fb52e1ba
3 changed files with 20 additions and 10 deletions

View File

@ -64,6 +64,7 @@
myTbody2: milestoneList.length == 0 && !props.showDwon
}"
v-infinite-scroll="load"
:infinite-scroll-distance="1"
:infinite-scroll-immediate="false"
>
<template v-for="(cur, index) in splitData">
@ -174,6 +175,8 @@ dayjs.extend(isBetween);
const load = () => {
console.log(userInfo.pageSize, userInfo.pageNo, projectChildList.value.length);
if (userInfo.pageSize * userInfo.pageNo >= projectChildList.value.length) {
console.log("我触发了3", store.schedulePlanFlag);
if(store.schedulePlanFlag) {
gasanalysisInfo.setIntervalScrollLeft = 0;
setIntervalTimeFn();
@ -311,6 +314,7 @@ watch(
onUpdated(() => {
console.log("更新");
cancelAnimationFrame(gasanalysisInfo.setIntervalTime2);
cancelAnimationFrame(gasanalysisInfo.setIntervalTime);
gasanalysisInfo.setIntervalScrollLeft = 0;
setIntervalTimeFn();
@ -328,14 +332,14 @@ const gasanalysisInfo = reactive({
})
//
const handleMouseEnter = () => {
if(!store.schedulePlanFlag || gasanalysisInfo.setIntervalTime2) return;
if(!store.schedulePlanFlag) return;
if(gasanalysisInfo.setIntervalTime) {
cancelAnimationFrame(gasanalysisInfo.setIntervalTime)
}
}
//
const handleMouseLeave = () => {
if(!store.schedulePlanFlag || gasanalysisInfo.setIntervalTime2) return;
if(!store.schedulePlanFlag) return;
const gasanalysisTable1 = document.querySelector(".gasanalysis-table1") as any;
gasanalysisInfo.setIntervalScrollLeft = gasanalysisTable1.scrollLeft;
// console.log("", gasanalysisInfo.setIntervalScrollLeft);
@ -344,14 +348,16 @@ const handleMouseLeave = () => {
const setIntervalTimeFn = () => {
// console.log("");
cancelAnimationFrame(gasanalysisInfo.setIntervalTime);
const gasanalysisTable1 = document.querySelector(".gasanalysis-table1") as any;
gasanalysisInfo.setIntervalScrollLeft = gasanalysisInfo.setIntervalScrollLeft + 1;
// console.log(gasanalysisTable1.scrollLeft + gasanalysisTable1.clientWidth, gasanalysisTable1.scrollWidth, gasanalysisInfo.setIntervalScrollLeft);
if(gasanalysisTable1.scrollLeft + gasanalysisTable1.clientWidth >= gasanalysisTable1.scrollWidth) {
gasanalysisInfo.setIntervalScrollLeft = gasanalysisInfo.setIntervalScrollLeft + 0.1;
console.log(gasanalysisTable1.scrollLeft + gasanalysisTable1.clientWidth, gasanalysisTable1.scrollWidth, gasanalysisInfo.setIntervalScrollLeft);
if(Math.ceil(gasanalysisTable1.scrollLeft + gasanalysisTable1.clientWidth) >= gasanalysisTable1.scrollWidth) {
cancelAnimationFrame(gasanalysisInfo.setIntervalTime);
gasanalysisTable1.scrollLeft = 0;
gasanalysisInfo.setIntervalScrollLeft = 0;
if(userInfo.scheduleSwitchFlag) {
userInfo.pageSize = 10;
emits("scheduleSwitchChange", true);
return
}
@ -369,7 +375,7 @@ const setIntervalTimeFn2 = () => {
const tbodyTable = document.querySelector("#tbody_table") as any;
gasanalysisInfo.setIntervalScrollTop = gasanalysisInfo.setIntervalScrollTop + 1;
// console.log(tbodyTable.scrollTop + tbodyTable.clientHeight, tbodyTable.scrollHeight, gasanalysisInfo.setIntervalScrollTop);
if(tbodyTable.scrollTop + tbodyTable.clientHeight >= tbodyTable.scrollHeight) {
if(Math.ceil(tbodyTable.scrollTop + tbodyTable.clientHeight) >= tbodyTable.scrollHeight) {
// tbodyTable.scrollTop = 0;
// gasanalysisInfo.setIntervalScrollTop = 0;
cancelAnimationFrame(gasanalysisInfo.setIntervalTime2);

View File

@ -45,7 +45,7 @@ const showDownFn = () => {
watch(() => store.schedulePlanFlag, (newVal) => {
if(newVal) {
showDown.value = !showDown.value;
showDown.value = false;
}
}, { immediate: true, deep: true });
</script>

View File

@ -178,7 +178,10 @@ const onImgData = (data: any) => {
pageInfo.imageUrl = BASEURL + "/image/" + res.data[0].imageUrl;
store.setShedulePlanImage(pageInfo.imageUrl, searchForm.projectType);
if(schedulePlanFlag.value) {
showDomIsImage();
setTimeout(() => {
// showDomIsImage();
pageInfo.domIsImage = false;
}, 30000)
}
} else {
ElMessage.error("转换失败!");
@ -453,8 +456,9 @@ onMounted(async () => {
if(schedulePlanFlag.value && pageInfo.imageUrl) {
console.log("我进来了11");
setTimeout(() => {
showDomIsImage();
}, 2000)
// showDomIsImage();
pageInfo.domIsImage = false;
}, 30000)
}
pageInfo.isLoadingAll = res.every((item) => item === true);
console.log("我是共同执行的",res, pageInfo.isLoadingAll);