{% extends "base.html" %}

{% block content %}

<div class="d-flex justify-content-between align-items-center mb-4">

    <div>

        <h2>
            <i class="bi bi-pencil text-warning"></i>
            Edit Customer
        </h2>

        <p class="text-muted">
            {{ customer.customer_code }} - {{ customer.company_name }}
        </p>

    </div>

    <a href="/customers/{{ customer.id }}" class="btn btn-secondary">

        <i class="bi bi-arrow-left"></i>

        Back

    </a>

</div>

<form method="POST" action="/customers/{{ customer.id }}/edit">

<div class="card shadow-sm">

<div class="card-header bg-warning">

<h5>Company Information</h5>

</div>

<div class="card-body">

<div class="row">

<div class="col-md-6 mb-3">

<label>Company Name *</label>

<input
type="text"
class="form-control"
name="company_name"
value="{{ customer.company_name }}"
required>

</div>

<div class="col-md-6 mb-3">

<label>Trading Name</label>

<input
type="text"
class="form-control"
name="trading_name"
value="{{ customer.trading_name or '' }}">

</div>

<div class="col-md-6 mb-3">

<label>Registration Number</label>

<input
type="text"
class="form-control"
name="registration_number"
value="{{ customer.registration_number or '' }}">

</div>

<div class="col-md-6 mb-3">

<label>VAT Number</label>

<input
type="text"
class="form-control"
name="vat_number"
value="{{ customer.vat_number or '' }}">

</div>

</div>

</div>

</div>

<br>

<div class="card shadow-sm">

<div class="card-header bg-warning">

<h5>Address</h5>

</div>

<div class="card-body">

<div class="row">

<div class="col-md-6 mb-3">

<label>Street</label>

<input
type="text"
class="form-control"
name="street"
value="{{ customer.street or '' }}">

</div>

<div class="col-md-3 mb-3">

<label>City</label>

<input
type="text"
class="form-control"
name="city"
value="{{ customer.city or '' }}">

</div>

<div class="col-md-3 mb-3">

<label>Province</label>

<input
type="text"
class="form-control"
name="province"
value="{{ customer.province or '' }}">

</div>

<div class="col-md-3 mb-3">

<label>Postal Code</label>

<input
type="text"
class="form-control"
name="postal_code"
value="{{ customer.postal_code or '' }}">

</div>

</div>

</div>

</div>

<br>

<div class="card shadow-sm">

<div class="card-header bg-warning">

<h5>Primary Contact</h5>

</div>

<div class="card-body">

<div class="row">

<div class="col-md-4 mb-3">

<label>Contact Name</label>

<input
type="text"
class="form-control"
name="contact_name"
value="{{ customer.contact_name or '' }}">

</div>

<div class="col-md-4 mb-3">

<label>Email</label>

<input
type="email"
class="form-control"
name="email"
value="{{ customer.email or '' }}">

</div>

<div class="col-md-4 mb-3">

<label>Telephone</label>

<input
type="text"
class="form-control"
name="telephone"
value="{{ customer.telephone or '' }}">

</div>

</div>

</div>

</div>

<br>

<div class="text-end">

    <a href="/customers/{{ customer.id }}" class="btn btn-secondary btn-lg">

        Cancel

    </a>

    <button type="submit" class="btn btn-primary btn-lg">

        <i class="bi bi-save"></i>

        Update Customer

    </button>

</div>

</form>

{% endblock %}