<template>
  <FlexCol :padding="30" :gap="10">
    <Image
      src="https://mn.wenlvti.net/app_static/xiangan/banner_dig_custom.jpg"
      :radius="20"
      mode="widthFix"
      :width="690"
    />
    <FlexCol :gap="20">
      <TaskList
        icon="icon-task-custom-2"
        title="节庆活动"
        desc="欢庆与传承并重的文化盛宴"
        @click="goForm('folk_culture', 1, 'folk_culture_type', undefined, '节庆活动')"
      />
      <TaskList
        icon="icon-task-custom-3"
        title="祭祀崇礼"
        desc="对先贤与自然的崇高致敬"
        @click="goForm('folk_culture', 2, 'folk_culture_type', undefined, '祭祀崇礼')"
      />
      <TaskList
        icon="icon-task-custom-4"
        title="婚丧嫁娶"
        desc="生命礼赞与文化传承的双重奏鸣"
        @click="goForm('folk_culture', 3, 'folk_culture_type', undefined, '婚丧嫁娶')"
      />
      <TaskList
        icon="icon-task-custom-5"
        title="地方方言"
        desc="历史沉淀的语言瑰宝"
        @click="goForm('folk_culture', 4, 'folk_culture_type', undefined, '地方方言')"
      />
      <TaskList
        icon="icon-task-custom-6"
        title="特色文化"
        desc="民族精神的鲜明烙印"
        @click="goForm('folk_culture', 5, 'folk_culture_type', undefined, '特色文化')"
      />
    </FlexCol>
  </FlexCol>
</template>

<script setup lang="ts">
import { useCollectStore } from '@/store/collect';
import { useTaskEntryForm } from '../composeable/TaskEntryForm';
import FlexCol from '@/components/layout/FlexCol.vue';
import Image from '@/components/basic/Image.vue';
import TaskList from '../components/TaskList.vue';

const { goForm } = useTaskEntryForm();
const { canCollect } = useCollectStore();
</script>
