Files
MermsFirstOffice/src/components/account_view/CustomerSubscriptionsView.jsx
T
CHIEFSOFT\ameye a9721991de Added links
2025-10-06 05:05:14 -04:00

121 lines
7.2 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/Updated
</th>
<th scope="col" className="px-2">
Product/Server
</th>
<th scope="col" className="px-2">
URL / EXT/ 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
className="text-base font-semibold">{getDateTimeFromDateString(item?.updated)}</div>
</div>
</td>
<td className="px-2">
<div className="text-left">
<div className="text-base font-semibold">{item?.product_id}</div>
<div><a href={`http://${item?.primary_server}:${item?.provision_port}`}
target='_blank'
rel="noreferrer">{item?.primary_server}:{item?.provision_port}</a>
</div>
</div>
</td>
<td className="px-2">
<div className="text-left">
<div className="text-base">
<span className="badge badge-pill badge-primary-inverse">
<a href={`https://${item?.internal_url}`}
target='_blank'
rel="noreferrer">{item?.internal_url}</a>
</span>
<br/>
<span className="badge badge-warning">
<a href={`https://${item?.external_url}`}
target='_blank'
rel="noreferrer">{item?.external_url}</a>
</span>
<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>
</>
}