victorAnumudu
97 lines
5.5 KiB
React
97 lines
5.5 KiB
React
import getDateTimeFromDateString from "../../helpers/getDateTimeFromDateString";
|
|
import RouteLinks from "../../RouteLinks";
|
|
import Icons from "../Icons";
|
|
import {Link} from 'react-router-dom'
|
|
|
|
export default function CustomerSubscriptionsView({subscriptions}) {
|
|
return <>
|
|
<div className="pb-5">
|
|
<div className="flex flex-col gap-1">
|
|
<div className="w-full">
|
|
<h4 className="font-semibold text-lg">Subscriptions</h4>
|
|
</div>
|
|
<div className="w-full overflow-x-auto">
|
|
<>
|
|
<table className="py-2 w-full text-sm bg-[aliceblue] dark:bg-transparent rounded-[10px]">
|
|
<thead className="py-2 text-sm text-slate-500 text-left">
|
|
<tr>
|
|
<th scope="col" className="px-2 py-2">
|
|
#
|
|
</th>
|
|
<th scope="col" className="px-2">
|
|
Added
|
|
</th>
|
|
<th scope="col" className="px-2">
|
|
Product
|
|
</th>
|
|
<th scope="col" className="px-2">
|
|
URL / Templates
|
|
</th>
|
|
<th scope="col" className="px-2">
|
|
Status
|
|
</th>
|
|
<th scope="col" className="px-2 text-right">
|
|
Action
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{(subscriptions && subscriptions.length > 0) ? subscriptions?.map((item, index) => (
|
|
<tr key={index} className="py-2 border-t border-dashed border-slate-300">
|
|
<td className="px-2 py-2">
|
|
<div className="text-left">
|
|
<div className="text-base font-semibold">{index+1}</div>
|
|
</div>
|
|
</td>
|
|
<td className="px-2">
|
|
<div className="text-left">
|
|
<div className="text-base font-semibold">{getDateTimeFromDateString(item?.added)}</div>
|
|
</div>
|
|
</td>
|
|
<td className="px-2">
|
|
<div className="text-left">
|
|
<div className="text-base font-semibold">{item?.product_id}</div>
|
|
</div>
|
|
</td>
|
|
<td className="px-2">
|
|
<div className="text-left">
|
|
<div className="text-base font-semibold">{item?.internal_url}
|
|
<br /><span>Template :</span> {item?.product_template}
|
|
<br /><span>Custom :</span> {item?.custom_template}
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td className="px-2">
|
|
<div className="text-right">
|
|
<div className="text-base font-semibold">{item?.status}</div>
|
|
</div>
|
|
</td>
|
|
<td className="px-2 text-right">
|
|
<div className='flex items-center justify-end gap-3 md:gap-4'>
|
|
<div
|
|
className='p-2 flex justify-center items-center text-slate-500 bg-white-body dark:text-white-body dark:bg-black-body rounded-md'>
|
|
<Link to={`/subscription-view/${item?.subscription_uid}`} state={{customerID: item?.id, subscriptionUID: item?.subscription_uid}}>
|
|
<Icons name='eye'/>
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
))
|
|
:
|
|
<tr className="py-2 border-t border-dashed border-slate-300">
|
|
<td className="px-3 py-2" colSpan={6}>
|
|
<div className="flex justify-center items-center">
|
|
No Record Found
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
}
|
|
</tbody>
|
|
</table>
|
|
</>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</>
|
|
} |