package view

templ LineItem(item *ItemViewModel) {
	<tr class="hover">
		<td>{ item.Item }</td>
		<td>{ item.Quantity }</td>
		<td>{ item.Price }</td>
		<td>–</td>
		<td>{ item.PaymentStatus }</td>
		<td>{ item.SubTotal }</td>
		<td class="flex gap-2">
			<button class="btn btn-sm btn-outline" hx-get={ item.ItemUrl } hx-target="closest tr" hx-swap="outerHTML">Edit</button>
			if item.PaymentStatus != "Completed" {
				<button class="btn btn-sm btn-success" onclick="payment_modal[0].showModal()">Add Payment</button>
				<dialog id="payment_modal" class="modal">
					<div class="modal-box">
						<form hx-post={ item.PaymentUrl }>
							<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
						</form>
						<h3 class="text-lg font-bold">Add Payment</h3>
						<form class="py-4 space-y-4">
							<div class="form-control w-full">
								<label class="label">
									<span class="label-text">Amount</span>
								</label>
								<input type="number" step="0.01" name="amount" class="input input-bordered w-full" required autofocus/>
							</div>
							<div class="form-control w-full">
								<label class="label">
									<span class="label-text">Payment Method</span>
								</label>
								<select name="paymentMethod" class="select select-bordered w-full" required>
									<option value="">Select payment method</option>
									<option value="Cash">Cash</option>
									<option value="Card">Card</option>
									<option value="Cheque">Cheque</option>
									<option value="Transfer">Bank Transfer</option>
								</select>
							</div>
							<button type="submit" class="btn btn-primary">Add Payment </button>
						</form>
					</div>
				</dialog>
			}
		</td>
	</tr>
	if len(item.Payments) >0 {
		for _,payment := range item.Payments {
			<tr class="hover">
				<td></td>
				<td></td>
				<td>- { payment.Amount }</td>
				<td>{ payment.PaymentMethod }</td>
				<td></td>
				<td></td>
				<td class="flex gap-2">
					<button class="btn btn-sm btn-outline" hx-get={ payment.PaymentUrl } hx-target="closest tr" hx-swap="outerHTML">Edit</button>
				</td>
			</tr>
		}
	}
}

templ LineItemForm(item *ItemViewModel) {
	<tr class="hover">
		<form hx-put={ item.ItemUrl } id="edit-item" hx-target="closest tr" hx-swap="outerHTML">
			<td><input class="input input-bordered input-sm w-full" value={ item.Item } name="item" form="edit-item"/></td>
			<td><input class="input input-bordered input-sm w-full" value={ item.Quantity } name="quantity" form="edit-item"/></td>
			<td><input class="input input-bordered input-sm w-full" value={ item.Price } name="price" form="edit-item"/></td>
			<td><input class="input input-bordered input-sm w-full" value={ "todo" } name="paymentMethod" form="edit-item"/></td>
			<td><input class="input input-bordered input-sm w-full" value={ item.PaymentStatus } name="PaymentStatus" form="edit-item"/></td>
			<td>{ item.SubTotal }</td>
			<td>
				<button class="btn btn-sm btn-primary" type="submit" form="edit-item">Save</button>
			</td>
		</form>
	</tr>
}