fashion-ssr-vue3/components/business/category/exploreProduct.vue

<script lang='ts' setup>
import {
  getFeatureListApi,
} from '~/api/model/feature'
import { PageSizeEnum } from '~/enums/sizeEnum'

const list = ref<any>([])
const page_size = ref(3)
async function getFeatureList(pageNo = PageSizeEnum.PAGE, pageSize = page_size.value) {
  const params = {
    pageNo,
    pageSize,
  }
  const res: any = await getFeatureListApi(params)
  list.value = res.records
}
getFeatureList()
</script>

<template>
  <div class="w-1400px mx-auto mb-160px">
    <h2 class="!mb-60px fw-700 text-40px text-#363C40 text-center">
      Explore More Product Collections
    </h2>
    <div class="grid grid-cols-3 gap-x-106px gap-y-60px px-66px">
      <div v-for="item, index in list" :key="index">
        <common-featured-item2 :item />
      </div>
    </div>
    <!-- <div class="flex justify-center items-center cursor-pointer mt-60px">
      <div class="underline fw-500 text-24px hover:text-#CC9879">
        View All
      </div>
      <svgo-arrow class="!w-12px !h-12px ml-14px" />
    </div> -->
  </div>
</template>

<style lang='less' scoped>
</style>