352 lines
17 KiB
Smarty
352 lines
17 KiB
Smarty
<style>
|
|
.teaspeak-logo {
|
|
max-width: 200px;
|
|
height: auto;
|
|
margin: 1rem 0;
|
|
}
|
|
.status-badge {
|
|
font-size: 0.875rem;
|
|
padding: 0.375rem 0.75rem;
|
|
}
|
|
.server-info-card {
|
|
transition: box-shadow 0.3s ease;
|
|
}
|
|
.server-info-card:hover {
|
|
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
|
|
}
|
|
.action-btn {
|
|
min-width: 120px;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
function confirmAction(message) {
|
|
return confirm('Do you want to ' + message + '?');
|
|
}
|
|
</script>
|
|
|
|
<div class="container-fluid py-3">
|
|
<!-- Server Info & Connection -->
|
|
<div class="row g-3 mb-4">
|
|
<!-- Server Details -->
|
|
<div class="col-lg-6">
|
|
<div class="card server-info-card h-100">
|
|
<div class="card-header bg-primary text-white">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-server me-2"></i>{$lang.service|default:"Service"}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body text-center">
|
|
<img src="https://teaspeak.de/img/logo.png" alt="TeaSpeak Logo" class="teaspeak-logo">
|
|
<p class="text-muted mb-2"><em>{$groupname}</em></p>
|
|
<h5 class="mb-3">{$product}</h5>
|
|
<div class="alert alert-info mb-0">
|
|
<i class="fas fa-network-wired me-2"></i>
|
|
<strong>{$serverdata.ipaddress}:{$customfields.Port}</strong>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Connection Info -->
|
|
<div class="col-lg-6">
|
|
<div class="card server-info-card h-100">
|
|
<div class="card-header bg-success text-white">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-plug me-2"></i>{$lang.dconnect|default:"Connect"}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body text-center">
|
|
{if $settings.enabletsdns eq 1}
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">Connection Address:</h6>
|
|
<div class="alert alert-success">
|
|
<code class="fs-6">{$customfields.Subdomain}.{$settings.domaintsdns}</code>
|
|
</div>
|
|
</div>
|
|
<div class="d-grid gap-2">
|
|
<a href="teaclient://{$customfields.Subdomain}.{$settings.domaintsdns}"
|
|
class="btn btn-success btn-lg">
|
|
<i class="fas fa-desktop me-2"></i>{$lang.lconnect|default:"Launch Client"}
|
|
</a>
|
|
<a href="https://web.teaspeak.de/?connect_default=1&connect_address={$customfields.Subdomain}.{$settings.domaintsdns}"
|
|
target="_blank"
|
|
class="btn btn-outline-success">
|
|
<i class="fas fa-globe me-2"></i>{$lang.wconnect|default:"Web Client"}
|
|
</a>
|
|
</div>
|
|
{else}
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">Connection Address:</h6>
|
|
<div class="alert alert-success">
|
|
<code class="fs-6">{$serverdata.ipaddress}:{$customfields.Port}</code>
|
|
</div>
|
|
</div>
|
|
<div class="d-grid gap-2">
|
|
<a href="teaclient://{$serverdata.ipaddress}?port={$customfields.Port}"
|
|
class="btn btn-success btn-lg">
|
|
<i class="fas fa-desktop me-2"></i>{$lang.lconnect|default:"Launch Client"}
|
|
</a>
|
|
<a href="https://web.teaspeak.de/?connect_default=1&connect_address={$serverdata.ipaddress}:{$customfields.Port}"
|
|
target="_blank"
|
|
class="btn btn-outline-success">
|
|
<i class="fas fa-globe me-2"></i>{$lang.wconnect|default:"Web Client"}
|
|
</a>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Management & Controls -->
|
|
<div class="row g-3 mb-4">
|
|
<!-- Web Panel Info -->
|
|
<div class="col-lg-6">
|
|
<div class="card h-100">
|
|
<div class="card-header bg-info text-white">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-cog me-2"></i>{$lang.webpanel|default:"Web Panel"}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row mb-3">
|
|
<div class="col-4 text-end">
|
|
<strong>{$lang.hostname|default:"Hostname"}:</strong>
|
|
</div>
|
|
<div class="col-8">
|
|
{$serverdata.name}
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-4 text-end">
|
|
<strong>{$lang.management|default:"Management"}:</strong>
|
|
</div>
|
|
<div class="col-8">
|
|
<a href="https://panel.teaspeak.de/" target="_blank" class="btn btn-sm btn-outline-info">
|
|
<i class="fas fa-external-link-alt me-1"></i>{$lang.webinterface|default:"Web Interface"}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Server Controls -->
|
|
<div class="col-lg-6">
|
|
{if $hostteamspeak.status eq true}
|
|
<div class="card h-100">
|
|
<div class="card-header {if $hostteamspeak.vs.status eq true}bg-success{else}bg-danger{/if} text-white">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-sliders-h me-2"></i>{$LANG.cPanel.quickShortcuts|default:"Quick Actions"}
|
|
<span class="badge bg-light text-dark float-end status-badge">
|
|
{if $hostteamspeak.vs.status eq true}
|
|
<i class="fas fa-check-circle text-success me-1"></i>{$lang.online|default:"Online"}
|
|
{else}
|
|
<i class="fas fa-times-circle text-danger me-1"></i>{$lang.offline|default:"Offline"}
|
|
{/if}
|
|
</span>
|
|
</h5>
|
|
</div>
|
|
<div class="card-body text-center">
|
|
<div class="d-grid gap-2">
|
|
{if $hostteamspeak.vs.status eq false}
|
|
<a onclick="return confirmAction('start the server')"
|
|
href="clientarea.php?action=productdetails&id={$serviceid}&modop=custom&a=start_server"
|
|
class="btn btn-success action-btn">
|
|
<i class="fas fa-play me-2"></i>{$lang.start|default:"Start"}
|
|
</a>
|
|
{else}
|
|
<a onclick="return confirmAction('stop the server')"
|
|
href="clientarea.php?action=productdetails&id={$serviceid}&modop=custom&a=stop_server"
|
|
class="btn btn-danger action-btn">
|
|
<i class="fas fa-stop me-2"></i>{$lang.stop|default:"Stop"}
|
|
</a>
|
|
{/if}
|
|
<a onclick="return confirmAction('reinstall the server')"
|
|
href="clientarea.php?action=productdetails&id={$serviceid}&modop=custom&a=reinstall_server"
|
|
class="btn btn-warning action-btn">
|
|
<i class="fas fa-sync-alt me-2"></i>{$lang.reinstall|default:"Reinstall"}
|
|
</a>
|
|
<a onclick="return confirmAction('reset permissions')"
|
|
href="clientarea.php?action=productdetails&id={$serviceid}&modop=custom&a=perm_reset"
|
|
class="btn btn-primary action-btn">
|
|
<i class="fas fa-undo me-2"></i>{$lang.reset_permissions|default:"Reset Permissions"}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{elseif $hostteamspeak.status eq false}
|
|
<div class="card h-100">
|
|
<div class="card-body">
|
|
<div class="alert alert-danger text-center mb-0" role="alert">
|
|
<i class="fas fa-exclamation-triangle fa-2x mb-2"></i>
|
|
<h5>Server is {$lang.offline|default:"Offline"}</h5>
|
|
<p class="mb-0">Unable to connect to the server. Please contact support.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{else}
|
|
<div class="card h-100">
|
|
<div class="card-body">
|
|
<div class="alert alert-warning text-center mb-0" role="alert">
|
|
{if $suspendreason}
|
|
<strong>{$suspendreason}</strong>
|
|
<hr>
|
|
{/if}
|
|
<p class="mb-2">{$LANG.cPanel.packageNotActive|default:"Package not active"}: {$status}</p>
|
|
{if $systemStatus eq "Pending"}
|
|
<small>{$LANG.cPanel.statusPendingNotice|default:"Your order is pending activation."}</small>
|
|
{elseif $systemStatus eq "Suspended"}
|
|
<small>{$LANG.cPanel.statusSuspendedNotice|default:"Your service has been suspended."}</small>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Configuration & Custom Fields -->
|
|
<div class="row g-3 mb-4">
|
|
<!-- Configurable Options -->
|
|
{if $configurableoptions}
|
|
<div class="col-lg-4">
|
|
<div class="card h-100">
|
|
<div class="card-header bg-secondary text-white">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-cogs me-2"></i>{$LANG.orderconfigpackage|default:"Package Configuration"}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
{foreach from=$configurableoptions item=configoption}
|
|
<div class="row mb-2">
|
|
<div class="col-6 text-end">
|
|
<strong>{$configoption.optionname}:</strong>
|
|
</div>
|
|
<div class="col-6">
|
|
{if $configoption.optiontype eq 3}
|
|
<span class="badge bg-{if $configoption.selectedqty}success{else}secondary{/if}">
|
|
{if $configoption.selectedqty}{$LANG.yes|default:"Yes"}{else}{$LANG.no|default:"No"}{/if}
|
|
</span>
|
|
{elseif $configoption.optiontype eq 4}
|
|
{$configoption.selectedqty} x {$configoption.selectedoption}
|
|
{else}
|
|
{$configoption.selectedoption}
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
{/foreach}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
|
|
<!-- Custom Fields -->
|
|
{if $customfields}
|
|
<div class="col-lg-8">
|
|
<div class="card h-100">
|
|
<div class="card-header bg-dark text-white">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-info-circle me-2"></i>{$LANG.additionalInfo|default:"Additional Information"}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
{foreach from=$customfields key=key item=field}
|
|
{if $key neq "Subdomain"}
|
|
<div class="col-md-6 mb-3">
|
|
<div class="border-start border-primary border-4 ps-3">
|
|
<small class="text-muted text-uppercase">{$key}</small>
|
|
<div class="fw-bold">
|
|
{if empty($field)}
|
|
<span class="text-muted">{$LANG.blankCustomField|default:"Not Set"}</span>
|
|
{else}
|
|
{$field}
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
{/foreach}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
|
|
<!-- Billing Overview -->
|
|
<div class="row g-3">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header bg-primary text-white">
|
|
<h5 class="card-title mb-0">
|
|
<i class="fas fa-file-invoice-dollar me-2"></i>{$LANG.cPanel.billingOverview|default:"Billing Overview"}
|
|
</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
{if $firstpaymentamount neq $recurringamount}
|
|
<div class="row mb-2">
|
|
<div class="col-6 text-end">
|
|
<strong>{$LANG.firstpaymentamount|default:"First Payment"}:</strong>
|
|
</div>
|
|
<div class="col-6">
|
|
<span class="badge bg-info fs-6">{$firstpaymentamount}</span>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
{if $billingcycle != $LANG.orderpaymenttermonetime && $billingcycle != $LANG.orderfree}
|
|
<div class="row mb-2">
|
|
<div class="col-6 text-end">
|
|
<strong>{$LANG.recurringamount|default:"Recurring Amount"}:</strong>
|
|
</div>
|
|
<div class="col-6">
|
|
<span class="badge bg-primary fs-6">{$recurringamount}</span>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
<div class="row mb-2">
|
|
<div class="col-6 text-end">
|
|
<strong>{$LANG.orderbillingcycle|default:"Billing Cycle"}:</strong>
|
|
</div>
|
|
<div class="col-6">
|
|
{$billingcycle}
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-6 text-end">
|
|
<strong>{$LANG.orderpaymentmethod|default:"Payment Method"}:</strong>
|
|
</div>
|
|
<div class="col-6">
|
|
{$paymentmethod}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="row mb-2">
|
|
<div class="col-6 text-end">
|
|
<strong>{$LANG.clientareahostingregdate|default:"Registration Date"}:</strong>
|
|
</div>
|
|
<div class="col-6">
|
|
<i class="far fa-calendar-alt me-1"></i>{$regdate}
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-6 text-end">
|
|
<strong>{$LANG.clientareahostingnextduedate|default:"Next Due Date"}:</strong>
|
|
</div>
|
|
<div class="col-6">
|
|
<i class="far fa-calendar-check me-1"></i>{$nextduedate}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|