| 1 |
<?php |
| 2 |
/** |
| 3 |
* Subscription Health page — interactive preview with sample data (shown when Pro is not active). |
| 4 |
* |
| 5 |
* @package SpringDevs\Subscription\Admin |
| 6 |
*/ |
| 7 |
|
| 8 |
defined( 'ABSPATH' ) || exit; |
| 9 |
|
| 10 |
$upgrade_url = 'https://wpsubscription.co/?utm_source=plugin&utm_medium=admin&utm_campaign=upgrade_pro'; |
| 11 |
$currency = function_exists( 'get_woocommerce_currency_symbol' ) ? get_woocommerce_currency_symbol() : '$'; |
| 12 |
|
| 13 |
$dummy_subs = array( |
| 14 |
array( |
| 15 |
'id' => 1042, |
| 16 |
'product' => 'Monthly Wellness Box', |
| 17 |
'customer' => 'Sarah Johnson', |
| 18 |
'email' => 'sarah.j@example.com', |
| 19 |
'amount' => 29.99, |
| 20 |
'period' => 'month', |
| 21 |
'renewal' => '2026-05-20', |
| 22 |
'days_since' => 18, |
| 23 |
'issue' => 'failed_payment', |
| 24 |
), |
| 25 |
array( |
| 26 |
'id' => 1087, |
| 27 |
'product' => 'Annual Premium Plan', |
| 28 |
'customer' => 'Marcus Williams', |
| 29 |
'email' => 'marcus.w@example.com', |
| 30 |
'amount' => 199.00, |
| 31 |
'period' => 'year', |
| 32 |
'renewal' => '2026-05-28', |
| 33 |
'days_since' => 10, |
| 34 |
'issue' => 'overdue_renewal', |
| 35 |
), |
| 36 |
array( |
| 37 |
'id' => 1103, |
| 38 |
'product' => 'Basic Weekly Kit', |
| 39 |
'customer' => 'Emma Clarke', |
| 40 |
'email' => 'emma.c@example.com', |
| 41 |
'amount' => 9.99, |
| 42 |
'period' => 'week', |
| 43 |
'renewal' => '2026-06-01', |
| 44 |
'days_since' => 6, |
| 45 |
'issue' => 'retry_needed', |
| 46 |
), |
| 47 |
array( |
| 48 |
'id' => 1124, |
| 49 |
'product' => 'Pro Content Access', |
| 50 |
'customer' => 'David Park', |
| 51 |
'email' => 'd.park@example.com', |
| 52 |
'amount' => 59.99, |
| 53 |
'period' => 'month', |
| 54 |
'renewal' => '2026-05-15', |
| 55 |
'days_since' => 23, |
| 56 |
'issue' => 'stalled_renewal', |
| 57 |
), |
| 58 |
array( |
| 59 |
'id' => 1155, |
| 60 |
'product' => 'Monthly Wellness Box', |
| 61 |
'customer' => 'Linda Zhao', |
| 62 |
'email' => 'linda.z@example.com', |
| 63 |
'amount' => 29.99, |
| 64 |
'period' => 'month', |
| 65 |
'renewal' => '2026-06-03', |
| 66 |
'days_since' => 4, |
| 67 |
'issue' => 'failed_payment', |
| 68 |
), |
| 69 |
array( |
| 70 |
'id' => 1189, |
| 71 |
'product' => 'Starter Bundle', |
| 72 |
'customer' => 'James O\'Brien', |
| 73 |
'email' => 'j.obrien@example.com', |
| 74 |
'amount' => 14.99, |
| 75 |
'period' => 'month', |
| 76 |
'renewal' => '2026-05-30', |
| 77 |
'days_since' => 8, |
| 78 |
'issue' => 'overdue_renewal', |
| 79 |
), |
| 80 |
); |
| 81 |
|
| 82 |
$revenue_at_risk = 0.0; |
| 83 |
foreach ( $dummy_subs as $s ) { |
| 84 |
$revenue_at_risk += $s['amount']; |
| 85 |
} |
| 86 |
|
| 87 |
$issue_badge_map = array( |
| 88 |
'failed_payment' => array( |
| 89 |
'mod' => 'expired', |
| 90 |
'label' => __( 'Payment failed', 'subscription' ), |
| 91 |
'tooltip' => __( 'The last payment attempt was declined.', 'subscription' ), |
| 92 |
), |
| 93 |
'overdue_renewal' => array( |
| 94 |
'mod' => 'pending-cancel', |
| 95 |
'label' => __( 'Overdue renewal', 'subscription' ), |
| 96 |
'tooltip' => __( 'The renewal date passed with no order created.', 'subscription' ), |
| 97 |
), |
| 98 |
'retry_needed' => array( |
| 99 |
'mod' => 'pending', |
| 100 |
'label' => __( 'Retry needed', 'subscription' ), |
| 101 |
'tooltip' => __( 'A payment failed and still needs a retry.', 'subscription' ), |
| 102 |
), |
| 103 |
'stalled_renewal' => array( |
| 104 |
'mod' => 'cancelled', |
| 105 |
'label' => __( 'Stalled renewal', 'subscription' ), |
| 106 |
'tooltip' => __( 'A renewal order has stayed pending too long.', 'subscription' ), |
| 107 |
), |
| 108 |
); |
| 109 |
?> |
| 110 |
|
| 111 |
<div class="wp-subscription-admin-content list-page subscrpt-subs-list"> |
| 112 |
|
| 113 |
<!-- Disclaimer banner --> |
| 114 |
<div style="background:#fffbeb;border:1px solid #fcd34d;border-radius:8px;padding:12px 16px;margin-bottom:20px;display:flex;align-items:flex-start;gap:10px;"> |
| 115 |
<svg width="18" height="18" fill="none" viewBox="0 0 24 24" stroke="#d97706" style="flex-shrink:0;margin-top:1px;" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg> |
| 116 |
<p style="margin:0;font-size:13px;color:#92400e;line-height:1.5;"> |
| 117 |
<strong><?php esc_html_e( 'Preview with sample data.', 'subscription' ); ?></strong> |
| 118 |
<?php esc_html_e( 'This page shows example data to illustrate the feature.', 'subscription' ); ?> |
| 119 |
<a href="<?php echo esc_url( $upgrade_url ); ?>" target="_blank" rel="noreferrer noopener" style="color:#b45309;font-weight:600;text-decoration:underline;"><?php esc_html_e( 'Upgrade to Pro', 'subscription' ); ?></a> |
| 120 |
<?php esc_html_e( 'to monitor and recover real subscriptions.', 'subscription' ); ?> |
| 121 |
</p> |
| 122 |
</div> |
| 123 |
|
| 124 |
<!-- Page header --> |
| 125 |
<div style="display:flex;align-items:flex-start;margin-bottom:20px;gap:24px;flex-wrap:wrap;"> |
| 126 |
|
| 127 |
<div style="flex:1;min-width:200px;"> |
| 128 |
<h1 style="font-size:1.375rem;font-weight:700;color:var(--wpsubs-text);margin:0 0 6px;line-height:1.2;"><?php esc_html_e( 'Subscription Health', 'subscription' ); ?></h1> |
| 129 |
<p style="font-size:13px;color:var(--wpsubs-text-muted);margin:0 0 12px;line-height:1.5;"> |
| 130 |
<?php esc_html_e( 'Monitor and recover subscriptions that need attention.', 'subscription' ); ?> |
| 131 |
</p> |
| 132 |
<div style="border-top:1px dashed #d0d3d7;padding-top:10px;display:flex;align-items:center;gap:8px;"> |
| 133 |
<button type="button" class="wpsubs-btn wpsubs-btn--outline" style="height:28px;padding:0 10px;font-size:12px;cursor:not-allowed;opacity:0.6;" disabled> |
| 134 |
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" /></svg> |
| 135 |
<?php esc_html_e( 'Refresh', 'subscription' ); ?> |
| 136 |
</button> |
| 137 |
</div> |
| 138 |
</div> |
| 139 |
|
| 140 |
<div style="display:flex;gap:12px;flex-shrink:0;"> |
| 141 |
<div style="width:140px;border:1px solid var(--wpsubs-border);border-radius:12px;padding:20px;background:var(--wpsubs-surface);"> |
| 142 |
<div style="display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px;"> |
| 143 |
<div style="font-size:1.875rem;font-weight:700;color:#111827;line-height:1;"><?php echo esc_html( count( $dummy_subs ) ); ?></div> |
| 144 |
<span style="display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background:#eef2ff;flex-shrink:0;color:#6366f1;"> |
| 145 |
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" /></svg> |
| 146 |
</span> |
| 147 |
</div> |
| 148 |
<div style="font-size:14px;font-weight:500;color:var(--wpsubs-text);"><?php esc_html_e( 'Subscriptions', 'subscription' ); ?></div> |
| 149 |
<div style="font-size:12px;color:var(--wpsubs-text-muted);margin-top:2px;"><?php esc_html_e( 'are at risk zone', 'subscription' ); ?></div> |
| 150 |
</div> |
| 151 |
<div style="width:180px;border:1px solid var(--wpsubs-border);border-radius:12px;padding:20px;background:var(--wpsubs-surface);"> |
| 152 |
<div style="display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px;"> |
| 153 |
<div style="font-size:1.875rem;font-weight:700;color:#ef4444;line-height:1;"><?php echo esc_html( $currency . number_format_i18n( $revenue_at_risk, 2 ) ); ?></div> |
| 154 |
<span style="display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background:#fef2f2;flex-shrink:0;color:#ef4444;"> |
| 155 |
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" /></svg> |
| 156 |
</span> |
| 157 |
</div> |
| 158 |
<div style="font-size:14px;font-weight:500;color:var(--wpsubs-text);"><?php esc_html_e( 'Revenue at Risk', 'subscription' ); ?></div> |
| 159 |
<div style="font-size:12px;color:var(--wpsubs-text-muted);margin-top:2px;"><?php esc_html_e( 'Across active issues', 'subscription' ); ?></div> |
| 160 |
</div> |
| 161 |
</div> |
| 162 |
</div> |
| 163 |
|
| 164 |
<!-- Toolbar --> |
| 165 |
<div class="wpsubs-toolbar" style="margin-top:16px;"> |
| 166 |
<?php |
| 167 |
wpsubs_render_adv_select( |
| 168 |
array( |
| 169 |
'name' => 'filter', |
| 170 |
'value' => 'all', |
| 171 |
'placeholder' => __( 'All issues', 'subscription' ), |
| 172 |
'align' => 'left', |
| 173 |
'options' => array( |
| 174 |
array( |
| 175 |
'value' => 'all', |
| 176 |
'label' => __( 'All issues', 'subscription' ), |
| 177 |
), |
| 178 |
array( |
| 179 |
'value' => 'overdue_renewal', |
| 180 |
'label' => __( 'Overdue Renewal', 'subscription' ), |
| 181 |
), |
| 182 |
array( |
| 183 |
'value' => 'failed_payment', |
| 184 |
'label' => __( 'Failed Payment', 'subscription' ), |
| 185 |
), |
| 186 |
array( |
| 187 |
'value' => 'retry_needed', |
| 188 |
'label' => __( 'Retry Needed', 'subscription' ), |
| 189 |
), |
| 190 |
array( |
| 191 |
'value' => 'stalled_renewal', |
| 192 |
'label' => __( 'Stalled Renewal', 'subscription' ), |
| 193 |
), |
| 194 |
array( |
| 195 |
'value' => 'skipped', |
| 196 |
'label' => __( 'Skipped', 'subscription' ), |
| 197 |
), |
| 198 |
), |
| 199 |
) |
| 200 |
); |
| 201 |
?> |
| 202 |
<div class="wpsubs-search"> |
| 203 |
<div class="wpsubs-input-wrap wpsubs-input-wrap--icon-l"> |
| 204 |
<svg class="wpsubs-input-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-4.35-4.35M17 11A6 6 0 105 11a6 6 0 0012 0z"/></svg> |
| 205 |
<input type="search" class="wpsubs-input" placeholder="<?php esc_attr_e( 'Search ID, product, customer...', 'subscription' ); ?>" disabled style="cursor:not-allowed;" /> |
| 206 |
</div> |
| 207 |
</div> |
| 208 |
<button type="button" class="wpsubs-btn wpsubs-btn--outline" disabled style="cursor:not-allowed;opacity:0.6;"><?php esc_html_e( 'Filter', 'subscription' ); ?></button> |
| 209 |
<div class="wpsubs-toolbar__spacer"></div> |
| 210 |
<?php |
| 211 |
wpsubs_render_adv_select( |
| 212 |
array( |
| 213 |
'name' => 'per_page', |
| 214 |
'value' => '20', |
| 215 |
'placeholder' => '20 per page', |
| 216 |
'align' => 'right', |
| 217 |
'options' => array( |
| 218 |
array( |
| 219 |
'value' => '10', |
| 220 |
'label' => __( '10 per page', 'subscription' ), |
| 221 |
), |
| 222 |
array( |
| 223 |
'value' => '20', |
| 224 |
'label' => __( '20 per page', 'subscription' ), |
| 225 |
), |
| 226 |
array( |
| 227 |
'value' => '50', |
| 228 |
'label' => __( '50 per page', 'subscription' ), |
| 229 |
), |
| 230 |
array( |
| 231 |
'value' => '100', |
| 232 |
'label' => __( '100 per page', 'subscription' ), |
| 233 |
), |
| 234 |
), |
| 235 |
) |
| 236 |
); |
| 237 |
wpsubs_render_adv_select( |
| 238 |
array( |
| 239 |
'name' => 'bulk_action', |
| 240 |
'value' => '', |
| 241 |
'placeholder' => __( 'Bulk actions', 'subscription' ), |
| 242 |
'align' => 'right', |
| 243 |
'options' => array( |
| 244 |
array( |
| 245 |
'value' => 'create_renewal', |
| 246 |
'label' => __( 'Create Renewal', 'subscription' ), |
| 247 |
), |
| 248 |
array( |
| 249 |
'value' => 'retry', |
| 250 |
'label' => __( 'Retry Payment', 'subscription' ), |
| 251 |
), |
| 252 |
array( |
| 253 |
'value' => 'send_email', |
| 254 |
'label' => __( 'Send Email', 'subscription' ), |
| 255 |
), |
| 256 |
array( 'divider' => true ), |
| 257 |
array( |
| 258 |
'value' => 'skip', |
| 259 |
'label' => __( 'Skip', 'subscription' ), |
| 260 |
'danger' => true, |
| 261 |
), |
| 262 |
), |
| 263 |
) |
| 264 |
); |
| 265 |
?> |
| 266 |
<span class="wpsubs-btn wpsubs-btn--outline" style="cursor:not-allowed;opacity:0.6;white-space:nowrap;"> |
| 267 |
<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true" style="flex-shrink:0;"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" /></svg> |
| 268 |
<?php esc_html_e( 'Export CSV', 'subscription' ); ?> |
| 269 |
</span> |
| 270 |
</div> |
| 271 |
|
| 272 |
<div class="wpsubs-table-card"> |
| 273 |
<table class="wpsubs-table"> |
| 274 |
<thead> |
| 275 |
<tr> |
| 276 |
<th class="wpsubs-col--check"> |
| 277 |
<input type="checkbox" class="wpsubs-checkbox" disabled /> |
| 278 |
</th> |
| 279 |
<th><?php esc_html_e( 'Subscription', 'subscription' ); ?></th> |
| 280 |
<th><?php esc_html_e( 'Customer', 'subscription' ); ?></th> |
| 281 |
<th style="white-space:nowrap;"><?php esc_html_e( 'Amount', 'subscription' ); ?></th> |
| 282 |
<th class="wpsubs-col--nowrap"><?php esc_html_e( 'Renew Date', 'subscription' ); ?></th> |
| 283 |
<th><?php esc_html_e( 'Renewal Order', 'subscription' ); ?></th> |
| 284 |
<th><?php esc_html_e( 'Issue', 'subscription' ); ?></th> |
| 285 |
<th class="wpsubs-col--actions"><?php esc_html_e( 'Actions', 'subscription' ); ?></th> |
| 286 |
</tr> |
| 287 |
</thead> |
| 288 |
<tbody> |
| 289 |
<?php foreach ( $dummy_subs as $sub ) : ?> |
| 290 |
<?php |
| 291 |
$name_parts = array_values( array_filter( explode( ' ', $sub['customer'] ) ) ); |
| 292 |
$initials = ''; |
| 293 |
foreach ( array_slice( $name_parts, 0, 2 ) as $part ) { |
| 294 |
$initials .= strtoupper( $part[0] ); |
| 295 |
} |
| 296 |
$color_slot = ord( strtolower( $initials[0] ?? 'a' ) ) % 8; |
| 297 |
$issue_cfg = $issue_badge_map[ $sub['issue'] ] ?? array( |
| 298 |
'mod' => 'cancelled', |
| 299 |
'label' => $sub['issue'], |
| 300 |
'tooltip' => '', |
| 301 |
); |
| 302 |
$days = (int) $sub['days_since']; |
| 303 |
$date_style = $days > 14 ? 'color:#dc2626;' : ( $days > 7 ? 'color:#f97316;' : '' ); |
| 304 |
?> |
| 305 |
<tr> |
| 306 |
<td class="wpsubs-col--check"> |
| 307 |
<input type="checkbox" class="wpsubs-checkbox" disabled /> |
| 308 |
</td> |
| 309 |
<td> |
| 310 |
<span class="wpsubs-cell-title" style="font-weight:600;"><?php echo esc_html( $sub['product'] ); ?></span> |
| 311 |
<span class="wpsubs-cell-id">#<?php echo esc_html( $sub['id'] ); ?></span> |
| 312 |
</td> |
| 313 |
<td> |
| 314 |
<div class="wpsubs-customer"> |
| 315 |
<div class="wpsubs-avatar" data-color="<?php echo (int) $color_slot; ?>"><?php echo esc_html( $initials ); ?></div> |
| 316 |
<div class="wpsubs-customer__info"> |
| 317 |
<span class="wpsubs-customer__name"><?php echo esc_html( $sub['customer'] ); ?></span> |
| 318 |
<span class="wpsubs-customer__sub"><?php echo esc_html( $sub['email'] ); ?></span> |
| 319 |
</div> |
| 320 |
</div> |
| 321 |
</td> |
| 322 |
<td style="white-space:nowrap;"> |
| 323 |
<span class="wpsubs-cell-title" style="font-variant-numeric:tabular-nums;"><?php echo esc_html( $currency . number_format_i18n( $sub['amount'], 2 ) ); ?></span> |
| 324 |
<span class="wpsubs-cell-id">/ <?php echo esc_html( $sub['period'] ); ?></span> |
| 325 |
</td> |
| 326 |
<td class="wpsubs-col--nowrap"> |
| 327 |
<span class="wpsubs-cell-title" style="font-weight:400;<?php echo esc_attr( $date_style ); ?>"><?php echo esc_html( $sub['renewal'] ); ?></span> |
| 328 |
<?php if ( $days > 0 ) : ?> |
| 329 |
<span class="wpsubs-cell-id"> |
| 330 |
<?php |
| 331 |
printf( |
| 332 |
/* translators: %d: days overdue */ |
| 333 |
esc_html__( '%d days overdue', 'subscription' ), |
| 334 |
(int) $days |
| 335 |
); |
| 336 |
?> |
| 337 |
</span> |
| 338 |
<?php endif; ?> |
| 339 |
</td> |
| 340 |
<td> |
| 341 |
<span class="wpsubs-badge wpsubs-badge--cancelled"><?php esc_html_e( 'Not created', 'subscription' ); ?></span> |
| 342 |
</td> |
| 343 |
<td> |
| 344 |
<span class="wpsubs-badge wpsubs-badge--<?php echo esc_attr( $issue_cfg['mod'] ); ?>" title="<?php echo esc_attr( $issue_cfg['tooltip'] ); ?>"> |
| 345 |
<?php echo esc_html( $issue_cfg['label'] ); ?> |
| 346 |
</span> |
| 347 |
</td> |
| 348 |
<td class="wpsubs-cell--actions"> |
| 349 |
<div class="wpsubs-row-actions"> |
| 350 |
<button type="button" class="wpsubs-row-actions__trigger" style="cursor:not-allowed;opacity:0.6;" disabled>···</button> |
| 351 |
</div> |
| 352 |
</td> |
| 353 |
</tr> |
| 354 |
<?php endforeach; ?> |
| 355 |
</tbody> |
| 356 |
</table> |
| 357 |
</div> |
| 358 |
|
| 359 |
</div> |
| 360 |
|
