refactor: ♻️ 移除无用工具类
This commit is contained in:
@@ -14,9 +14,6 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { PropType } from "vue";
|
|
||||||
import { scrollTo } from "@/utils/scroll-to";
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
total: {
|
total: {
|
||||||
required: true,
|
required: true,
|
||||||
@@ -63,17 +60,11 @@ const pageSize = useVModel(props, "limit", emit);
|
|||||||
|
|
||||||
function handleSizeChange(val: number) {
|
function handleSizeChange(val: number) {
|
||||||
emit("pagination", { page: currentPage, limit: val });
|
emit("pagination", { page: currentPage, limit: val });
|
||||||
if (props.autoScroll) {
|
|
||||||
scrollTo(0, 800);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleCurrentChange(val: number) {
|
function handleCurrentChange(val: number) {
|
||||||
currentPage.value = val;
|
currentPage.value = val;
|
||||||
emit("pagination", { page: val, limit: props.limit });
|
emit("pagination", { page: val, limit: props.limit });
|
||||||
if (props.autoScroll) {
|
|
||||||
scrollTo(0, 800);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -1,69 +0,0 @@
|
|||||||
const easeInOutQuad = (t: number, b: number, c: number, d: number) => {
|
|
||||||
t /= d / 2;
|
|
||||||
if (t < 1) {
|
|
||||||
return (c / 2) * t * t + b;
|
|
||||||
}
|
|
||||||
t--;
|
|
||||||
return (-c / 2) * (t * (t - 2) - 1) + b;
|
|
||||||
};
|
|
||||||
|
|
||||||
// requestAnimationFrame for Smart Animating http://goo.gl/sx5sts
|
|
||||||
const requestAnimFrame = (function () {
|
|
||||||
return (
|
|
||||||
window.requestAnimationFrame ||
|
|
||||||
(window as any).webkitRequestAnimationFrame ||
|
|
||||||
(window as any).mozRequestAnimationFrame ||
|
|
||||||
function (callback) {
|
|
||||||
window.setTimeout(callback, 1000 / 60);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
})();
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Because it's so fucking difficult to detect the scrolling element, just move them all
|
|
||||||
* @param {number} amount
|
|
||||||
*/
|
|
||||||
const move = (amount: number) => {
|
|
||||||
document.documentElement.scrollTop = amount;
|
|
||||||
(document.body.parentNode as HTMLElement).scrollTop = amount;
|
|
||||||
document.body.scrollTop = amount;
|
|
||||||
};
|
|
||||||
|
|
||||||
const position = () => {
|
|
||||||
return (
|
|
||||||
document.documentElement.scrollTop ||
|
|
||||||
(document.body.parentNode as HTMLElement).scrollTop ||
|
|
||||||
document.body.scrollTop
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @param {number} to
|
|
||||||
* @param {number} duration
|
|
||||||
* @param {Function} callback
|
|
||||||
*/
|
|
||||||
export const scrollTo = (to: number, duration: number, callback?: any) => {
|
|
||||||
const start = position();
|
|
||||||
const change = to - start;
|
|
||||||
const increment = 20;
|
|
||||||
let currentTime = 0;
|
|
||||||
duration = typeof duration === "undefined" ? 500 : duration;
|
|
||||||
const animateScroll = function () {
|
|
||||||
// increment the time
|
|
||||||
currentTime += increment;
|
|
||||||
// find the value with the quadratic in-out easing function
|
|
||||||
const val = easeInOutQuad(currentTime, start, change, duration);
|
|
||||||
// move the document.body
|
|
||||||
move(val);
|
|
||||||
// do the animation unless its over
|
|
||||||
if (currentTime < duration) {
|
|
||||||
requestAnimFrame(animateScroll);
|
|
||||||
} else {
|
|
||||||
if (callback && typeof callback === "function") {
|
|
||||||
// the animation is done so lets callback
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
animateScroll();
|
|
||||||
};
|
|
||||||
Reference in New Issue
Block a user