From 307b17ef15c73a071912a262834f2a5f68e1fa87 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 11 九月 2025 15:20:35 +0800
Subject: [PATCH] 完成走航季度报告自动生成

---
 src/components/SliderBar.vue |   32 ++++++++++++++++++++++++++++----
 1 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/src/components/SliderBar.vue b/src/components/SliderBar.vue
index 4bb44f7..9dfb8c5 100644
--- a/src/components/SliderBar.vue
+++ b/src/components/SliderBar.vue
@@ -1,8 +1,10 @@
 <template>
   <el-row justify="center" align="middle" class="wrap">
-    <el-form-item label="鏁版嵁閲�">
+    <!-- <el-col :span="6"> -->
+    <el-form-item label="灞曠ず鏁版嵁閲�">
       <el-select
         v-model="pageSize"
+        @change="handleSizeChange"
         placeholder="鏁版嵁閲�"
         size="small"
         class="w-60"
@@ -11,17 +13,26 @@
         <el-option label="500" :value="500" />
       </el-select>
     </el-form-item>
+    <!-- </el-col> -->
+    <!-- <el-col :span="18"> -->
     <div class="slider-wrap m-l-16">
-      <el-slider v-model="progress" :marks="marks" />
+      <el-slider :model-value="progress" :marks="marks" @input="handleInput" />
     </div>
+    <!-- </el-col> -->
   </el-row>
 </template>
 <script>
 export default {
+  props: {
+    progress: {
+      type: Number,
+      default: 0
+    }
+  },
+  emits: ['update:progress', 'sizeChange'],
   data() {
     return {
       pageSize: 200,
-      progress: 0,
       marks: {
         0: {
           style: {
@@ -37,6 +48,15 @@
         }
       }
     };
+  },
+  methods: {
+    handleInput(e) {
+      // console.log(e);
+      this.$emit('update:progress', e);
+    },
+    handleSizeChange(e) {
+      this.$emit('sizeChange', e);
+    }
   }
 };
 </script>
@@ -46,6 +66,10 @@
   height: 60px;
 }
 .slider-wrap {
-  min-width: 400px;
+  /* background-color: aliceblue; */
+  min-width: 290px;
+}
+.el-form-item {
+  margin-bottom: 0px;
 }
 </style>

--
Gitblit v1.9.3