latest

2026-01-14 15:15:11 +05:30
parent 46e663dc10
commit 5778bdfac7
4 changed files with 140 additions and 60 deletions
@@ -25,7 +25,7 @@ const TabButton = ({ route, isFocused, onPress }: any) => {
        Home: { outline: "Home", filled: "Home" },
        Auction: { outline: "Gavel", filled: "Gavel" },
        Tender: { outline: "FileText", filled: "FileText" },
-        EditableExcel: { outline: "FileText", filled: "FileText" },
+        // EditableExcel: { outline: "FileText", filled: "FileText" },
    };
    const IconName = LucideIcons[isFocused ? icons[route.name].filled : icons[route.name].outline];
    const scaleAnim = useRef(new Animated.Value(1)).current;
@@ -148,7 +148,7 @@ export default function BottomTab() {
                <Tab.Screen name="Home" component={Screens.Home} />
                <Tab.Screen name={NavigationString.Auction} component={Screens.Auction} />
                <Tab.Screen name={NavigationString.Tender} component={Screens.Tender} />
-                <Tab.Screen name={'EditableExcel'} component={EditableExcel} />
+            
            </Tab.Navigator>
        </View>
    );
@@ -1,4 +1,4 @@
-import React, { useState, useRef } from 'react';
+import React, { useState, useRef, useMemo } from 'react';
 import { View, Text, StyleSheet, TouchableOpacity, Animated, Dimensions } from 'react-native';
 import { InsideHeader } from '../../Component/Index';
 import { useFetchLiveAuction, useFetchPurchaseAuction } from '../../Services/BBPS/Hooks';
@@ -10,23 +10,35 @@ import { useNavigation } from '@react-navigation/native';
 import NavigationString from '../../Constant/NavigationString';
 import FontsFamily from '../../Constant/FontsFamily';
 import { useSelector } from 'react-redux';
-const TAB_WIDTH = 140;
+
+const { width: SCREEN_WIDTH } = Dimensions.get('window');
+const HORIZONTAL_PADDING = 32;
+const SWITCH_INSETS = 2;
 const TAB_HEIGHT = 44;

 const Auction = () => {
-  const Navigation = useNavigation() as any
+  const Navigation = useNavigation() as any;
  const { data: liveAuctionData = {} }: any = useFetchLiveAuction();
  const { data: purchaseAuctionData = {} } = useFetchPurchaseAuction();
  const SelectedPurchaseList = useSelector((state: any) => state.selectPurchaseAuction);

-  const liveCount = Array.isArray(liveAuctionData?.result) ? liveAuctionData?.pages[0]?.totalCount : 0;
+  const liveCount = Array.isArray(liveAuctionData?.result)
+    ? liveAuctionData?.pages?.[0]?.totalCount
+    : 0;

-  const purchaseCount = Array.isArray(purchaseAuctionData?.data) ? purchaseAuctionData.data.length : 0;
+  const purchaseCount = Array.isArray(purchaseAuctionData?.data)
+    ? purchaseAuctionData.data.length
+    : 0;

  const [selectedTab, setSelectedTab] = useState<'live' | 'purchase'>('live');

  const translateX = useRef(new Animated.Value(0)).current;

+  const TAB_WIDTH = useMemo(() => {
+    const availableWidth = SCREEN_WIDTH - HORIZONTAL_PADDING - SWITCH_INSETS * 2;
+    return availableWidth / 2.4;
+  }, []);
+
  const onTabPress = (tab: 'live' | 'purchase', index: number) => {
    setSelectedTab(tab);
    Animated.spring(translateX, {
@@ -40,21 +52,28 @@ const Auction = () => {
    <View style={styles.container}>
      <InsideHeader title="Auction" showArrow />

-      {/* Tabs */}
-      <View style={{ flexDirection: 'row', justifyContent: 'space-around', alignItems: 'center' }}>
-        <View style={styles.switchWrapper}>
+      <View style={styles.topRow}>
+        <View
+          style={[
+            styles.switchWrapper,
+            {
+              width: TAB_WIDTH * 2 + SWITCH_INSETS * 2,
+            },
+          ]}
+        >
          <Animated.View
            pointerEvents="none"
            style={[
              styles.activeTab,
              {
+                width: TAB_WIDTH,
                transform: [{ translateX }],
              },
            ]}
          />

          <TouchableOpacity
-            style={styles.tab}
+            style={[styles.tab, { width: TAB_WIDTH }]}
            activeOpacity={0.8}
            onPress={() => onTabPress('live', 0)}
          >
@@ -69,7 +88,7 @@ const Auction = () => {
          </TouchableOpacity>

          <TouchableOpacity
-            style={styles.tab}
+            style={[styles.tab, { width: TAB_WIDTH }]}
            activeOpacity={0.8}
            onPress={() => onTabPress('purchase', 1)}
          >
@@ -83,17 +102,42 @@ const Auction = () => {
            </Text>
          </TouchableOpacity>
        </View>
-        {/* Cart */}
+
        <View>
-          {SelectedPurchaseList.length && <View style={{ borderWidth: 2, borderColor: colors.white, backgroundColor: colors.primaryLight, position: 'absolute', borderRadius: 50, zIndex: 20, right: 0, top: -10, paddingHorizontal: 2 }}>
-            <Text style={{ fontSize: 12, color: colors.black }}>{SelectedPurchaseList.length}</Text>
-          </View>}
-          <TouchableOpacity style={{ padding: 10, backgroundColor: colors.primaryLight, borderRadius: 20 }} onPress={() => { Navigation.navigate(NavigationString.PurchaseList) }}>
+          {SelectedPurchaseList.length ? (
+            <View
+              style={{
+                borderWidth: 2,
+                borderColor: colors.white,
+                backgroundColor: colors.primaryLight,
+                position: 'absolute',
+                borderRadius: 50,
+                zIndex: 20,
+                right: 0,
+                top: -10,
+                paddingHorizontal: 2,
+              }}
+            >
+              <Text style={{ fontSize: 12, color: colors.black }}>
+                {SelectedPurchaseList.length}
+              </Text>
+            </View>
+          ) : null}
+          <TouchableOpacity
+            style={{
+              padding: 10,
+              backgroundColor: colors.primaryLight,
+              borderRadius: 20,
+            }}
+            onPress={() => {
+              Navigation.navigate(NavigationString.PurchaseList);
+            }}
+          >
            <ShoppingCart size={22} color={colors.black} strokeWidth={2} />
          </TouchableOpacity>
        </View>
      </View>
-      {/* Content */}
+
      {selectedTab === 'live' ? <LiveAuction /> : <PurchaseAuction />}
    </View>
  );
@@ -106,9 +150,12 @@ const styles = StyleSheet.create({
    flex: 1,
    backgroundColor: colors.white,
  },
-
-  /* ---------- Switch UI ---------- */
-
+  topRow: {
+    flexDirection: 'row',
+    justifyContent: 'space-around',
+    alignItems: 'center',
+    paddingHorizontal: 16,
+  },
  switchWrapper: {
    flexDirection: 'row',
    marginVertical: 14,
@@ -117,31 +164,25 @@ const styles = StyleSheet.create({
    padding: 2,
    height: TAB_HEIGHT,
  },
-
  tab: {
-    width: TAB_WIDTH,
    height: TAB_HEIGHT - 4,
    alignItems: 'center',
    justifyContent: 'center',
    zIndex: 2,
  },
-
  tabText: {
-    fontSize: 14,
+    fontSize: 13,
    color: '#64748b',
    lineHeight: 18,
-    fontFamily: FontsFamily.poppinsSemiBold
+    fontFamily: FontsFamily.poppinsSemiBold,
  },
-
  activeText: {
    color: colors.primary,
  },
-
  activeTab: {
    position: 'absolute',
    top: 2,
    left: 2,
-    width: TAB_WIDTH,
    height: TAB_HEIGHT - 4,
    backgroundColor: '#fff',
    borderRadius: 16,
@@ -7,6 +7,7 @@ import { Calendar, Tag, Info, ArrowRight } from 'lucide-react-native';
 import TenderDetail from './Modal/TenderFullDetail';
 import TenderFullDetail from './Modal/TenderFullDetail';
 import { useNavigation } from '@react-navigation/native';
+import { format } from '../../Helper/DateFormat';

 const LiveTenderTile: React.FC<LiveTenderTileProps> = ({
  contractorId,
@@ -66,7 +67,9 @@ const purchased = contractorIds.includes(String(contractorId));
            <Calendar size={16} color="#64748b" />
            <View style={styles.infoTextGroup}>
              <Text style={styles.infoLabel}>Start</Text>
-              <Text style={styles.infoValue}>{tenderDispatchDate ?? '-'}</Text>
+              {/* <Text style={styles.infoValue}>{tenderDispatchDate ?? '-'}</Text> */}
+              <Text style={styles.infoValue}>{format.date6(`${tenderDispatchDate}`)}</Text>
+
            </View>
          </View>

@@ -1,4 +1,4 @@
-import React, { useState, useRef } from 'react';
+import React, { useState, useRef, useMemo } from 'react';
 import {
  View,
  Text,
@@ -20,25 +20,31 @@ import FontsFamily from '../../Constant/FontsFamily';
 import { useSelector } from 'react-redux';
 import LiveTender from './LiveTender';
 import PurchaseTenderAllList from './PurchaseTenderAllList';
-const { width } = Dimensions.get('screen')
-const TAB_WIDTH = 140;
+
+const { width: SCREEN_WIDTH } = Dimensions.get('window');
 const TAB_HEIGHT = 44;
+const HORIZONTAL_PADDING = 32;
+const SWITCH_INSETS = 2;

 const Tender = () => {
-  const Navigation = useNavigation() as any
+  const Navigation = useNavigation() as any;
  const { data: liveTenderData }: any = useFetchLiveTender();
  const { data: purchaseTenderData }: any = useFetchPurchaseTender();
-  const SelectedPurchaseList = useSelector((state: any) => state?.selectPurchaseTender);
+  const SelectedPurchaseList = useSelector(
+    (state: any) => state?.selectPurchaseTender,
+  );

-  console.log("live tender : ", liveTenderData)
-  console.log("purchase tender : ", purchaseTenderData)
  const liveCount = liveTenderData?.totalCount || 0;
-
  const purchaseCount = purchaseTenderData?.pages?.[0]?.totalCount || 0;
-  const [selectedTab, setSelectedTab] = useState<'live' | 'purchase'>('live');

+  const [selectedTab, setSelectedTab] = useState<'live' | 'purchase'>('live');
  const translateX = useRef(new Animated.Value(0)).current;

+  const TAB_WIDTH = useMemo(() => {
+    const availableWidth = SCREEN_WIDTH - HORIZONTAL_PADDING - SWITCH_INSETS * 2;
+    return availableWidth / 2.4;
+  }, []);
+
  const onTabPress = (tab: 'live' | 'purchase', index: number) => {
    setSelectedTab(tab);
    Animated.spring(translateX, {
@@ -52,21 +58,28 @@ const Tender = () => {
    <View style={styles.container}>
      <InsideHeader title="Tender" showArrow />

-      {/* Switch Tabs */}
-      <View style={{ flexDirection: 'row', justifyContent: 'space-around', alignItems: 'center' }}>
-        <View style={styles.switchWrapper}>
+      <View style={styles.topRow}>
+        <View
+          style={[
+            styles.switchWrapper,
+            {
+              width: TAB_WIDTH * 2 + SWITCH_INSETS * 2,
+            },
+          ]}
+        >
          <Animated.View
            pointerEvents="none"
            style={[
              styles.activeTab,
              {
+                width: TAB_WIDTH,
                transform: [{ translateX }],
              },
            ]}
          />

          <TouchableOpacity
-            style={styles.tab}
+            style={[styles.tab, { width: TAB_WIDTH }]}
            activeOpacity={0.8}
            onPress={() => onTabPress('live', 0)}
          >
@@ -81,7 +94,7 @@ const Tender = () => {
          </TouchableOpacity>

          <TouchableOpacity
-            style={styles.tab}
+            style={[styles.tab, { width: TAB_WIDTH }]}
            activeOpacity={0.8}
            onPress={() => onTabPress('purchase', 1)}
          >
@@ -95,16 +108,42 @@ const Tender = () => {
            </Text>
          </TouchableOpacity>
        </View>
-        {/* Cart */}
+
        <View>
-          {SelectedPurchaseList.length && <View style={{ borderWidth: 2, borderColor: colors.white, backgroundColor: colors.primaryLight, position: 'absolute', borderRadius: 50, zIndex: 20, right: 0, top: -10, paddingHorizontal: 2 }}>
-            <Text style={{ fontSize: 12, color: colors.black }}>{SelectedPurchaseList.length}</Text>
-          </View>}
-          <TouchableOpacity style={{ padding: 10, backgroundColor: colors.primaryLight, borderRadius: 20 }} onPress={() => { Navigation.navigate(NavigationString.PurchaseTenderList) }}>
+          {SelectedPurchaseList.length ? (
+            <View
+              style={{
+                borderWidth: 2,
+                borderColor: colors.white,
+                backgroundColor: colors.primaryLight,
+                position: 'absolute',
+                borderRadius: 50,
+                zIndex: 20,
+                right: 0,
+                top: -10,
+                paddingHorizontal: 2,
+              }}
+            >
+              <Text style={{ fontSize: 12, color: colors.black }}>
+                {SelectedPurchaseList.length}
+              </Text>
+            </View>
+          ) : null}
+          <TouchableOpacity
+            style={{
+              padding: 10,
+              backgroundColor: colors.primaryLight,
+              borderRadius: 20,
+            }}
+            onPress={() => {
+              Navigation.navigate(NavigationString.PurchaseTenderList);
+            }}
+          >
            <ShoppingCart size={22} color={colors.black} strokeWidth={2} />
          </TouchableOpacity>
        </View>
      </View>
+
      {selectedTab === 'live' ? <LiveTender /> : <PurchaseTenderAllList />}
    </View>
  );
@@ -117,9 +156,12 @@ const styles = StyleSheet.create({
    flex: 1,
    backgroundColor: colors.white,
  },
-
-  /* ---------- Switch UI ---------- */
-
+  topRow: {
+    flexDirection: 'row',
+    justifyContent: 'space-around',
+    alignItems: 'center',
+    paddingHorizontal: 16,
+  },
  switchWrapper: {
    flexDirection: 'row',
    marginVertical: 14,
@@ -128,31 +170,25 @@ const styles = StyleSheet.create({
    padding: 2,
    height: TAB_HEIGHT,
  },
-
  tab: {
-    width: TAB_WIDTH,
    height: TAB_HEIGHT - 4,
    alignItems: 'center',
    justifyContent: 'center',
    zIndex: 2,
  },
-
  tabText: {
    fontSize: 14,
    color: '#64748b',
    lineHeight: 18,
-    fontFamily: FontsFamily.poppinsSemiBold
+    fontFamily: FontsFamily.poppinsSemiBold,
  },
-
  activeText: {
    color: colors.primary,
  },
-
  activeTab: {
    position: 'absolute',
    top: 2,
    left: 2,
-    width: TAB_WIDTH,
    height: TAB_HEIGHT - 4,
    backgroundColor: '#fff',
    borderRadius: 16,