Diff -- /var/www/vhosts/webstls.com/httpdocs/TEMPLATES/webstls

1

<!-- Seller-side recent-orders list with refund actions. Backed by

2

/orders.cgi (read) + /orders_action.cgi (action). -->

3

4

5

<div>

6

<span class="page-eyebrow"><span class="dot"></span> Reporting · Orders</span>

7

<h1 class="page-title">Recent orders</h1>

8

<p class="page-subtitle">Last 50 paid + pending orders across every storefront you own. For full revenue + cohort analysis use <a href="/sales_reports.cgi" class="text-brand">Sales Reports</a>.</p>

9

</div>

10

</div>

11

12

[if:$has_flash]

13

14

15

<div class="text-sm fw-600">$flash_msg</div>

16

</div>

17

[/if]

18

19

[if:$has_orders]

20

21

22

23

<thead>

24

<tr>

25

<th>Order</th>

26

<th>Placed</th>

27

<th>Storefront</th>

28

<th>Buyer</th>

29

<th class="num">Total</th>

30

<th>Status</th>

31

32

</tr>

33

</thead>

34

<tbody>

35

[loop:@orders]

36

<tr>

37

38

<td class="text-xs">$loop1.placed_at</td>

39

<td class="text-xs">$loop1.store_name</td>

40

<td class="text-xs">$loop1.buyer_email</td>

41

<td class="num">$loop1.total_display</td>

42

<td>

43

[if:$loop1.is_paid]<span class="pill paid">Paid</span>[/if]

44

[if:$loop1.is_pending]<span class="pill open">Pending</span>[/if]

45

[if:$loop1.is_failed]<span class="pill failed">Failed</span>[/if]

46

[if:$loop1.is_refunded]<span class="pill refunded">$loop1.status_label</span>[/if]

47

[if:$loop1.requires_shipping]<span class="pill" style="background:rgba(217,119,6,0.15);color:#f59e0b;margin-left:4px">Ships</span>[/if]

48

</td>

49

50

[if:$loop1.can_refund_now]

51

<form method="POST" action="/orders_action.cgi" style="margin:0;display:inline-block"

52

data-confirm-title="Issue a FULL refund for order #$loop1.id?"

53

data-confirm-message="Refund amount: $loop1.total_display. This unwinds the platform fee and the seller payout via Stripe. The buyer is notified."

54

data-confirm-label="Refund order"

55

data-confirm-style="danger">

56

57

58

59

60

<button type="submit" class="btn btn-danger btn-sm" style="font-size:11px;padding:5px 10px">Refund</button>

61

</form>

62

<form method="POST" action="/orders_action.cgi" style="margin:0;display:inline-block"

63

class="js-credit-buyer-form"

64

data-order-id="$loop1.id"

65

data-order-total-cents="$loop1.total_amount_cents"

66

data-order-total-display="$loop1.total_display"

67

data-buyer-email="$loop1.buyer_email">

68

69

70

71

72

73

<button type="button" class="btn btn-secondary btn-sm js-credit-buyer" style="font-size:11px;padding:5px 10px">Credit buyer</button>

74

</form>

75

[/if]

76

</td>

77

</tr>

78

[if:$loop1.requires_shipping]

79

<tr>

80

81

82

<div>

83

84

<div class="text-xs" style="line-height:1.6">$loop1.ship_address_html</div>

85

[if:$loop1.ship_phone]<div class="text-xs text-dim" style="margin-top:4px">Phone: $loop1.ship_phone</div>[/if]

86

<div class="text-xs text-dim" style="margin-top:6px">$loop1.ship_zone · $loop1.ship_cost_display</div>

87

</div>

88

<div>

89

<div class="text-xs" style="color:var(--col-text-3);text-transform:uppercase;letter-spacing:1px;font-weight:700;margin-bottom:6px">Items to fulfill</div>

90

[loop:@lines]

91

92

93

94

<div class="text-sm fw-600" style="color:#fff">$loop2.title <span class="text-dim" style="font-weight:400">x$loop2.quantity</span></div>

95

[if:$loop2.variant_pill]<div class="text-xs text-dim">$loop2.variant_pill</div>[/if]

96

</div>

97

<div>

98

[if:$loop2.is_shipped]<span class="pill paid">$loop2.fulfillment_label</span>[/if]

99

[if:!$loop2.is_shipped][if:$loop2.is_physical]<span class="pill open">$loop2.fulfillment_label</span>[/if][/if]

100

</div>

101

</div>

102

[if:$loop2.is_shipped]

103

<div class="text-xs text-dim" style="margin-top:6px">Tracking: $loop2.tracking_carrier $loop2.tracking_number</div>

104

[/if]

105

[if:$loop2.can_mark_shipped]

106

107

108

109

110

111

112

<button type="submit" class="btn btn-primary btn-sm" style="font-size:11px;padding:6px 14px">Mark shipped</button>

113

</form>

114

[/if]

115

</div>

116

[/loop]

117

</div>

118

</div>

119

</td>

120

</tr>

121

[/if]

122

[/loop]

123

</tbody>

124

</table>

125

</div>

126

</div>

127

128

[if:!$can_refund]

129

130

131

<div class="text-xs">You can view orders but not issue refunds. Ask the storefront owner to grant you the <strong>Issue refunds</strong> permission on a custom role to enable the action.</div>

132

</div>

133

[/if]

134

[/if]

135

136

[if:$no_orders]

137

138

<div class="text-sm fw-600" style="color:#fff;margin-bottom:6px">No orders yet</div>

139

<div class="text-xs text-dim">Once a buyer checks out on any of your storefronts, the order will appear here in real time.</div>

140

</div>

141

[/if]

142

143

144

// "Credit buyer" flow: prompt for amount (default = order total) and note,

145

// confirm, submit. Order stays paid; this adds a positive credit row to the

146

// buyer's ledger for use on a future order.

147

document.addEventListener('click', function (e) {

148

var btn = e.target.closest('.js-credit-buyer');

149

if (!btn) return;

150

e.preventDefault();

151

var form = btn.closest('.js-credit-buyer-form');

152

if (!form) return;

153

var oid = form.getAttribute('data-order-id') || '';

154

var totalC = form.getAttribute('data-order-total-cents') || '';

155

var totalD = form.getAttribute('data-order-total-display') || '';

156

var email = form.getAttribute('data-buyer-email') || 'this buyer';

157

appPrompt({

158

title: 'Credit ' + email + ' for order #' + oid,

159

message: 'Amount in cents. Defaults to the order total (' + totalD + ').',

160

placeholder: totalC,

161

default_value: totalC,

162

input_type: 'number',

163

label: 'Next',

164

required: true,

165

validate: function (v) {

166

if (!/^[0-9]+\$/.test(v)) return 'Whole-cent integer required.';

167

if (parseInt(v, 10) <= 0) return 'Must be greater than zero.';

168

return '';

169

}

170

}).then(function (amt) {

171

if (amt === null) return;

172

appPrompt({

173

title: 'Note to the buyer',

174

message: 'Shown to the buyer in their credit history.',

175

placeholder: 'Sorry the model did not work out!',

176

default_value: 'Store credit for order #' + oid,

177

label: 'Next',

178

required: true

179

}).then(function (note) {

180

if (note === null) return;

181

var dollars = (parseInt(amt, 10) / 100).toFixed(2);

182

appConfirm({

183

title: 'Credit \$' + dollars + ' to ' + email + '?',

184

message: 'The order itself stays paid; this adds store credit they can use on their next order.',

185

confirm_label: 'Credit buyer',

186

confirm_style: 'success'

187

}).then(function (ok) {

188

if (!ok) return;

189

form.querySelector('input[name="amount_cents"]').value = amt;

190

form.querySelector('input[name="note"]').value = note;

191

form.submit();

192

});

193

});

194

});

195

});

196

</script>

	1	<!-- Seller-side recent-orders list with refund actions. Backed by
	2	/orders.cgi (read) + /orders_action.cgi (action). -->
	3
	4	<div class="page-head">
	5	<div>
	6	<span class="page-eyebrow"><span class="dot"></span> Reporting · Orders</span>
	7	<h1 class="page-title">Recent orders</h1>
	8	<p class="page-subtitle">Last 50 paid + pending orders across every storefront you own. For full revenue + cohort analysis use <a href="/sales_reports.cgi" class="text-brand">Sales Reports</a>.</p>
	9	</div>
	10	</div>
	11
	12	[if:$has_flash]
	13	<div class="banner $flash_kind mb-3">
	14	<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/></svg>
	15	<div class="text-sm fw-600">$flash_msg</div>
	16	</div>
	17	[/if]
	18
	19	[if:$has_orders]
	20	<div class="module">
	21	<div class="module-body">
	22	<table class="bil-itable" style="width:100%">
	23	<thead>
	24	<tr>
	25	<th>Order</th>
	26	<th>Placed</th>
	27	<th>Storefront</th>
	28	<th>Buyer</th>
	29	<th class="num">Total</th>
	30	<th>Status</th>
	31	<th></th>
	32	</tr>
	33	</thead>
	34	<tbody>
	35	[loop:@orders]
	36	<tr>
	37	<td><strong style="color:#fff">#$loop1.id</strong></td>
	38	<td class="text-xs">$loop1.placed_at</td>
	39	<td class="text-xs">$loop1.store_name</td>
	40	<td class="text-xs">$loop1.buyer_email</td>
	41	<td class="num">$loop1.total_display</td>
	42	<td>
	43	[if:$loop1.is_paid]<span class="pill paid">Paid</span>[/if]
	44	[if:$loop1.is_pending]<span class="pill open">Pending</span>[/if]
	45	[if:$loop1.is_failed]<span class="pill failed">Failed</span>[/if]
	46	[if:$loop1.is_refunded]<span class="pill refunded">$loop1.status_label</span>[/if]
	47	[if:$loop1.requires_shipping]<span class="pill" style="background:rgba(217,119,6,0.15);color:#f59e0b;margin-left:4px">Ships</span>[/if]
	48	</td>
	49	<td style="white-space:nowrap">
	50	[if:$loop1.can_refund_now]
	51	<form method="POST" action="/orders_action.cgi" style="margin:0;display:inline-block"
	52	data-confirm-title="Issue a FULL refund for order #$loop1.id?"
	53	data-confirm-message="Refund amount: $loop1.total_display. This unwinds the platform fee and the seller payout via Stripe. The buyer is notified."
	54	data-confirm-label="Refund order"
	55	data-confirm-style="danger">
	56	<input type="hidden" name="act" value="refund_order">
	57	<input type="hidden" name="order_id" value="$loop1.id">
	58	<input type="hidden" name="reason" value="requested_by_customer">
	59	<input type="hidden" name="return_to" value="/orders.cgi">
	60	<button type="submit" class="btn btn-danger btn-sm" style="font-size:11px;padding:5px 10px">Refund</button>
	61	</form>
	62	<form method="POST" action="/orders_action.cgi" style="margin:0;display:inline-block"
	63	class="js-credit-buyer-form"
	64	data-order-id="$loop1.id"
	65	data-order-total-cents="$loop1.total_amount_cents"
	66	data-order-total-display="$loop1.total_display"
	67	data-buyer-email="$loop1.buyer_email">
	68	<input type="hidden" name="act" value="credit_buyer">
	69	<input type="hidden" name="order_id" value="$loop1.id">
	70	<input type="hidden" name="amount_cents" value="">
	71	<input type="hidden" name="note" value="">
	72	<input type="hidden" name="return_to" value="/orders.cgi">
	73	<button type="button" class="btn btn-secondary btn-sm js-credit-buyer" style="font-size:11px;padding:5px 10px">Credit buyer</button>
	74	</form>
	75	[/if]
	76	</td>
	77	</tr>
	78	[if:$loop1.requires_shipping]
	79	<tr>
	80	<td colspan="7" style="padding:0 16px 18px;background:rgba(217,119,6,0.04)">
	81	<div style="display:grid;grid-template-columns:1fr 2fr;gap:18px;padding-top:6px">
	82	<div>
	83	<div class="text-xs" style="color:var(--col-text-3);text-transform:uppercase;letter-spacing:1px;font-weight:700;margin-bottom:6px">Ship to</div>
	84	<div class="text-xs" style="line-height:1.6">$loop1.ship_address_html</div>
	85	[if:$loop1.ship_phone]<div class="text-xs text-dim" style="margin-top:4px">Phone: $loop1.ship_phone</div>[/if]
	86	<div class="text-xs text-dim" style="margin-top:6px">$loop1.ship_zone · $loop1.ship_cost_display</div>
	87	</div>
	88	<div>
	89	<div class="text-xs" style="color:var(--col-text-3);text-transform:uppercase;letter-spacing:1px;font-weight:700;margin-bottom:6px">Items to fulfill</div>
	90	[loop:@lines]
	91	<div style="padding:10px 12px;border:1px solid var(--col-border);border-radius:8px;margin-bottom:6px;background:var(--col-surface-1)">
	92	<div style="display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap">
	93	<div style="flex:1;min-width:200px">
	94	<div class="text-sm fw-600" style="color:#fff">$loop2.title <span class="text-dim" style="font-weight:400">x$loop2.quantity</span></div>
	95	[if:$loop2.variant_pill]<div class="text-xs text-dim">$loop2.variant_pill</div>[/if]
	96	</div>
	97	<div>
	98	[if:$loop2.is_shipped]<span class="pill paid">$loop2.fulfillment_label</span>[/if]
	99	[if:!$loop2.is_shipped][if:$loop2.is_physical]<span class="pill open">$loop2.fulfillment_label</span>[/if][/if]
	100	</div>
	101	</div>
	102	[if:$loop2.is_shipped]
	103	<div class="text-xs text-dim" style="margin-top:6px">Tracking: $loop2.tracking_carrier $loop2.tracking_number</div>
	104	[/if]
	105	[if:$loop2.can_mark_shipped]
	106	<form method="POST" action="/orders_action.cgi" style="display:flex;gap:6px;margin-top:8px;flex-wrap:wrap">
	107	<input type="hidden" name="act" value="mark_shipped">
	108	<input type="hidden" name="order_item_id" value="$loop2.id">
	109	<input type="hidden" name="return_to" value="/orders.cgi">
	110	<input type="text" name="tracking_carrier" placeholder="Carrier (e.g. USPS)" maxlength="40" class="input" style="flex:1;min-width:120px;font-size:12px;padding:6px 10px">
	111	<input type="text" name="tracking_number" placeholder="Tracking number" maxlength="120" class="input" style="flex:2;min-width:160px;font-size:12px;padding:6px 10px">
	112	<button type="submit" class="btn btn-primary btn-sm" style="font-size:11px;padding:6px 14px">Mark shipped</button>
	113	</form>
	114	[/if]
	115	</div>
	116	[/loop]
	117	</div>
	118	</div>
	119	</td>
	120	</tr>
	121	[/if]
	122	[/loop]
	123	</tbody>
	124	</table>
	125	</div>
	126	</div>
	127
	128	[if:!$can_refund]
	129	<div class="banner info mt-3">
	130	<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/></svg>
	131	<div class="text-xs">You can view orders but not issue refunds. Ask the storefront owner to grant you the <strong>Issue refunds</strong> permission on a custom role to enable the action.</div>
	132	</div>
	133	[/if]
	134	[/if]
	135
	136	[if:$no_orders]
	137	<div style="text-align:center;padding:48px 18px;background:var(--col-surface-1);border:1px solid var(--col-border);border-radius:12px">
	138	<div class="text-sm fw-600" style="color:#fff;margin-bottom:6px">No orders yet</div>
	139	<div class="text-xs text-dim">Once a buyer checks out on any of your storefronts, the order will appear here in real time.</div>
	140	</div>
	141	[/if]
	142
	143	<script>
	144	// "Credit buyer" flow: prompt for amount (default = order total) and note,
	145	// confirm, submit. Order stays paid; this adds a positive credit row to the
	146	// buyer's ledger for use on a future order.
	147	document.addEventListener('click', function (e) {
	148	var btn = e.target.closest('.js-credit-buyer');
	149	if (!btn) return;
	150	e.preventDefault();
	151	var form = btn.closest('.js-credit-buyer-form');
	152	if (!form) return;
	153	var oid = form.getAttribute('data-order-id') \|\| '';
	154	var totalC = form.getAttribute('data-order-total-cents') \|\| '';
	155	var totalD = form.getAttribute('data-order-total-display') \|\| '';
	156	var email = form.getAttribute('data-buyer-email') \|\| 'this buyer';
	157	appPrompt({
	158	title: 'Credit ' + email + ' for order #' + oid,
	159	message: 'Amount in cents. Defaults to the order total (' + totalD + ').',
	160	placeholder: totalC,
	161	default_value: totalC,
	162	input_type: 'number',
	163	label: 'Next',
	164	required: true,
	165	validate: function (v) {
	166	if (!/^[0-9]+\$/.test(v)) return 'Whole-cent integer required.';
	167	if (parseInt(v, 10) <= 0) return 'Must be greater than zero.';
	168	return '';
	169	}
	170	}).then(function (amt) {
	171	if (amt === null) return;
	172	appPrompt({
	173	title: 'Note to the buyer',
	174	message: 'Shown to the buyer in their credit history.',
	175	placeholder: 'Sorry the model did not work out!',
	176	default_value: 'Store credit for order #' + oid,
	177	label: 'Next',
	178	required: true
	179	}).then(function (note) {
	180	if (note === null) return;
	181	var dollars = (parseInt(amt, 10) / 100).toFixed(2);
	182	appConfirm({
	183	title: 'Credit \$' + dollars + ' to ' + email + '?',
	184	message: 'The order itself stays paid; this adds store credit they can use on their next order.',
	185	confirm_label: 'Credit buyer',
	186	confirm_style: 'success'
	187	}).then(function (ok) {
	188	if (!ok) return;
	189	form.querySelector('input[name="amount_cents"]').value = amt;
	190	form.querySelector('input[name="note"]').value = note;
	191	form.submit();
	192	});
	193	});
	194	});
	195	});
	196	</script>

/var/www/vhosts/webstls.com/httpdocs/TEMPLATES/webstls_orders.html