Quellcode durchsuchen

feat: 更新首页和物料页面,优化数据请求逻辑,整合 setStudyTours 函数,添加 PageHelperEvo 组件以支持动态数据加载

EvilDragon vor 3 Monaten
Ursprung
Commit
347925e719
2 geänderte Dateien mit 63 neuen und 62 gelöschten Zeilen
  1. 2 6
      packages/app/src/pages/home/index.vue
  2. 61 56
      packages/app/src/pages/material/index.vue

+ 2 - 6
packages/app/src/pages/home/index.vue

@@ -99,14 +99,10 @@ const handlePlay = async (id) => {
 }
 onShow(async () => {
   pageHelperRef.value?.refresh()
-  // await setStudyTours()
-  // setStudyTours()
-  await Promise.all([setHotActivities()])
+  await Promise.all([setHotActivities(), setStudyTours()])
 })
 onLoad(async () => {
-  await Promise.all([setIndexConfigsData(), setStudyTours()])
-  // await setIndexConfigsData()
-  // await setStudyTours()
+  await Promise.all([setIndexConfigsData()])
   swiperData.value = indexConfigsData.value.list.map((it) => ({
     data: it,
   }))

+ 61 - 56
packages/app/src/pages/material/index.vue

@@ -6,19 +6,23 @@
 import Card from '@/components/card.vue'
 import SectionHeading from '@/components/section-heading.vue'
 import { abc, calculator } from '../../core/libs/pngs'
-import { getAppMaterials, getBanners, getByDictType } from '../../core/libs/requests'
+import { getAppMaterials, getBanners, getByDictType, getMaterials } from '../../core/libs/requests'
 import { close, phone } from '../../core/libs/svgs'
 import { BannerMode, DictType, MaterialDealer, MaterialsList } from '../../core/libs/models'
 import routerIcon from '@designer-hub/assets/src/assets/svgs/router'
 import Banner from '../home/components/banner.vue'
 import materialDealers from '@designer-hub/assets/src/libs/assets/materialDealers'
 import { useRouter } from '../../core/utils/router'
+import PageHelperEvo from '@/components/page-helper-evo.vue'
 
 const router = useRouter()
 const { data: materialDealerData, run: setMaterialDealerData } = useRequest(
   () => getAppMaterials(),
   { initialData: [] },
 )
+const { data: materials, run: setMaterials } = useRequest(() => getMaterials(), {
+  initialData: { list: [] },
+})
 const { data, run } = useRequest(() => getByDictType(DictType.memberMaterialsBrandLevel))
 const { data: materialOperationTypes, run: setMaterialOperationTypes } = useRequest(
   () => getByDictType(DictType.memberMaterialsOperationType),
@@ -102,7 +106,8 @@ const handleGo = ({ name, address }) => {
 }
 onMounted(async () => {
   await run()
-  await setMaterialDealerData()
+  // await setMaterialDealerData()
+  await setMaterials()
   await Promise.all([setMaterialBrandTypes(), setMaterialOperationTypes(), setBanners()])
   // const reqs = data.value.map((it) =>
   //   getMaterials({ brandLevel: it.value }).then(({ data }) => data),
@@ -167,63 +172,63 @@ onMounted(async () => {
         </template>
       </div>
 
-      <template v-for="({ brandLevelName, materialsList }, i) in materialDealerData" :key="i">
-        <!-- <SectionHeading
-          :title="brandLevelName"
-          :subtitle="`积分兑换比例${pointsRate}%`"
-          custom-class="mx-3.5"
-        ></SectionHeading> -->
+      <!-- <template v-for="({ brandLevelName, materialsList }, i) in materialDealerData" :key="i">
         <SectionHeading :title="brandLevelName" custom-class="mx-3.5"></SectionHeading>
-        <div class="my-6 px-3.5 grid grid-cols-2 gap-x-2.5 gap-y-4">
-          <template v-for="(it, index) in materialsList" :key="index">
-            <div class="" @click="toDetail(it.id)">
-              <Card class="h-full">
-                <div class="flex flex-col items-center">
-                  <wd-img
-                    width="78"
-                    height="78"
-                    custom-class="border border-[#f2f2f2] border-solid rounded-full overflow-hidden"
-                    :src="it.logoUrl"
-                  ></wd-img>
-                  <div
-                    class="my-4 text-black/90 text-base font-normal font-['PingFang_SC'] leading-[10.18px]"
-                  >
-                    {{ it.materialsName }}
-                  </div>
-                  <div
-                    class="mb-4 text-black/60 text-sm font-normal font-['PingFang_SC'] leading-[10.18px]"
-                  >
-                    <!-- 进口品牌 -->
-                    {{
-                      (it.brandType,
-                      materialBrandTypes.find(({ value }) => value === String(it.brandType))?.label)
-                    }}
-                    |
-                    {{
-                      materialOperationTypes.find(({ value }) => value === String(it.manageType))
-                        ?.label
-                    }}
-                  </div>
-                  <div @click.stop>
-                    <wd-button
-                      size="small"
-                      custom-class="my-4"
-                      @click.stop="() => ((dealerPanelState = true), (currentDeraler = it))"
+      </template> -->
+      <PageHelperEvo :request="getMaterials" :query="{}">
+        <template #default="{ source }">
+          <div class="my-6 px-3.5 grid grid-cols-2 gap-x-2.5 gap-y-4">
+            <template v-for="(it, i) in source.list" :key="i">
+              <div class="" @click="toDetail(it.id)">
+                <Card class="h-full">
+                  <div class="flex flex-col items-center">
+                    <wd-img
+                      width="78"
+                      height="78"
+                      custom-class="border border-[#f2f2f2] border-solid rounded-full overflow-hidden"
+                      :src="it.logoUrl"
+                    ></wd-img>
+                    <div
+                      class="my-4 text-black/90 text-base font-normal font-['PingFang_SC'] leading-[10.18px]"
                     >
-                      联系商家
-                    </wd-button>
-                  </div>
-                  <div
-                    class="text-black/30 text-xs font-normal font-['PingFang_SC'] leading-[10.18px]"
-                  >
-                    {{ it.virtualArrival || 0 }}次到店打卡
+                      {{ it.materialsName }}
+                    </div>
+                    <div
+                      class="mb-4 text-black/60 text-sm font-normal font-['PingFang_SC'] leading-[10.18px]"
+                    >
+                      <!-- 进口品牌 -->
+                      {{
+                        (it.brandType,
+                        materialBrandTypes.find(({ value }) => value === String(it.brandType))
+                          ?.label)
+                      }}
+                      |
+                      {{
+                        materialOperationTypes.find(({ value }) => value === String(it.manageType))
+                          ?.label
+                      }}
+                    </div>
+                    <div @click.stop>
+                      <wd-button
+                        size="small"
+                        custom-class="my-4"
+                        @click.stop="() => ((dealerPanelState = true), (currentDeraler = it))"
+                      >
+                        联系商家
+                      </wd-button>
+                    </div>
+                    <div
+                      class="text-black/30 text-xs font-normal font-['PingFang_SC'] leading-[10.18px]"
+                    >
+                      {{ it.virtualArrival || 0 }}次到店打卡
+                    </div>
                   </div>
-                </div>
-              </Card>
-            </div>
-          </template>
-        </div>
-      </template>
+                </Card>
+              </div>
+            </template>
+          </div>
+        </template>
+      </PageHelperEvo>
     </view>
 
     <!-- <wd-action-sheet v-model="dealerPanelState">