@extends('layouts.setup')
@section('title', '独自ドメイン詳細')
@section('page-title', '独自ドメイン詳細')

@section('setup_body')
@if($errors->any())
  <div class="alert alert-danger py-2 mb-3">
    <ul class="mb-0 ps-3 small">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
  </div>
@endif

<div class="setup-form-card mb-3">
  <div class="card-header d-flex flex-wrap justify-content-between align-items-center gap-2">
    <span><i class="bi bi-globe2 me-2"></i>{{ $domain->domain }}</span>
    @php
      $st = \App\Support\SiteCustomDomainDnsHelp::displayStatus($domain);
    @endphp
    @if($st['variant'] === 'ok')
      <span class="text-success fw-semibold">{{ $st['label'] }}</span>
    @else
      <span class="text-muted">{{ $st['label'] }}</span>
    @endif
  </div>
  <div class="card-body">
    <dl class="row mb-0 small">
      <dt class="col-sm-3">紐付け種別</dt><dd class="col-sm-9">{{ $domain->target_type === 'funnel' ? 'ファネル' : 'サイト等' }}（内部区分: {{ $domain->target_type }}）</dd>
      <dt class="col-sm-3">SSL</dt><dd class="col-sm-9">{{ $domain->ssl_enabled ? '有効' : '無効（DNS 反映・基盤側設定後に有効化）' }}</dd>
      <dt class="col-sm-3">登録日時</dt><dd class="col-sm-9">{{ $domain->created_at->format('Y/m/d H:i') }}</dd>
    </dl>
  </div>
</div>

<div class="setup-form-card mb-3 border-primary border-opacity-25">
  <div class="card-header bg-primary bg-opacity-10">この設定で「何が」ゲストに見えるか</div>
  <div class="card-body small">
    <ol class="mb-3 ps-3">
      <li class="mb-2"><strong>DNS（下の CNAME）</strong>… ブラウザが <code>https://{{ $domain->domain }}/</code> にアクセスしたとき、<strong>monaka のアプリケーション基盤</strong>（画面の「値」に出るホスト名側）へトラフィックを向けます。ドメイン取得先で CNAME を登録したあと、<strong>「DNS を確認」</strong>を押すと公開 DNS を照会し、問題なければ一覧のステータスが <strong>利用可能（active）</strong> になります（ICMP や実際の HTTPS 試験ではありません。証明書はエッジ側の設定に依存します）。</li>
      <li class="mb-2"><strong>ドメインのトップに表示するページ</strong>… DNS が <strong>利用可能（active）</strong> になったあと、ゲストが <code>https://{{ $domain->domain }}/</code> を開くと、ここで選んだ <strong>ファネルページ</strong>の内容がそのまま表示されます（管理画面のプレビューと同じレンダリング）。</li>
      <li class="mb-0"><strong>ファビコン（任意）</strong>… 下のファイル欄から <strong>png / jpg / jpeg / gif / webp / ico</strong>（512KB 以下）を指定して保存すると、ブラウザタブのアイコンに使われます（この画面でアップロードしたファイルは monaka の <code>storage</code> 配下に保存されます）。</li>
    </ol>
    <p class="text-muted mb-0">会員サイトの <code>/member/…</code> やシナリオ登録フォームなど<strong>別パスの公開 URL</strong>は、従来どおり本サービスのドメイン＋ルート定義で動きます。独自ドメインは主に<strong>ランディングのブランド URL</strong>向けです。</p>
  </div>
</div>

<div class="setup-form-card mb-3">
  <div class="card-header">表示設定（ドメイントップのページ・ファビコン）</div>
  <div class="card-body">
    <form method="POST" action="{{ route('setting.domain.update', $domain) }}" enctype="multipart/form-data">
      @csrf
      @method('PUT')
      <div class="mb-3">
        <label class="form-label fw-semibold" for="root_funnel_page_id">ドメインのトップ（/）に表示するファネルページ</label>
        <select name="root_funnel_page_id" id="root_funnel_page_id" class="form-select @error('root_funnel_page_id') is-invalid @enderror">
          <option value="">（未設定：トップは案内画面になります）</option>
          @foreach($funnelPages as $p)
            <option value="{{ $p->id }}" @selected((int) old('root_funnel_page_id', $domain->root_funnel_page_id) === (int) $p->id)>
              {{ $p->funnel?->name ?? 'ファネル' }} — {{ $p->name }}（{{ $p->status === 'public' ? '公開' : $p->status }}）
            </option>
          @endforeach
        </select>
        @error('root_funnel_page_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
        <div class="form-text">公開ステータスが <strong>public</strong> のページだけがゲストに表示されます。未公開のまま選ぶと、独自ドメインのトップはエラー案内になります。</div>
        @php
          $rootPage = $domain->rootFunnelPage;
        @endphp
        @if($rootPage && $rootPage->status !== 'public')
          <div class="alert alert-warning py-2 mt-2 mb-0 small">
            現在トップに指定されているページ「{{ $rootPage->name }}」は <strong>{{ $rootPage->status }}</strong> です。
            独自ドメインで表示するには、ページを公開してください。
            <button type="submit" form="publish-root-page-form" class="btn btn-sm btn-warning ms-2">このトップページを公開する</button>
          </div>
        @endif
      </div>
      <div class="mb-3">
        <label class="form-label fw-semibold" for="favicon_file">ファビコン（任意）</label>
        <input type="file" name="favicon_file" id="favicon_file" class="form-control @error('favicon_file') is-invalid @enderror" accept=".png,.jpg,.jpeg,.gif,.webp,.ico,image/png,image/jpeg,image/gif,image/webp,image/x-icon,image/vnd.microsoft.icon">
        @error('favicon_file')<div class="invalid-feedback">{{ $message }}</div>@enderror
        <div class="form-text">png / jpg / jpeg / gif / webp / ico、最大 512KB。保存するとこのドメイン用に公開保存されます。</div>
        @if($domain->favicon_url)
          <div class="mt-2 d-flex flex-wrap align-items-center gap-3">
            <div class="small text-muted">現在の設定:</div>
            <img src="{{ $domain->favicon_url }}" alt="" width="32" height="32" class="border rounded bg-white p-1" loading="lazy">
            <code class="small text-break">{{ $domain->favicon_url }}</code>
          </div>
          <div class="form-check mt-2">
            <input class="form-check-input" type="checkbox" value="1" name="favicon_remove" id="favicon_remove" @checked(old('favicon_remove'))>
            <label class="form-check-label small" for="favicon_remove">ファビコンを削除する</label>
          </div>
        @endif
      </div>
      <button type="submit" class="btn btn-success">保存</button>
    </form>
    <form id="publish-root-page-form" method="POST" action="{{ route('setting.domain.publish-root-page', $domain) }}" class="d-none">
      @csrf
    </form>
  </div>
</div>

<div class="setup-form-card mb-3">
  <div class="card-header">DNS（CNAME）設定</div>
  <div class="card-body">
    <p class="text-muted small mb-3">ドメイン取得先の DNS 編集画面で、次の1行を追加してください。親ゾーンが <strong>{{ $dns['parent_zone'] }}</strong> の場合、ホスト名欄には多くの業者で <strong>{{ $dns['record_host'] }}</strong> だけ（末尾に親ゾーンを付けない）を入力します。表示が分かれている場合は FQDN <code>{{ $dns['fqdn'] }}</code> を優先してください。</p>
    <div class="table-responsive">
      <table class="table table-sm mb-0">
        <thead class="table-light"><tr><th>タイプ</th><th>ホスト名（例）</th><th>値</th></tr></thead>
        <tbody>
          <tr>
            <td><code>CNAME</code></td>
            <td><code>{{ $dns['record_host'] }}</code></td>
            <td><code>{{ $dns['record_value'] }}</code></td>
          </tr>
        </tbody>
      </table>
    </div>
    <p class="form-text mb-2 mt-2">運用で接続先を変える場合は、サーバ側の独自ドメイン接続先設定を確認してください。既定の接続先は <code>tools.monaka-app.com</code> です。</p>
    @if($domain->dns_last_checked_at)
      <p class="small mb-2 {{ $domain->dns_last_check_ok ? 'text-success' : 'text-danger' }}">
        <strong>前回の DNS 確認</strong>（{{ $domain->dns_last_checked_at->timezone(config('app.timezone'))->format('Y/m/d H:i') }}）:
        {{ is_array($domain->dns_last_check_result) ? ($domain->dns_last_check_result['detail'] ?? '—') : '—' }}
      </p>
    @endif
    <form method="POST" action="{{ route('setting.domain.dns-check', $domain) }}" class="d-inline">
      @csrf
      <button type="submit" class="btn btn-primary btn-sm">DNS を確認</button>
    </form>
    <span class="text-muted small ms-2">公開 DNS で CNAME（または同等の向き）を照会します。成功時はステータスを「利用可能」に更新します。</span>
  </div>
</div>

<div class="d-flex flex-wrap gap-2">
  <a href="{{ route('setting.domain') }}" class="btn btn-outline-secondary">一覧へ戻る</a>
  <form method="POST" action="{{ route('setting.domain.destroy', $domain) }}" onsubmit="return confirm('削除しますか？');" class="d-inline">
    @csrf @method('DELETE')
    <button type="submit" class="btn btn-outline-danger">削除</button>
  </form>
</div>
@endsection