Pārlūkot izejas kodu

Merge branch 'mp-voluntary' into mp

abpcoder 2 nedēļas atpakaļ
vecāks
revīzija
e8d057a9b9

+ 21 - 0
src/pagesMain/pages/volunteer/components/volunteer-policy-item.vue

@@ -0,0 +1,21 @@
+<template>
+    <view class="p-28 flex flex-between items-center bg-[#F6F8FA] rounded-xl relative">
+        <view>
+            <view class="break-keep text-sm text-fore-title font-bold">{{title}}</view>
+            <view class="mt-5 break-keep text-3xs text-fore-tip">{{desc}}</view>
+        </view>
+        <ie-image is-oss :src="icon" custom-class="w-108 absolute right-20" />
+    </view>
+</template>
+
+<script setup lang="ts" name="VolunteerPolicyItem">
+defineProps({
+    title: String,
+    desc: String,
+    icon: String
+})
+</script>
+
+<style scoped>
+
+</style>

+ 64 - 0
src/pagesMain/pages/volunteer/components/volunteer-policy.vue

@@ -0,0 +1,64 @@
+<template>
+    <view class="p-28">
+        <view class="text-lg font-bold text-fore-title">{{ title }}</view>
+        <view class="mt-20 grid grid-cols-2 gap-28">
+            <volunteer-policy-item v-for="i in list" :key="i.id" :title="i.subType" :desc="i.description" :icon="i.icon"
+                                   @click="handlePolicyClick(i)"/>
+        </view>
+    </view>
+</template>
+
+<script setup lang="ts" name="VolunteerPolicy">
+import {getNewsMainList} from "@/api/modules/news";
+import {Guide} from "@/types/news";
+import {useTransferPage} from "@/hooks/useTransferPage";
+import {routes} from "@/common/routes";
+import VolunteerPolicyItem from "@/pagesMain/pages/volunteer/components/volunteer-policy-item.vue";
+
+interface PolicyGuide extends Guide {
+    icon: string // 后台没有返回icon,前端在icons按顺序补充
+}
+
+const title = '政策解读'
+const icons = [
+    '/volunteer/index/guide_1.png',
+    '/volunteer/index/guide_2.png',
+    '/volunteer/index/guide_3.png',
+    '/volunteer/index/guide_4.png'
+]
+const list = ref<PolicyGuide[]>([])
+const {transferTo} = useTransferPage()
+
+const loadPolicyNews = function () {
+    getNewsMainList().then(res => {
+        list.value = res.rows.filter(i => i.type == title).map((guide, index) => ({
+            ...guide,
+            icon: icons[index % icons.length]
+        }))
+    });
+}
+
+const handlePolicyClick = async ({refIds, subType}: Guide) => {
+    if (('' + refIds).includes(',')) {
+        await transferTo(routes.newsGroup, {
+            data: {
+                ids: refIds,
+                title: subType
+            }
+        });
+    } else {
+        await transferTo(routes.newsDetail, {
+            data: {
+                id: refIds,
+                title: subType
+            }
+        })
+    }
+}
+
+onMounted(() => loadPolicyNews())
+</script>
+
+<style scoped>
+
+</style>

+ 2 - 0
src/pagesMain/pages/volunteer/volunteer.vue

@@ -18,6 +18,7 @@
         <volunteer-banner :style="{marginTop: (baseStickyTop + 10) + 'px'}"/>
         <volunteer-menu/>
         <ie-gap/>
+        <volunteer-policy/>
         <template #tabbar>
             <ie-tabbar :active="1"/>
         </template>
@@ -32,6 +33,7 @@ import {useDictStore} from "@/store/dictStore";
 import {useNavbar} from "@/hooks/useNavbar";
 import VolunteerBanner from "@/pagesMain/pages/volunteer/components/volunteer-banner.vue";
 import VolunteerMenu from "@/pagesMain/pages/volunteer/components/volunteer-menu.vue";
+import VolunteerPolicy from "@/pagesMain/pages/volunteer/components/volunteer-policy.vue";
 
 const {transferTo} = useTransferPage();
 const userStore = useUserStore();