From b6163e1bed94b4d02d1b6f01fdc2eb3f15ca22e3 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期一, 07 十月 2024 15:47:46 +0800
Subject: [PATCH] 保存默认工艺路线，工单批次优化
---
src/components/Container/src/ScrollContainer.vue | 132 +++++++++++++++++++++----------------------
1 files changed, 64 insertions(+), 68 deletions(-)
diff --git a/src/components/Container/src/ScrollContainer.vue b/src/components/Container/src/ScrollContainer.vue
index ca19003..26b135f 100644
--- a/src/components/Container/src/ScrollContainer.vue
+++ b/src/components/Container/src/ScrollContainer.vue
@@ -1,80 +1,77 @@
<template>
- <Scrollbar ref="scrollbarRef" class="scroll-container" v-bind="$attrs">
+ <Scrollbar
+ ref="scrollbarRef"
+ class="scroll-container"
+ :scrollHeight="scrollHeight"
+ v-bind="$attrs"
+ >
<slot></slot>
</Scrollbar>
</template>
-<script lang="ts">
- import { defineComponent, ref, unref, nextTick } from 'vue';
- import { Scrollbar, ScrollbarType } from '/@/components/Scrollbar';
+<script lang="ts" setup>
+ import { ref, unref, nextTick } from 'vue';
+ import { Scrollbar, ScrollbarType } from '@/components/Scrollbar';
import { useScrollTo } from '@vben/hooks';
import { type Nullable } from '@vben/types';
- export default defineComponent({
- name: 'ScrollContainer',
- components: { Scrollbar },
- setup() {
- const scrollbarRef = ref<Nullable<ScrollbarType>>(null);
+ defineOptions({ name: 'ScrollContainer' });
- /**
- * Scroll to the specified position
- */
- function scrollTo(to: number, duration = 500) {
- const scrollbar = unref(scrollbarRef);
- if (!scrollbar) {
- return;
- }
- nextTick(() => {
- const wrap = unref(scrollbar.wrap);
- if (!wrap) {
- return;
- }
- const { start } = useScrollTo({
- el: wrap,
- to,
- duration,
- });
- start();
- });
- }
-
- function getScrollWrap() {
- const scrollbar = unref(scrollbarRef);
- if (!scrollbar) {
- return null;
- }
- return scrollbar.wrap;
- }
-
- /**
- * Scroll to the bottom
- */
- function scrollBottom() {
- const scrollbar = unref(scrollbarRef);
- if (!scrollbar) {
- return;
- }
- nextTick(() => {
- const wrap = unref(scrollbar.wrap) as any;
- if (!wrap) {
- return;
- }
- const scrollHeight = wrap.scrollHeight as number;
- const { start } = useScrollTo({
- el: wrap,
- to: scrollHeight,
- });
- start();
- });
- }
-
- return {
- scrollbarRef,
- scrollTo,
- scrollBottom,
- getScrollWrap,
- };
+ defineProps({
+ scrollHeight: {
+ type: Number,
},
+ });
+
+ const scrollbarRef = ref<Nullable<ScrollbarType>>(null);
+
+ function getScrollWrap() {
+ const scrollbar = unref(scrollbarRef);
+ if (!scrollbar) {
+ return null;
+ }
+ return scrollbar.wrap;
+ }
+
+ /**
+ * Scroll to the specified position
+ */
+ function scrollTo(to: number, duration = 500) {
+ const wrap = unref(getScrollWrap());
+ nextTick(() => {
+ if (!wrap) {
+ return;
+ }
+ const { start } = useScrollTo({
+ el: wrap,
+ to,
+ duration,
+ });
+ start();
+ });
+ }
+
+ /**
+ * Scroll to the bottom
+ */
+ function scrollBottom() {
+ const wrap = unref(getScrollWrap());
+ nextTick(() => {
+ if (!wrap) {
+ return;
+ }
+ const scrollHeight = wrap.scrollHeight as number;
+ const { start } = useScrollTo({
+ el: wrap,
+ to: scrollHeight,
+ });
+ start();
+ });
+ }
+
+ defineExpose({
+ scrollTo,
+ scrollBottom,
});
</script>
<style lang="less">
@@ -84,7 +81,6 @@
.scrollbar__wrap {
margin-bottom: 18px !important;
- overflow-x: hidden;
}
.scrollbar__view {
--
Gitblit v1.9.3