xiangyuan-app/src/pages/dig/forms/task.vue

<template>
  <FlexCol v-if="currentTaskDefItem" :padding="30" :gap="10">
    <Image
      v-if="currentTaskDefItem.banner"
      :src="currentTaskDefItem.banner"
      :radius="20"
      :width="690"
      mode="widthFix"
    />
    <FlexCol :gap="20">
      <TaskList
        v-for="item in currentTaskDefItem.list"
        :key="item.title"
        :icon="item.icon"
        :title="item.title"
        :desc="item.desc"
        :enable="!item.enable || canCollect(item.enable)"
        @click="goForm(...item.goForm)"
      />
    </FlexCol>
  </FlexCol>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { useCollectStore } from '@/store/collect';
import { useTaskEntryForm } from './composeable/TaskEntryForm';
import { useLoadQuerys } from '@/common/composeabe/LoadQuerys';
import { TaskMenuDef, type TaskMenuDefItem } from './tasks';
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();

const { querys } = useLoadQuerys({ 
  taskName: '',
}, ({ taskName }) => {
  currentTaskDefItem.value = TaskMenuDef[taskName];
});
const currentTaskDefItem = ref<TaskMenuDefItem|null>(null);


</script>