flx:优化进度计划轮播滚动
This commit is contained in:
parent
2cbfc1b5c7
commit
28fb52e1ba
@ -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);
|
||||
|
||||
@ -45,7 +45,7 @@ const showDownFn = () => {
|
||||
|
||||
watch(() => store.schedulePlanFlag, (newVal) => {
|
||||
if(newVal) {
|
||||
showDown.value = !showDown.value;
|
||||
showDown.value = false;
|
||||
}
|
||||
}, { immediate: true, deep: true });
|
||||
</script>
|
||||
|
||||
@ -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);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user