<div class="bg-main-container">
    <div class="max-w-full mx-auto px-5 ">
        {{-- <div class="flex flex-wrap items-center"> --}}
            <h2 class="text-2xl  text-black ">
                Server License Management
            </h2>
            <a type="button" href="/server-license"
                class="btn  m-3 text-white bg-primary px-3 py-2 hover:bg-primary-focus">Back</a>

        {{-- </div> --}}
        @if (session()->has('message'))
            <div class="alert alert-success">
                {{ session('message') }}
            </div>
        @endif
        <div class="flex flex-wrap -mx-3 w-full bg-main-container items-center justify-center ">
            <div class="w-4/5 p-5 mb-6 shadow-md rounded-lg">
                <form>
                    <!-- Server Key -->
                    <div class="mb-4 flex items-center">
                        <label for="serverKey" class="w-1/4 text-gray-700">Server Key</label>
                        <input type="text" id="serverKey" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="serverKey">
                    </div>

                    <!-- Team -->
                    <div class="mb-4 flex items-center">
                        <label for="teamId" class="w-1/4 text-gray-700">Team</label>
                        <select id="teamId" wire:model.defer="teamId"
                            class="w-3/4 p-2 border border-gray-300 rounded-md">
                            @foreach ($teams as $team)
                                <option value="{{ $team->id }}">{{ $team->teamName }}</option>
                            @endforeach
                        </select>
                    </div>

                    <!-- Customer Sizing -->
                    <div class="mb-4 flex items-center">
                        <label for="customerSize" class="w-1/4 text-gray-700">Customer Sizing</label>
                        <select id="customerSize" wire:model.defer="customerSize"
                            class="w-3/4 p-2 border border-gray-300 rounded-md">
                            @foreach ($sizings as $size)
                                <option value="{{ $size->id }}">{{ $size->sizeName }}</option>
                            @endforeach
                        </select>
                    </div>

                    <!-- Customer Type -->
                    <div class="mb-4 flex items-center">
                        <label for="customerType" class="w-1/4 text-gray-700">Customer Type</label>
                        <select id="customerType" wire:model.defer="customerType"
                            class="w-3/4 p-2 border border-gray-300 rounded-md">
                            @foreach ($customerTypes as $type)
                                <option value="{{ $type->id }}">{{ $type->sizeTypeName }}</option>
                            @endforeach
                        </select>
                    </div>

                    <!-- Company -->
                    <div class="mb-4 flex items-center">
                        <label for="company" class="w-1/4 text-gray-700">Company</label>
                        <input type="text" id="company" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="company">
                    </div>

                    <!-- Branch -->
                    <div class="mb-4 flex items-center">
                        <label for="branch" class="w-1/4 text-gray-700">Branch</label>
                        <input type="text" id="branch" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="branch">
                    </div>

                    <!-- Status -->
                    <div class="mb-4 flex items-center">
                        <label class="w-1/4 text-gray-700">Status</label>
                        <div class="flex items-center w-3/4">
                            <label class="mr-4">
                                <input type="radio" name="status" value="Y" wire:model.defer="status"> Yes
                            </label>
                            <label>
                                <input type="radio" name="status" value="N" wire:model.defer="status"> No
                            </label>
                        </div>
                    </div>

                    <!-- Licensedate -->
                    <div class="mb-4 flex items-center">
                        <label for="licenseDate" class="w-1/4 text-gray-700">License Date</label>
                        <input type="date" id="licenseDate" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="licenseDate">
                    </div>

                    <!-- PHP Version -->
                    <div class="mb-4 flex items-center">
                        <label for="phpVersionId" class="w-1/4 text-gray-700">PHP Version</label>
                        <select id="phpVersionId" wire:model.defer="phpVersionId"
                            class="w-3/4 p-2 border border-gray-300 rounded-md">
                            @foreach ($phpVersions as $version)
                                <option value="{{ $version->id }}">{{ $version->version }}</option>
                            @endforeach
                        </select>
                    </div>

                    <!-- Version ปัจจุบัน -->
                    <div class="mb-4 flex items-center">
                        <label for="currentVersion" class="w-1/4 text-gray-700">Version ปัจจุบัน</label>
                        <input type="text" id="currentVersion" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="currentVersion">
                    </div>

                    <!-- วันที่ไป Install -->
                    <div class="mb-4 flex items-center">
                        <label for="installDate" class="w-1/4 text-gray-700">วันที่ไป Install</label>
                        <input type="date" id="installDate" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="installDate">
                    </div>

                    <!-- Version ที่ลงครั้งแรก -->
                    <div class="mb-4 flex items-center">
                        <label for="installVersion" class="w-1/4 text-gray-700">Version ที่ลงครั้งแรก</label>
                        <input type="text" id="installVersion" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="installVersion">
                    </div>

                    <!-- Database Type -->
                    <div class="mb-4 flex items-center">
                        <label for="databaseType" class="w-1/4 text-gray-700">Database Type</label>
                        <select id="databaseType" wire:model.defer="databaseType"
                            class="w-3/4 p-2 border border-gray-300 rounded-md">
                            @foreach ($dbTypes as $db)
                                <option value="{{ $db->id }}">{{ $db->dbName }}</option>
                            @endforeach
                        </select>
                    </div>

                    <!-- Server of -->
                    <div class="mb-4 flex items-center">
                        <label for="ownerType" class="w-1/4 text-gray-700">Server of</label>
                        <select id="ownerType" wire:model.defer="ownerType"
                            class="w-3/4 p-2 border border-gray-300 rounded-md">
                            @foreach ($ownerTypes as $owner)
                                <option value="{{ $owner->owntype_code }}">{{ $owner->owntype_description }}</option>
                            @endforeach
                        </select>
                    </div>

                    <!-- HSCODE 2017 Method -->
                    <div class="mb-4 flex items-center">
                        <label for="hscodeMethod" class="w-1/4 text-gray-700">HSCODE 2017 Method</label>
                        <select id="hscodeMethod" wire:model.defer="hscodeMethod"
                            class="w-3/4 p-2 border border-gray-300 rounded-md">
                            <option value="1" {{ $hscodeMethod == '1' ? 'selected' : '' }}>Patch</option>
                            <option value="2" {{ $hscodeMethod == '2' ? 'selected' : '' }}>Run script</option>
                        </select>
                    </div>

                    <!-- URL / IP Address -->
                    <div class="mb-4 flex items-center">
                        <label for="customerUrl" class="w-1/4 text-gray-700">URL / IP Address</label>
                        <input type="text" id="customerUrl" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="customerUrl">
                    </div>

                    <!-- Contact -->
                    <div class="mb-4 flex items-center">
                        <label for="contact" class="w-1/4 text-gray-700">Contact</label>
                        <input type="text" id="contact" class="w-3/4 p-2 border border-gray-300 rounded-md"
                            wire:model.defer="contact">
                    </div>

                    <!-- Contact Customer Name -->
                    <div class="mb-4 flex items-center">
                        <label for="contactCustomerName" class="w-1/4 text-gray-700">Contact Customer Name</label>
                        <input type="text" id="contactCustomerName"
                            class="w-3/4 p-2 border border-gray-300 rounded-md" wire:model.defer="contactCustomerName">
                    </div>

                    <!-- Save and Reset Buttons -->
                    <div class="flex justify-center">
                        <button type="button" wire:click="save"
                            class="bg-primary text-white px-4 py-2 rounded-md hover:bg-primary-focus">Save</button>
                    </div>
                </form>
            </div>
        </div>

    </div>
</div>
