<script setup lang="ts">
import { index, surveys, keyword } from '@/views/HomeSearch/Hooks/useSurveySearch';
import SurveyItem from '@/components/SurveyItem/Index.vue';
import { useRouter } from 'vue-router';
import { computed } from 'vue';

const router = useRouter();
const limit = defineModel<number>('limit');
const currentSurvey = computed(() =>
  limit.value ? surveys.value.slice(0, limit.value) : surveys.value
);

/**
 *  van-list 触发 loading 状态函数
 */
function handleLoadStatus() {
  // 关键字为空时不进行搜索
  if (!keyword.value) return;
  index.value += 1;
}

function handleSurveyClick(survey: { sn: any }) {
  router.push({
    path: '/create',
    query: {
      sn: survey.sn
    }
  });
}
// const surveys = computed(() => {
//   // 取前三个元素
//   return _surveys.value.slice(0, 3);
// });
</script>

<template>
  <div class="list-container">
    <van-cell v-for="survey in currentSurvey" :key="survey" class="list-item">
      <template #extra>
        <survey-item :survey="survey" @click="handleSurveyClick(survey)" />
      </template>
    </van-cell>
  </div>
</template>

<style scoped lang="scss">
@use '@/assets/css/theme';

.list-container {
  // max-height: 30vh;
  overflow: scroll;

  .list-item {
    margin-top: theme.$gap;
  }

  .list-item:first-child {
    margin-top: 0;
  }
}
</style>
