@props(['invoice', 'isWindows' => false])

<flux:modal name="reset-vm-password" class="md:w-[28rem]">
    <div class="space-y-6">
        <div>
            <flux:heading size="lg">{{ __('Đặt lại mật khẩu VM') }}</flux:heading>
            <flux:text class="mt-2">
                {{ __('Nhập mật khẩu mới cho máy ảo của bạn.') }}
            </flux:text>
        </div>

        <form x-data="{ submitting: false }" x-on:submit.prevent="if (submitting) return; submitting = true; $el.submit()"
            method="POST" action="{{ route('service.reset.vm.password') }}">
            @csrf
            <input type="hidden" name="product_id" value="{{ $invoice->vm_id }}">

            <flux:field>
                <flux:label>{{ __('Mật khẩu cũ') }}</flux:label>
                <flux:input name="old_password" type="password" placeholder="{{ __('Nhập mật khẩu cũ') }}" required
                    minlength="8" />
            </flux:field>
            <flux:field>
                <flux:label>{{ __('Mật khẩu mới') }}</flux:label>
                <flux:input name="new_password" type="password" placeholder="{{ __('Nhập mật khẩu mới') }}" required
                    minlength="8" />
                <flux:description>{{ $isWindows ? __('Tài khoản: administrator') : __('Tài khoản: root') }}
                </flux:description>
            </flux:field>

            <div class="flex gap-2 justify-end mt-6">
                <flux:modal.close>
                    <flux:button variant="ghost">{{ __('Hủy') }}</flux:button>
                </flux:modal.close>
                <flux:button type="submit" variant="primary" color="orange" x-bind:disabled="submitting">
                    {{ __('Đồng ý') }}</flux:button>
            </div>
        </form>
    </div>
</flux:modal>