@extends('administrator.layout.master')
@push('plugin-styles')
    @foreach (config('assets.datatable.css') as $datatable)
        <link href="{{ asset($datatable) }}" rel="stylesheet" />
    @endforeach
@endpush

@section('breadcrumb')
    @php
        $breadcrumbItems = [
            ['label' => 'Customer'],
            ['label' => 'Customer Management', 'url' => route('customer.index')],
            ['label' => 'Edit Customer', 'active' => true],
        ];
    @endphp
    <x-admin-breadcrumb :items="$breadcrumbItems" />
@endsection

@section('content')
    @if(auth()->guard('admins')->user()->can("edit customer"))
    <form action="{{ route('customer.update', ['id' => $customer->id]) }}" method="post">
        @csrf
        @method('PUT')
        <div class="row align-items-start">
            <div class="col-md-8">
                <div class="card card-primary card-outline rounded-4 shadow-none">
                    <div class="card-header rounded-top-4">
                        <h5 class="card-title m-0">Basic Information</h5>
                    </div>
                    <div class="card-body">
                        <div class="mb-4">
                            <h5 class="text-primary border-bottom mb-3 pb-2">Personal Information</h5>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="fullname">Fullname <span class="text-danger">*</span></label>
                                        <input type="text" id="fullname" name="fullname" value="{{ old('fullname', $customer->fullname) }}"
                                            class="form-control" required placeholder="Enter fullname">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="company">Company</label>
                                        <input type="text" id="company" name="company" value="{{ old('company', $customer->company) }}"
                                            class="form-control" placeholder="Enter company name">
                                    </div>
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="email">Email Address <span class="text-danger">*</span></label>
                                        <input type="email" id="email" name="email" value="{{ old('email', $customer->email) }}"
                                            class="form-control" required placeholder="Enter email address">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="phone">Phone Number</label>
                                        <input type="text" id="phone" name="phone" value="{{ old('phone', $customer->phone) }}"
                                            class="form-control" placeholder="(+84) 123. 456. 789">
                                    </div>
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="password">Password (leave blank to keep current)</label>
                                        <input type="password" id="password" name="password" class="form-control" placeholder="******">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="mb-4">
                            <h5 class="text-primary border-bottom mb-3 pb-2">Address Information</h5>
                            <div class="row mb-3">
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label for="address">Address</label>
                                        <input type="text" id="address" name="address" value="{{ old('address', $customer->address) }}"
                                            class="form-control" placeholder="Enter address">
                                    </div>
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="city">City</label>
                                        <input type="text" id="city" name="city" value="{{ old('city', $customer->city) }}"
                                            class="form-control" placeholder="Enter city">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="state">State</label>
                                        <input type="text" id="state" name="state" value="{{ old('state', $customer->state) }}"
                                            class="form-control" placeholder="Enter state">
                                    </div>
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="postcode">Postcode</label>
                                        <input type="text" id="postcode" name="postcode" value="{{ old('postcode', $customer->postcode) }}"
                                            class="form-control" placeholder="Enter postcode">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="country">Country</label>
                                        <input type="text" id="country" name="country" value="{{ old('country', $customer->country) }}"
                                            class="form-control" placeholder="Enter country">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-4 sticky-top top-10 z-0">
                <div class="card card-secondary card-outline mb-3 rounded-4 shadow-none">
                    <div class="card-header rounded-top-4">
                        <h5 class="card-title m-0">Settings</h5>
                    </div>
                    <div class="card-body">
                        <div class="form-group mb-3">
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" role="switch" id="email_marketing"
                                    name="email_marketing" value="1" {{ old('email_marketing', $customer->email_marketing) == 1 ? 'checked' : '' }}>
                                <label class="form-check-label" for="email_marketing">Marketing Emails Opt-in</label>
                            </div>
                            <small class="text-muted">Send client marketing emails</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <x-fixed-action-bar>
            <x-button-crm type="button" variant="secondary" size="sm" icon="arrow-left"
                route="customer.index">Cancel</x-button-crm>
            <x-button-crm type="submit" variant="primary" size="sm" icon="save">Update Customer</x-button-crm>
        </x-fixed-action-bar>
    </form>
    @else
        <div class="alert alert-danger alert-dismissible">
            <h5 class="mb-0"><i class="icon fas fa-ban"></i> Access Denied - You are not assigned to any Customer management department</h5>
        </div>
    @endif
@endsection