chenging ui design where needed
This commit is contained in:
@@ -7,8 +7,6 @@ import AppView from '../../components/AppView';
|
|||||||
import { apiCall } from '../../utils/ApiHelper';
|
import { apiCall } from '../../utils/ApiHelper';
|
||||||
import { BASE_URL } from '../../utils/ApiUrls';
|
import { BASE_URL } from '../../utils/ApiUrls';
|
||||||
|
|
||||||
// --- CONSTANTS ---
|
|
||||||
const API_BASE_URL = 'http://192.168.1.5:9060/api/payments';
|
|
||||||
|
|
||||||
// --- TYPE DEFINITIONS ---
|
// --- TYPE DEFINITIONS ---
|
||||||
interface ApiResponse<T> {
|
interface ApiResponse<T> {
|
||||||
@@ -26,9 +24,12 @@ interface Participant {
|
|||||||
contributionAmount: number;
|
contributionAmount: number;
|
||||||
paidAmount: number;
|
paidAmount: number;
|
||||||
payAmount?: number;
|
payAmount?: number;
|
||||||
status: 'SUCCESS' | 'PENDING';
|
status: 'SUCCESS' | 'PENDING' | 'FAILED' | 'UNPAID';
|
||||||
lateFee: number;
|
lateFee: number;
|
||||||
lateFeeWaived: boolean;
|
lateFeeWaived: boolean;
|
||||||
|
totalPaidAmount: string;
|
||||||
|
expectedAmount: number;
|
||||||
|
waivedAmount:number
|
||||||
}
|
}
|
||||||
|
|
||||||
interface PaymentDetails {
|
interface PaymentDetails {
|
||||||
@@ -80,10 +81,11 @@ const Payments: React.FC = () => {
|
|||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await apiCall(`${BASE_URL}payments/current/payment/details/${groupId}`, 'GET') as ApiResponse<PaymentDetails>;
|
const response = await apiCall(`${BASE_URL}payments/current/payment/details/${groupId}`, 'GET') as ApiResponse<PaymentDetails>;
|
||||||
|
// console.log("fchffryjtc", response)
|
||||||
if (response && response.statusCode === 200) {
|
if (response && response.statusCode === 200) {
|
||||||
setPaymentDetails(response.data);
|
setPaymentDetails(response.data);
|
||||||
} else if (response && response.statusCode === 400) {
|
} else if (response && response.statusCode === 400) {
|
||||||
|
|
||||||
setIsGroupActive(false);
|
setIsGroupActive(false);
|
||||||
setPaymentDetails(null);
|
setPaymentDetails(null);
|
||||||
} else {
|
} else {
|
||||||
@@ -118,10 +120,11 @@ const Payments: React.FC = () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const handleWaiveFee = async () => {
|
const handleWaiveFee = async () => {
|
||||||
if (!currentParticipant || !paymentDetails) return;
|
console.log("first approch ")
|
||||||
|
// if (!currentParticipant || !paymentDetails) console.log("second approch ") ;
|
||||||
|
|
||||||
const amountToWaive = parseFloat(waiverAmount);
|
const amountToWaive = parseFloat(waiverAmount);
|
||||||
|
|
||||||
if (isNaN(amountToWaive) || amountToWaive < 0) {
|
if (isNaN(amountToWaive) || amountToWaive < 0) {
|
||||||
ToastAndroid.show("Please enter a valid waiver amount.", ToastAndroid.SHORT);
|
ToastAndroid.show("Please enter a valid waiver amount.", ToastAndroid.SHORT);
|
||||||
return;
|
return;
|
||||||
@@ -133,8 +136,10 @@ const Payments: React.FC = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const url = `https://api.godemo.in/FundCollect/api/payments/groups/${groupId}/cycles/${paymentDetails.currentCycle}/waive/${currentParticipant.userId}?amountToWaive=${amountToWaive}`;
|
const url = `${BASE_URL}payments/groups/${groupId}/cycles/${paymentDetails.currentCycle}/waive/${currentParticipant.userId}?amountToWaive=${amountToWaive}`;
|
||||||
|
|
||||||
const response = await apiCall(url, 'PUT', {}) as any;
|
const response = await apiCall(url, 'PUT', {}) as any;
|
||||||
|
console.log("vtitttit hbfbf sjbj j b", response)
|
||||||
|
|
||||||
if (response && response.statusCode === 200) {
|
if (response && response.statusCode === 200) {
|
||||||
ToastAndroid.show(`₹${amountToWaive} has been waived successfully.`, ToastAndroid.SHORT);
|
ToastAndroid.show(`₹${amountToWaive} has been waived successfully.`, ToastAndroid.SHORT);
|
||||||
@@ -151,29 +156,45 @@ const Payments: React.FC = () => {
|
|||||||
|
|
||||||
// --- RENDER LOGIC ---
|
// --- RENDER LOGIC ---
|
||||||
const renderParticipant = (participant: Participant) => {
|
const renderParticipant = (participant: Participant) => {
|
||||||
const isPending = participant.status === 'PENDING';
|
const isPending = participant.status === 'UNPAID';
|
||||||
const canWaive = isPending && participant.lateFee > 0 && !participant.lateFeeWaived;
|
const canWaive = participant.lateFee > 0 && isPending
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View key={participant.userId} style={styles.participantCard}>
|
<View key={participant.userId} style={styles.participantCard}>
|
||||||
<View style={styles.participantInfo}>
|
<View style={styles.participantInfo}>
|
||||||
<Text style={styles.participantName}>{participant.firstName} {participant.lastName}</Text>
|
<Text style={styles.participantName}>{participant.firstName} {participant.lastName}</Text>
|
||||||
<Text style={styles.participantMobile}>{participant.mobile}</Text>
|
<Text style={styles.participantMobile}>{participant.mobile}</Text>
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
<View style={styles.paymentStatus}>
|
<View style={styles.paymentStatus}>
|
||||||
<Text style={[styles.statusText, { color: isPending ? colors.warning : colors.success }]}>
|
<Text style={[styles.statusText, {
|
||||||
|
color: participant.status === "PENDING"
|
||||||
|
? colors.warning
|
||||||
|
: participant.status === "FAILED"
|
||||||
|
? 'red'
|
||||||
|
: participant.status === "UNPAID" ? '#f68a89' : colors.success
|
||||||
|
}]}>
|
||||||
{participant.status}
|
{participant.status}
|
||||||
</Text>
|
</Text>
|
||||||
<Text style={styles.amountText}>
|
{participant.status === "UNPAID" && <Text style={styles.amountText}>
|
||||||
{isPending ? `₹${participant.payAmount || 0}` : `₹${participant.paidAmount}`}
|
{`₹${participant?.expectedAmount} `}
|
||||||
</Text>
|
</Text>}
|
||||||
{isPending && participant.lateFee > 0 && (
|
{participant.status === "SUCCESS" && <Text style={styles.amountText}>
|
||||||
|
{`₹${participant?.totalPaidAmount}`}
|
||||||
|
</Text>}
|
||||||
|
|
||||||
|
{/* <Text style={styles.amountText}>
|
||||||
|
{isPending ? `₹${participant.payAmount || 0}` : `₹${participant.totalPaidAmount}`}
|
||||||
|
</Text> */}
|
||||||
|
{participant.lateFee > 0 && (
|
||||||
<Text style={styles.lateFeeText}>Late Fee: ₹{participant.lateFee}</Text>
|
<Text style={styles.lateFeeText}>Late Fee: ₹{participant.lateFee}</Text>
|
||||||
)}
|
)}
|
||||||
{participant.lateFeeWaived && <Text style={styles.waivedText}>Fee Waived</Text>}
|
{/* {participant.lateFeeWaived && <Text style={styles.waivedText}>Fee Waived</Text>} */}
|
||||||
|
{
|
||||||
|
participant?.lateFeeWaived && <Text>Waived Amount : {participant?.waivedAmount}</Text>
|
||||||
|
}
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
<View style={styles.menuContainer}>
|
<View style={styles.menuContainer}>
|
||||||
{canWaive && (
|
{canWaive && (
|
||||||
<TouchableOpacity onPress={() => openWaiverDialog(participant)}>
|
<TouchableOpacity onPress={() => openWaiverDialog(participant)}>
|
||||||
@@ -184,7 +205,7 @@ const Payments: React.FC = () => {
|
|||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<AppView paddingHorizontal={0}>
|
<AppView paddingHorizontal={0}>
|
||||||
<Modal
|
<Modal
|
||||||
@@ -219,7 +240,7 @@ const Payments: React.FC = () => {
|
|||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
{loading && !refreshing ? (
|
{loading && !refreshing ? (
|
||||||
<ActivityIndicator style={{marginTop: 50}} size="large" color={colors.primary} />
|
<ActivityIndicator style={{ marginTop: 50 }} size="large" color={colors.primary} />
|
||||||
) : !isGroupActive ? (
|
) : !isGroupActive ? (
|
||||||
<View style={styles.fullScreenMessage}>
|
<View style={styles.fullScreenMessage}>
|
||||||
<Ionicons name="warning-outline" size={40} color={colors.black} />
|
<Ionicons name="warning-outline" size={40} color={colors.black} />
|
||||||
@@ -247,7 +268,7 @@ const Payments: React.FC = () => {
|
|||||||
</View>
|
</View>
|
||||||
<View style={styles.summaryBox}>
|
<View style={styles.summaryBox}>
|
||||||
<Text style={styles.summaryLabel}>Contribution</Text>
|
<Text style={styles.summaryLabel}>Contribution</Text>
|
||||||
<Text style={styles.summaryValue}>₹{paymentDetails.contributionAmount}</Text>
|
<Text style={styles.summaryValue}>₹ {paymentDetails.contributionAmount}</Text>
|
||||||
</View>
|
</View>
|
||||||
<View style={styles.summaryBox}>
|
<View style={styles.summaryBox}>
|
||||||
<Text style={styles.summaryLabel}>Total Amount</Text>
|
<Text style={styles.summaryLabel}>Total Amount</Text>
|
||||||
@@ -255,8 +276,8 @@ const Payments: React.FC = () => {
|
|||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
<Text style={styles.sectionTitle}>Participants</Text>
|
<Text style={styles.sectionTitle}>Participants</Text>
|
||||||
{ paymentDetails?.cycleCompleted &&
|
{paymentDetails?.cycleCompleted &&
|
||||||
<Text style={{ marginLeft: 20, marginBottom: 10, color: '#6c757d' }}>Next Cycle from : {paymentDetails?.nextCycleStart}</Text>
|
<Text style={{ marginLeft: 20, marginBottom: 10, color: '#6c757d' }}>Next Cycle from : {paymentDetails?.nextCycleStart}</Text>
|
||||||
}{paymentDetails.participants.map(renderParticipant)}
|
}{paymentDetails.participants.map(renderParticipant)}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -212,10 +212,10 @@ const Notification = () => {
|
|||||||
{/* Header with actions */}
|
{/* Header with actions */}
|
||||||
<Header
|
<Header
|
||||||
title={`Notifications ${unreadCount > 0 ? `(${unreadCount})` : ''}`} arrowColor='#000' titleColor='#000'/>
|
title={`Notifications ${unreadCount > 0 ? `(${unreadCount})` : ''}`} arrowColor='#000' titleColor='#000'/>
|
||||||
<View style={styles.headerActions}>
|
{/* <View style={styles.headerActions}>
|
||||||
{unreadCount > 0 && (
|
{unreadCount > 0 && (
|
||||||
<LinearGradient
|
<LinearGradient
|
||||||
colors={[colors.primary, colors.pastelPink]} // Pastel Green gradient
|
colors={[colors.primary, colors.primary]} // Pastel Green gradient
|
||||||
style={[styles.headerButton, styles.markReadButton]}>
|
style={[styles.headerButton, styles.markReadButton]}>
|
||||||
<TouchableOpacity onPress={handleMarkAllAsRead}>
|
<TouchableOpacity onPress={handleMarkAllAsRead}>
|
||||||
<Text style={styles.headerButtonText}>Mark All Read</Text>
|
<Text style={styles.headerButtonText}>Mark All Read</Text>
|
||||||
@@ -224,14 +224,14 @@ const Notification = () => {
|
|||||||
)}
|
)}
|
||||||
{notifications.length > 0 && (
|
{notifications.length > 0 && (
|
||||||
<LinearGradient
|
<LinearGradient
|
||||||
colors={[colors.pastelPink, colors.pastelBlue]} // Pastel Pink to Pastel Orange gradient
|
colors={[colors.pastelPink, colors.primary]} // Pastel Pink to Pastel Orange gradient
|
||||||
style={styles.headerButton}>
|
style={styles.headerButton}>
|
||||||
<TouchableOpacity onPress={handleClearAll}>
|
<TouchableOpacity onPress={handleClearAll}>
|
||||||
<Text style={styles.headerButtonText}>Clear All</Text>
|
<Text style={styles.headerButtonText}>Clear All</Text>
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
</LinearGradient>
|
</LinearGradient>
|
||||||
)}
|
)}
|
||||||
</View>
|
</View> */}
|
||||||
|
|
||||||
{/* Notification List */}
|
{/* Notification List */}
|
||||||
<FlatList
|
<FlatList
|
||||||
|
|||||||
@@ -57,7 +57,7 @@ const formatINR = (amount: number) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const StatusBadge: React.FC<{ status?: string }> = ({ status }) => {
|
const StatusBadge: React.FC<{ status?: string }> = ({ status }) => {
|
||||||
const text = status ?? "UNKNOWN";
|
const text = status ?? "FAILED";
|
||||||
const color =
|
const color =
|
||||||
text === "SUCCESS" ? styles.statusSuccess : text === "PENDING" ? styles.statusPending : styles.statusFailed;
|
text === "SUCCESS" ? styles.statusSuccess : text === "PENDING" ? styles.statusPending : styles.statusFailed;
|
||||||
|
|
||||||
@@ -142,10 +142,7 @@ const TransactionsList: React.FC = () => {
|
|||||||
return (
|
return (
|
||||||
<AppView>
|
<AppView>
|
||||||
<Header title="transactions" titleColor={colors.Home} arrowColor={colors.Home} />
|
<Header title="transactions" titleColor={colors.Home} arrowColor={colors.Home} />
|
||||||
|
|
||||||
<Text style={styles.headerTitle}>{message}</Text>
|
<Text style={styles.headerTitle}>{message}</Text>
|
||||||
|
|
||||||
|
|
||||||
<FlatList
|
<FlatList
|
||||||
data={transactions}
|
data={transactions}
|
||||||
keyExtractor={(item) => item.id}
|
keyExtractor={(item) => item.id}
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
|
|
||||||
// export const BASE_URL = "https://11.godemo.in/FundCollect/api/"
|
// export const BASE_URL = "https://11.godemo.in/FundCollect/api/"
|
||||||
export const BASE_URL = "http://192.168.1.8:9060/api/"
|
export const BASE_URL = "http://192.168.1.5:9060/api/"
|
||||||
export const LOGIN_URL = `${BASE_URL}user/generate/otp?mobiles=`
|
export const LOGIN_URL = `${BASE_URL}user/generate/otp?mobiles=`
|
||||||
export const VARIFY_OTP_URL = `${BASE_URL}user/otp/verify`
|
export const VARIFY_OTP_URL = `${BASE_URL}user/otp/verify`
|
||||||
export const ORGRAGISTRATION = `${BASE_URL}organizer/registration/apply`
|
export const ORGRAGISTRATION = `${BASE_URL}organizer/registration/apply`
|
||||||
|
|||||||
Reference in New Issue
Block a user