summary.vue 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <FlexCol :padding="30" :gap="20">
  3. <Image
  4. src="https://mn.wenlvti.net/app_static/xiangan/banner_dig_summary.jpg"
  5. :radius="20"
  6. round
  7. mode="widthFix"
  8. :width="690"
  9. />
  10. <FlexCol :gap="20">
  11. <TaskList
  12. icon="icon-task-summary-1"
  13. title="行政区划"
  14. desc="村落行政区域划分及变迁"
  15. @click="goForm(1, '行政区划')"
  16. />
  17. <TaskList
  18. icon="icon-task-summary-5"
  19. title="村落综述"
  20. desc="村落整体概况介绍"
  21. @click="goForm(5, '村落综述')"
  22. />
  23. <TaskList
  24. icon="icon-task-summary-2"
  25. title="地理信息"
  26. desc="地理位置和自然环境特征"
  27. @click="goForm(2, '地理信息')"
  28. />
  29. <TaskList
  30. icon="icon-task-summary-3"
  31. title="建设与保护"
  32. desc="村落发展与文化遗产保护"
  33. @click="goForm(3, '建设与保护')"
  34. />
  35. <TaskList
  36. icon="icon-task-summary-4"
  37. title="人口与经济"
  38. desc="人口与经济情况"
  39. @click="goForm(4, '人口与经济')"
  40. />
  41. </FlexCol>
  42. <XBarSpace />
  43. </FlexCol>
  44. </template>
  45. <script setup lang="ts">
  46. import { useCollectStore } from '@/store/collect';
  47. import { useTaskEntryForm } from '../composeable/TaskEntryForm';
  48. import FlexCol from '@/components/layout/FlexCol.vue';
  49. import Image from '@/components/basic/Image.vue';
  50. import TaskList from '../components/TaskList.vue';
  51. import XBarSpace from '@/components/layout/space/XBarSpace.vue';
  52. const { canCollect } = useCollectStore();
  53. const t = useTaskEntryForm();
  54. function goForm(subId: number, title: string) {
  55. t.goForm('overview', subId, undefined, 'common', title);
  56. }
  57. </script>