189 lines
12 KiB
PHP
189 lines
12 KiB
PHP
@extends('frontend.layouts.master')
|
|
|
|
@section('content')
|
|
<div class="min-h-screen flex justify-center">
|
|
<div class="max-w-2xl w-full">
|
|
<!-- Main Card -->
|
|
<div class="bg-white rounded-xl shadow-lg p-6 sm:p-8">
|
|
<form id="whoisForm" class="space-y-6">
|
|
@csrf
|
|
<!-- Domain Input -->
|
|
<div>
|
|
<flux:field>
|
|
<flux:label> {{ __('Tên miền') }}</flux:label>
|
|
<flux:input id="domain" name="domain" placeholder="{{ __('ví dụ: example.com') }}" />
|
|
<flux:error name="domainError" id="domainError" />
|
|
</flux:field>
|
|
</div>
|
|
|
|
<!-- Action Buttons -->
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
|
<button type="button" id="getDomainInfo"
|
|
class="w-full bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-4 rounded-lg transition duration-200 flex items-center justify-center space-x-2">
|
|
<svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z">
|
|
</path>
|
|
</svg>
|
|
<span>{{ __('Lấy thông tin tên miền') }}</span>
|
|
</button>
|
|
|
|
<button type="button" id="checkAvailability"
|
|
class="w-full bg-green-600 hover:bg-green-700 text-white font-medium py-3 px-4 rounded-lg transition duration-200 flex items-center justify-center space-x-2">
|
|
<svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
|
|
</svg>
|
|
<span>{{ __('Kiểm tra tính sẵn sàng') }}</span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
<!-- Loading State -->
|
|
<div id="loading" class="hidden text-center py-8">
|
|
<div class="inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div>
|
|
<p class="mt-3 text-gray-600">{{ __('Đang tải...') }}</p>
|
|
</div>
|
|
|
|
<!-- Results Section -->
|
|
<div id="results" class="hidden mt-8">
|
|
<div class="who-info">
|
|
<!-- Header -->
|
|
<div class="flex items-center justify-between mb-6">
|
|
<div class="flex items-center space-x-3">
|
|
<div class="h-8 w-8 bg-green-100 rounded-full flex items-center justify-center">
|
|
<svg class="h-4 w-4 text-green-600" fill="none" stroke="currentColor"
|
|
viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h3 class="text-lg font-semibold text-gray-900">{{ __('Thông tin Whois tên miền') }}
|
|
</h3>
|
|
<p class="text-sm text-gray-500" id="domainTitle"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Whois Table -->
|
|
<div class="table-responsive">
|
|
<div class="bg-gray-50 rounded-lg overflow-hidden">
|
|
<table class="min-w-full divide-y divide-gray-200">
|
|
<thead class="bg-gray-100">
|
|
<tr>
|
|
<th
|
|
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider w-1/3">
|
|
{{ __('Property') }}</th>
|
|
<th
|
|
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
|
|
{{ __('Value') }}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="bg-white divide-y divide-gray-200">
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Domain Name') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900 font-medium"
|
|
id="domain_name"></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Registration Date') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"
|
|
id="domain_reg_date"></td>
|
|
</tr>
|
|
<tr id="domain_update_row" class="hidden">
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Last Updated') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"
|
|
id="domain_update_date"></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Expiration Date') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"
|
|
id="domain_exp_date"></td>
|
|
</tr>
|
|
<tr id="domain_owner_row">
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Domain Owner') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900 font-medium"
|
|
id="domain_own_name"></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Status') }}</td>
|
|
<td class="px-6 py-4 text-sm text-gray-900">
|
|
<div id="domain_status_list" class="flex flex-wrap gap-1"></div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Registrar') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900 font-medium"
|
|
id="domain_registrar"></td>
|
|
</tr>
|
|
<tr id="domain_whois_server_row" class="hidden">
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Whois Server') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900"
|
|
id="domain_server_whois"></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('Nameserver') }}</td>
|
|
<td class="px-6 py-4 text-sm text-gray-900">
|
|
<div id="domain_ns_list" class="space-y-1"></div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-500">
|
|
{{ __('DNSSEC') }}</td>
|
|
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
|
|
<span id="domain_dnssec"
|
|
class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800"></span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Availability Check Results -->
|
|
<div id="availabilityResults" class="hidden mt-6">
|
|
<div id="availabilityAlert" class="rounded-lg p-4">
|
|
<div class="flex items-center">
|
|
<div class="flex-shrink-0 mr-3" id="availabilityIcon"></div>
|
|
<div>
|
|
<h4 class="text-sm font-medium" id="availabilityTitle"></h4>
|
|
<p class="text-sm" id="availabilityMessage"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Set up translations and routes for JavaScript
|
|
window.translations = {
|
|
domainRequired: '{{ __('Domain name is required.') }}',
|
|
requestError: '{{ __('An error occurred while processing your request.') }}',
|
|
domainAvailable: '{{ __('Domain Available') }}',
|
|
domainUnavailable: '{{ __('Domain Unavailable') }}',
|
|
isAvailable: '{{ __('is available for registration') }}',
|
|
isNotAvailable: '{{ __('is not available for registration') }}'
|
|
};
|
|
|
|
window.routes = {
|
|
domainInfo: '{{ route('whois.domain-info') }}',
|
|
checkAvailability: '{{ route('whois.check-availability') }}'
|
|
};
|
|
</script>
|
|
<script src="{{ asset('js/whois.min.js') }}"></script>
|
|
@endsection
|