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