seth
/
jam-cloud
mirror of https://bitbucket.org/jamkazam/jam-cloud.git
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

affiliate earnings page

This commit is contained in:
Nuwan 2024-05-17 14:15:19 +05:30
parent e878c64c3c
commit bbe83a008f
9 changed files with 260 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
jam-ui/src/components/affiliate/JKAffiliateEarnings.js Normal file
View File

@ -0,0 +1,66 @@
import React, { useState, useEffect } from 'react';
import { Card, CardBody, Table } from 'reactstrap';
import FalconCardHeader from '../common/FalconCardHeader';
import { useTranslation } from 'react-i18next';
import { getAffiliatePayments } from '../../helpers/rest';
import { monthName } from '../../helpers/utils';
import { getDisplayName } from '../../helpers/subscriptionHelper';
const JKAffiliateEarnings = () => {
const { t } = useTranslation('affiliate');
const [payments, setPayments] = useState([]);
const [loading, setLoading] = useState(false);
useEffect(() => {
setLoading(true);
getAffiliatePayments().then(resp => {
return resp.json();
}).then(data => {
console.log('payments', data);
setPayments(data.payments);
}).finally(() => {
setLoading(false);
});
}, []);
return (
<Card style={{ width: '50%' }} className="mx-auto affiliate-links">
<FalconCardHeader title={t('earnings.page_title')} titleClass="font-weight-semi-bold" />
<CardBody className="pt-3 pb-5">
{payments && payments.length === 0 && !loading ? (
<p>{t('earnings.no_data')}</p>
) : payments && payments.length > 0 && (
<Table className="table table-sm table-borderless">
<thead>
<tr>
<th>{t('earnings.list.header.date')}</th>
<th>{t('earnings.list.header.subscriptions')}</th>
<th>{t('earnings.list.header.jamtracks')}</th>
<th>{t('earnings.list.header.earnings')}</th>
</tr>
</thead>
<tbody>
{payments.map((payment, index) => (
<tr key={`${payment.year}-${payment.month}`}>
<td>{monthName(payment.month-1)} - {payment.year}</td>
<td>
{payment.subscriptions.map((subscription, index) => (
<div key={index}>
{getDisplayName(subscription.plan)} - {subscription.count}
</div>
))}
</td>
<td>{payment.jamtracks_sold}</td>
<td>${(payment.due_amount_in_cents/100).toFixed(2)}</td>
</tr>
))}
</tbody>
</Table>
)}
</CardBody>
</Card>
);
};
export default JKAffiliateEarnings;

2
jam-ui/src/components/dashboard/JKDashboardMain.js
View File

@ -45,6 +45,7 @@ import JKAffiliateProgram from '../affiliate/JKAffiliateProgram';
import JKAffiliatePayee from '../affiliate/JKAffiliatePayee';
import JKAffiliateLinks from '../affiliate/JKAffiliateLinks';
import JKAffiliateSignups from '../affiliate/JKAffiliateSignups';
import JKAffiliateEarnings from '../affiliate/JKAffiliateEarnings';
//import loadable from '@loadable/component';
@ -278,6 +279,7 @@ function JKDashboardMain() {
<PrivateRoute path="/affiliate/payee" component={JKAffiliatePayee} />
<PrivateRoute path="/affiliate/links" component={JKAffiliateLinks} />
<PrivateRoute path="/affiliate/signups" component={JKAffiliateSignups} />
<PrivateRoute path="/affiliate/earnings" component={JKAffiliateEarnings} />
{/*Redirect*/}
<Redirect to="/errors/404" />
</Switch>

22
jam-ui/src/components/page/JKAccountSubscription.js
View File

@ -8,6 +8,8 @@ import JKSubscriptionPlaytime from '../profile/JKSubscriptionPlaytime';
import { getSubscription } from '../../helpers/rest';
import { getDisplayName } from '../../helpers/subscriptionHelper';
const JKAccountSubscription = () => {
const { t } = useTranslation('account');
const [userPlan, setUserPlan] = useState(null);
@ -23,16 +25,16 @@ const JKAccountSubscription = () => {
});
}, []);
const getDisplayName = planCode => {
if (planCode == '') {
planCode = null;
}
const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
if (plan) {
return plan.name;
}
return `Unknown plan code=${planCode}`;
};
// const getDisplayName = planCode => {
// if (planCode == '') {
// planCode = null;
// }
// const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
// if (plan) {
// return plan.name;
// }
// return `Unknown plan code=${planCode}`;
// };
return (
<Card>

52
jam-ui/src/components/profile/JKSubscriptionPlan.js
View File

@ -10,6 +10,8 @@ import JKModalDialog from '../common/JKModalDialog';
import { getSubscription, changeSubscription } from '../../helpers/rest';
import { getDisplayNamePrice, getDisplayCycle } from '../../helpers/subscriptionHelper';
function JKSubscriptionPlan({ userPlan, setUserPlan, getDisplayName }) {
const { t } = useTranslation('account');
@ -62,32 +64,32 @@ function JKSubscriptionPlan({ userPlan, setUserPlan, getDisplayName }) {
setValue('plan_code', selectedOption.value);
};
const getDisplayNamePrice = planCode => {
if (planCode == '') {
planCode = null;
}
const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
if (plan) {
return plan.price;
}
return `Unknown plan code=${planCode}`;
};
// const getDisplayNamePrice = planCode => {
// if (planCode == '') {
// planCode = null;
// }
// const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
// if (plan) {
// return plan.price;
// }
// return `Unknown plan code=${planCode}`;
// };
const getDisplayCycle = planCode => {
if (planCode == '') {
planCode = null;
}
for (const subscriptionCode of window.gon.global.subscription_codes) {
if (planCode === subscriptionCode.id) {
if (subscriptionCode.cycle === 'year') {
return 'annual';
} else {
return subscriptionCode.cycle + 'ly';
}
}
}
return `Unknown plan code=${planCode}`;
};
// const getDisplayCycle = planCode => {
// if (planCode == '') {
// planCode = null;
// }
// for (const subscriptionCode of window.gon.global.subscription_codes) {
// if (planCode === subscriptionCode.id) {
// if (subscriptionCode.cycle === 'year') {
// return 'annual';
// } else {
// return subscriptionCode.cycle + 'ly';
// }
// }
// }
// return `Unknown plan code=${planCode}`;
// };
const onSubmit = () => {
const planCode = getValues('plan_code');

105
jam-ui/src/components/profile/JKSubscriptionPlaytime.js
View File

@ -2,6 +2,7 @@ import React, { useEffect, useState, useRef } from 'react';
import { Card, CardHeader, CardBody, Label } from 'reactstrap';
import { useTranslation } from 'react-i18next';
import { formatDateShort } from '../../helpers/utils';
import { planNameWithCycle, displayTime } from '../../helpers/subscriptionHelper';
function JKSubscriptionPlaytime({ userPlan, getDisplayName }) {
const { t } = useTranslation('account');
@ -11,67 +12,67 @@ function JKSubscriptionPlaytime({ userPlan, getDisplayName }) {
const [billingAddendum, setBillingAddendum] = useState(''); // [TODO: addendum to the warning message about billing, if needed]
const showPaymentInfoRef = useRef(false);
const displayTime = until_time => {
if (until_time < 0) return 'no time';
// const displayTime = until_time => {
// if (until_time < 0) return 'no time';
const untilTime = getTimeRemaining(until_time * 1000);
// const untilTime = getTimeRemaining(until_time * 1000);
let timeString = '';
if (untilTime.days !== 0) timeString += `${untilTime.days} days, `;
if (untilTime.hours !== 0 || timeString.length > 0) timeString += `${untilTime.hours} hours, `;
if (untilTime.minutes !== 0 || timeString.length > 0) timeString += `${untilTime.minutes} minutes `;
if (timeString === '') timeString = 'now!';
// let timeString = '';
// if (untilTime.days !== 0) timeString += `${untilTime.days} days, `;
// if (untilTime.hours !== 0 || timeString.length > 0) timeString += `${untilTime.hours} hours, `;
// if (untilTime.minutes !== 0 || timeString.length > 0) timeString += `${untilTime.minutes} minutes `;
// if (timeString === '') timeString = 'now!';
return timeString;
};
// return timeString;
// };
const getTimeRemaining = t => {
if (t < 0) t = -t;
// const getTimeRemaining = t => {
// if (t < 0) t = -t;
const seconds = Math.floor((t / 1000) % 60);
const minutes = Math.floor((t / 1000 / 60) % 60);
const hours = Math.floor((t / (1000 * 60 * 60)) % 24);
const days = Math.floor(t / (1000 * 60 * 60 * 24));
// const seconds = Math.floor((t / 1000) % 60);
// const minutes = Math.floor((t / 1000 / 60) % 60);
// const hours = Math.floor((t / (1000 * 60 * 60)) % 24);
// const days = Math.floor(t / (1000 * 60 * 60 * 24));
return {
total: t,
days: days,
hours: hours,
minutes: minutes,
seconds: seconds
};
};
// return {
// total: t,
// days: days,
// hours: hours,
// minutes: minutes,
// seconds: seconds
// };
// };
const getDisplayNamePrice = planCode => {
if (planCode == '') {
planCode = null;
}
const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
if (plan) {
return plan.price;
}
return `Unknown plan code=${planCode}`;
};
// const getDisplayNamePrice = planCode => {
// if (planCode == '') {
// planCode = null;
// }
// const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
// if (plan) {
// return plan.price;
// }
// return `Unknown plan code=${planCode}`;
// };
const getDisplayCycle = planCode => {
if (planCode == '') {
planCode = null;
}
for (const subscriptionCode of window.gon.global.subscription_codes) {
if (planCode === subscriptionCode.id) {
if (subscriptionCode.cycle === 'year') {
return 'annual';
} else {
return subscriptionCode.cycle + 'ly';
}
}
}
return `Unknown plan code=${planCode}`;
};
// const getDisplayCycle = planCode => {
// if (planCode == '') {
// planCode = null;
// }
// for (const subscriptionCode of window.gon.global.subscription_codes) {
// if (planCode === subscriptionCode.id) {
// if (subscriptionCode.cycle === 'year') {
// return 'annual';
// } else {
// return subscriptionCode.cycle + 'ly';
// }
// }
// }
// return `Unknown plan code=${planCode}`;
// };
const planNameWithCycle = planCode => {
return getDisplayName(planCode) + ' (' + getDisplayCycle(planCode) + ')';
};
// const planNameWithCycle = planCode => {
// return getDisplayName(planCode) + ' (' + getDisplayCycle(planCode) + ')';
// };
useEffect(() => {
if (userPlan) {

8
jam-ui/src/helpers/rest.js
View File

@ -352,6 +352,14 @@ export const getAffiliateSignups = (options = {}) => {
});
}
export const getAffiliatePayments = () => {
return new Promise((resolve, reject) => {
apiFetch(`/affiliate_partners/payments`)
.then(response => resolve(response))
.catch(error => reject(error))
});
}
export const postAffiliatePartnerData = (userId, params) => {
return new Promise((resolve, reject) => {
apiFetch(`/users/${userId}/affiliate_partner`, {

75
jam-ui/src/helpers/subscriptionHelper.js Normal file
View File

@ -0,0 +1,75 @@
export const getDisplayName = planCode => {
if (planCode == '') {
planCode = null;
}
const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
if (plan) {
return plan.name;
}
return `Unknown plan code=${planCode}`;
};
export const getDisplayNamePrice = planCode => {
if (planCode == '') {
planCode = null;
}
const plan = window.gon.global.subscription_codes.find(plan => plan.id === planCode);
if (plan) {
return plan.price;
}
return `Unknown plan code=${planCode}`;
};
export const getDisplayCycle = planCode => {
if (planCode == '') {
planCode = null;
}
for (const subscriptionCode of window.gon.global.subscription_codes) {
if (planCode === subscriptionCode.id) {
if (subscriptionCode.cycle === 'year') {
return 'annual';
} else {
return subscriptionCode.cycle + 'ly';
}
}
}
return `Unknown plan code=${planCode}`;
};
export const planNameWithCycle = planCode => {
return getDisplayName(planCode) + ' (' + getDisplayCycle(planCode) + ')';
};
export const displayTime = until_time => {
if (until_time < 0) return 'no time';
const untilTime = getTimeRemaining(until_time * 1000);
let timeString = '';
if (untilTime.days !== 0) timeString += `${untilTime.days} days, `;
if (untilTime.hours !== 0 || timeString.length > 0) timeString += `${untilTime.hours} hours, `;
if (untilTime.minutes !== 0 || timeString.length > 0) timeString += `${untilTime.minutes} minutes `;
if (timeString === '') timeString = 'now!';
return timeString;
};
const getTimeRemaining = t => {
if (t < 0) t = -t;
const seconds = Math.floor((t / 1000) % 60);
const minutes = Math.floor((t / 1000 / 60) % 60);
const hours = Math.floor((t / (1000 * 60 * 60)) % 24);
const days = Math.floor(t / (1000 * 60 * 60 * 24));
return {
total: t,
days: days,
hours: hours,
minutes: minutes,
seconds: seconds
};
};

4
jam-ui/src/helpers/utils.js
View File

@ -243,6 +243,10 @@ const months = new Array("January", "February", "March",
"April", "May", "June", "July", "August", "September",
"October", "November", "December");
export const monthName = (monthNumber) => {
return months[monthNumber];
}
export const formatDateShort = (dateString) => {
const date = dateString instanceof Date ? dateString : new Date(dateString);
return months[date.getMonth()] + ' ' + date.getDate() + ', ' + date.getFullYear();

13
jam-ui/src/i18n/locales/en/affiliate.json
View File

@ -77,5 +77,18 @@
"signups": "Signups"
}
}
},
"earnings": {
"page_title": "Earnings",
"no_data": "No earnings yet",
"load_more": "Load More",
"list": {
"header": {
"date": "Date",
"subscriptions": "Subscriptions",
"jamtracks": "JamTracks",
"earnings": "Earnings"
}
}
}
}