feat(MineTask): 添加问卷列表拖动功能
- 在 Index.vue 中添加拖动开始和结束的事件处理函数 - 在 QuestionList.vue 中根据拖动状态显示/隐藏分页器和导航按钮 - 新增 useDragEvent 钩子用于管理拖动状态
This commit is contained in:
@@ -1,13 +1,22 @@
|
||||
<script setup lang="ts">
|
||||
import QuestionList from './components/QuestionList.vue';
|
||||
import { ref } from 'vue';
|
||||
import { isDrag } from './hooks/useDragEvent';
|
||||
const active = ref(0);
|
||||
const total = ref(0);
|
||||
const surveys = defineModel('surveys', { required: true });
|
||||
function setActive(act, tol) {
|
||||
function setActive(act: number, tol: number) {
|
||||
active.value = act;
|
||||
total.value = tol;
|
||||
}
|
||||
|
||||
function handleDragStart() {
|
||||
isDrag.value = true;
|
||||
}
|
||||
|
||||
function handleDragEnd() {
|
||||
isDrag.value = false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -24,7 +33,7 @@ function setActive(act, tol) {
|
||||
<!--分页器。如果放置在swiper外面,需要自定义样式。-->
|
||||
</div>
|
||||
<div>
|
||||
<van-swipe :loop="false">
|
||||
<van-swipe :loop="false" @drag-start="handleDragStart" @drag-end="handleDragEnd">
|
||||
<van-swipe-item v-for="question in surveys" :key="question?.sn">
|
||||
<question-list :survey="question" style="max-width: 100vw; overflow: hidden" />
|
||||
</van-swipe-item>
|
||||
|
||||
Reference in New Issue
Block a user