fix: 首页样式修改

src/components/product/product.vue

@@ -1,4 +1,4 @@
-<script lang="ts" setup>
+<script setup>
 import { formatNumber } from '@/utils/index'
 
 defineOptions({
@@ -9,6 +9,10 @@ const props = defineProps({
     type: Object,
     required: true,
   },
+  titleFontSize: {
+    type: [Number, String],
+    default: 22,
+  },
   width: {
     type: [Number, String],
     default: 260,
@@ -28,7 +32,7 @@ function handleClick() {
 
 <template>
   <view
-    class="flex flex-col items-center border-1 border-#E0E0E0 border-solid pb-8rpx"
+    class="flex flex-col items-center pb-8rpx"
     :style="{ maxWidth: Number.isFinite(width) ? `${width}rpx` : width, width: Number.isFinite(width) ? `${width}rpx` : width }"
     @click="handleClick"
   >
@@ -39,15 +43,15 @@ function handleClick() {
         mode="aspectFit"
       />
     </view>
-    <view class="box-border w-full px-14rpx text-24rpx">
-      <view class="truncate">
+    <view class="box-border w-full px-14rpx" :style="{ fontSize: Number.isFinite(titleFontSize) ? `${titleFontSize}rpx` : titleFontSize }">
+      <view class="mb-3px truncate">
         {{ item.productName }}
       </view>
       <view class="flex items-center justify-between">
-        <view class="text-24rpx text-#FF334A font-bold">
+        <view class="text-#FF334A font-bold" :style="{ fontSize: Number.isFinite(titleFontSize) ? `${titleFontSize}rpx` : titleFontSize }">
           ৳ {{ formatNumber(item.price) }}
         </view>
-        <view class="text-24rpx text-#898989">
+        <view class="text-16rpx text-#898989">
           {{ item.sales }} Sold
         </view>
       </view>

src/layouts/fg-tabbar/fg-tabbar.vue

@@ -31,7 +31,10 @@ onLoad(() => {
 <template>
   <wd-tabbar
     v-if="CUSTOM_TABBAR_ENABLE"
-    v-model="tabbarStore.curIdx" custom-class="bg-white/60! backdrop-blur-20" bordered safeareainsetbottom placeholder fixed
+    v-model="tabbarStore.curIdx"
+    custom-class="bg-white/60! backdrop-blur-20" :bordered="false"
+
+    safe-area-inset-bottom placeholder fixed
     @change="selectTabBar"
   >
     <block v-for="(item, idx) in tabbarList" :key="item.path">

src/locale/bn.json

@@ -108,6 +108,7 @@
   "home.priceTab.500spot": "৫০০স্পট",
   "home.priceTab.1000spot": "১০০০স্পট",
   "home.priceTab.2000spot": "২০০০স্পট",
+  "home.priceTab.3000spot": "৩০০০স্পট",
   "mine.auth.register": "নিবন্ধন",
   "mine.auth.login": "লগইন",
   "mine.wallet.title": "BandhuBuy ওয়ালেট",

src/locale/en.json

@@ -108,6 +108,7 @@
   "home.priceTab.500spot": "500Spot",
   "home.priceTab.1000spot": "1000Spot",
   "home.priceTab.2000spot": "2000Spot",
+  "home.priceTab.3000spot": "3000Spot",
   "search.placeholder": "Search",
   "search.filterPrice": "All Price",
   "search.filterCategory": "Category",

src/locale/zh-Hans.json

@@ -125,6 +125,7 @@
   "home.priceTab.500spot": "500积分",
   "home.priceTab.1000spot": "1000积分",
   "home.priceTab.2000spot": "2000积分",
+  "home.priceTab.3000spot": "3000积分",
   "income.title": "收益中心",
   "income.totalEarnings": "总收益",
   "income.accountBalance": "账户余额",

src/pages/index/index.vue

@@ -119,6 +119,12 @@ const priceTabList = ref([
     minPrice: 1000,
     maxPrice: 2000,
   },
+  {
+    title: 'home.priceTab.3000spot',
+    value: 3000,
+    minPrice: 2000,
+    maxPrice: 3000,
+  },
 ])
 
 const dataList = ref<any>([])
@@ -168,7 +174,7 @@ onShow(() => {
 </script>
 
 <template>
-  <z-paging ref="paging" v-model="dataList" bg-color="#fff" use-page-scroll @query="queryList">
+  <z-paging ref="paging" v-model="dataList" use-page-scroll @query="queryList">
     <template #top>
       <view
         class="flex items-center justify-between bg-white pb-40rpx pl-42rpx pr-34rpx pt-26rpx"
@@ -206,27 +212,35 @@ onShow(() => {
           {{ $t('home.news') }}
         </view>
         <scroll-view scroll-x>
-          <view class="flex items-center gap-22rpx pb-24rpx">
-            <product v-for="(item, index) in newProducts" :key="index" :item="item" @item-click="toPage('/pages/productDetail/productDetail', { productId: item.productId })" />
+          <view class="flex items-center gap-16rpx pb-24rpx">
+            <Product v-for="(item, index) in newProducts" :key="index" :title-font-size="18" :item="item" @item-click="toPage('/pages/productDetail/productDetail', { productId: item.productId })" />
           </view>
         </scroll-view>
       </view>
-      <view>
+      <view class="productList">
         <wd-tabs v-model="priceTab" :line-width="0" :line-height="0" @change="onPriceTabChange">
           <template v-for="item in priceTabList" :key="item">
             <wd-tab :title="$t(item.title)" />
           </template>
         </wd-tabs>
         <view class="grid grid-cols-2 gap-22rpx">
-          <product v-for="(item, index) in dataList" :key="index" width="100%" :height="340" :item="item" @item-click="toPage('/pages/productDetail/productDetail', { productId: item.productId })" />
+          <Product v-for="(item, index) in dataList" :key="index" width="100%" :height="340" :item="item" @item-click="toPage('/pages/productDetail/productDetail', { productId: item.productId })" />
         </view>
       </view>
     </view>
   </z-paging>
 </template>
 
-<style>
-page {
-  background: #fff;
+<style lang="scss" scoped>
+:deep(.productList) {
+  .wd-tabs {
+    background: none;
+    .wd-tabs__nav {
+      background: none;
+      .wd-tabs__nav-item {
+        justify-content: flex-start;
+      }
+    }
+  }
 }
 </style>

src/pages/mine/myFavorite.vue

@@ -47,7 +47,7 @@ async function queryList(pageNo: number, pageSize: number) {
     <template v-if="dataList.length">
       <view class="px-24rpx py-24rpx">
         <view class="grid grid-cols-2 gap-22rpx">
-          <product v-for="(item, index) in dataList" :key="index" width="100%" :height="340" :item="item" @item-click="toPage('/pages/productDetail/productDetail', { productId: item.productId })" />
+          <Product v-for="(item, index) in dataList" :key="index" width="100%" :height="340" :item="item" @item-click="toPage('/pages/productDetail/productDetail', { productId: item.productId })" />
         </view>
       </view>
     </template>

src/pages/search/search.vue

@@ -64,6 +64,12 @@ const option1 = ref<Record<string, any>[]>([
     minPrice: 1000,
     maxPrice: 2000,
   },
+  {
+    label: t('home.priceTab.3000spot'),
+    value: 3000,
+    minPrice: 2000,
+    maxPrice: 3000,
+  },
 ])
 
 const option2 = ref<Record<string, any>[]>([
@@ -136,7 +142,7 @@ onLoad(() => {
     </template>
     <view class="px-24rpx pb-24rpx">
       <view class="grid grid-cols-2 gap-22rpx">
-        <product v-for="(item, index) in dataList" :key="index" width="100%" :height="340" :item="item" />
+        <Product v-for="(item, index) in dataList" :key="index" width="100%" :height="340" :item="item" />
       </view>
     </view>
   </z-paging>