|
@@ -1,12 +1,106 @@
|
|
|
<template>
|
|
<template>
|
|
|
<CommonTopBanner title="任务中心">
|
|
<CommonTopBanner title="任务中心">
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
|
|
+ <FlexCol padding="padding.md">
|
|
|
|
|
+ <SimplePageListLoader :loader="listLoader">
|
|
|
|
|
+ <FlexCol gap="gap.md">
|
|
|
|
|
+ <BoxMid
|
|
|
|
|
+ v-for="item in listLoader.list.value"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ direction="row"
|
|
|
|
|
+ :padding="[16, 30]"
|
|
|
|
|
+ >
|
|
|
|
|
+ <Touchable
|
|
|
|
|
+ :gap="20"
|
|
|
|
|
+ :padding="[15,20]"
|
|
|
|
|
+ touchable
|
|
|
|
|
+ flex="1"
|
|
|
|
|
+ direction="row"
|
|
|
|
|
+ justify="space-between"
|
|
|
|
|
+ align="center"
|
|
|
|
|
+ >
|
|
|
|
|
+ <FlexCol gap="gap.md">
|
|
|
|
|
+ <Text fontConfig="lightImportantTitle" fontFamily="SongtiSCBlack">{{ item.name }}</Text>
|
|
|
|
|
+ <Text :fontSize="23" :text="item.desc" />
|
|
|
|
|
+ <Text v-if="item.points > 0" fontConfig="secondText">+{{ item.points }}文化积分</Text>
|
|
|
|
|
+ <FlexRow align="center" gap="gap.md">
|
|
|
|
|
+ <Button v-if="item.rewardFruit > 0" icon="https://xy.wenlvti.net/app_static/images/village/IconFruit.png" size="mini" :text="`+${item.rewardFruit}乡源果`" />
|
|
|
|
|
+ <Button v-if="item.rewardLight > 0" icon="https://xy.wenlvti.net/app_static/images/village/IconLight.png" size="mini" :text="`+${item.rewardLight}乡源光`" />
|
|
|
|
|
+ <Button v-if="item.rewardWater > 0" icon="https://xy.wenlvti.net/app_static/images/village/IconWatering.png" size="mini" :text="`+${item.rewardWater}浇水次数`" />
|
|
|
|
|
+ </FlexRow>
|
|
|
|
|
+ </FlexCol>
|
|
|
|
|
+ <FlexRow gap="gap.xl" align="center">
|
|
|
|
|
+ <FlexCol align="flex-end">
|
|
|
|
|
+ <FrameButton
|
|
|
|
|
+ v-if="item.limitNum > 0 || item.limitType === 'unlimited'"
|
|
|
|
|
+ primary
|
|
|
|
|
+ text="去完成"
|
|
|
|
|
+ width="100rpx"
|
|
|
|
|
+ size="small"
|
|
|
|
|
+ @click="handleDoTask(item)"
|
|
|
|
|
+ />
|
|
|
|
|
+ <FrameButton
|
|
|
|
|
+ v-else
|
|
|
|
|
+ primary
|
|
|
|
|
+ text="已完成"
|
|
|
|
|
+ :touchable="false"
|
|
|
|
|
+ width="100rpx"
|
|
|
|
|
+ size="small"
|
|
|
|
|
+ />
|
|
|
|
|
+ <Text v-if="item.limitType === 'day' && item.limitNum > 0" fontConfig="subText">今日可完成{{ item.limitNum }}次</Text>
|
|
|
|
|
+ <Text v-else-if="item.limitType === 'total' && item.limitNum > 0" fontConfig="subText">还可完成{{ item.limitNum }}次</Text>
|
|
|
|
|
+ </FlexCol>
|
|
|
|
|
+ </FlexRow>
|
|
|
|
|
+ </Touchable>
|
|
|
|
|
+ </BoxMid>
|
|
|
|
|
+ </FlexCol>
|
|
|
|
|
+ </SimplePageListLoader>
|
|
|
|
|
+ </FlexCol>
|
|
|
</CommonTopBanner>
|
|
</CommonTopBanner>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
|
|
|
+import { useLoadQuerys } from '@/components/composeabe/LoadQuerys';
|
|
|
|
|
+import { useSimplePageListLoader } from '@/components/composeabe/loader/SimplePageListLoader';
|
|
|
|
|
+import SimplePageListLoader from '@/components/loader/SimplePageListLoader.vue';
|
|
|
import FlexCol from '@/components/layout/FlexCol.vue';
|
|
import FlexCol from '@/components/layout/FlexCol.vue';
|
|
|
import Text from '@/components/basic/Text.vue';
|
|
import Text from '@/components/basic/Text.vue';
|
|
|
import CommonTopBanner from '@/common/components/CommonTopBanner.vue';
|
|
import CommonTopBanner from '@/common/components/CommonTopBanner.vue';
|
|
|
|
|
+import TreeApi, { GrowthTaskItem } from '@/api/light/TreeApi';
|
|
|
|
|
+import BoxMid from '@/common/components/box/BoxMid.vue';
|
|
|
|
|
+import Touchable from '@/components/feedback/Touchable.vue';
|
|
|
|
|
+import FlexRow from '@/components/layout/FlexRow.vue';
|
|
|
|
|
+import FrameButton from '@/common/components/FrameButton.vue';
|
|
|
|
|
+import Button from '@/components/basic/Button.vue';
|
|
|
|
|
+import { backAndCallOnPageBack } from '@/components/utils/PageAction';
|
|
|
|
|
+
|
|
|
|
|
+const { querys } = useLoadQuerys({
|
|
|
|
|
+ villageId: 0,
|
|
|
|
|
+}, () => {
|
|
|
|
|
+ listLoader.load();
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+const listLoader = useSimplePageListLoader(20, async (page, pageSize) => {
|
|
|
|
|
+ const res = await TreeApi.getTaskList({
|
|
|
|
|
+ page,
|
|
|
|
|
+ pageSize,
|
|
|
|
|
+ villageId: querys.value.villageId || undefined,
|
|
|
|
|
+ });
|
|
|
|
|
+ return {
|
|
|
|
|
+ list: res.list,
|
|
|
|
|
+ total: res.total,
|
|
|
|
|
+ };
|
|
|
|
|
+}, false);
|
|
|
|
|
+
|
|
|
|
|
+function handleDoTask(item: GrowthTaskItem) {
|
|
|
|
|
+ switch (item.taskType) {
|
|
|
|
|
+ case 'collect':
|
|
|
|
|
+ case 'post':
|
|
|
|
|
+ case 'tree':
|
|
|
|
|
+ backAndCallOnPageBack('goVillage', {
|
|
|
|
|
+ id: querys.value.villageId,
|
|
|
|
|
+ taskType: item.taskType,
|
|
|
|
|
+ });
|
|
|
|
|
+ break;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
</script>
|
|
</script>
|