沢山追加

view/openprovider/getdns.maron

@@ -0,0 +1,150 @@
+{@ include(common/header) @}
+      <style>
+        .tabs {
+          border-radius: 2px;
+          box-shadow: 0 4px 12px rgba(0,0,0,0.1);
+        }
+
+        .tab-nav {
+          display: flex;
+          border-bottom: 1px solid #ea79d8;
+        }
+
+        .tab-nav label {
+          flex: 1;
+          color: #ea79d8;
+          padding: 16px 20px;
+          text-align: center;
+          cursor: pointer;
+          background: #550f75;
+          transition: all 0.3s;
+          font-weight: 600;
+        }
+
+        .tab-nav label:hover {
+          background: #8952a3;
+        }
+
+        .tab-input {
+          display: none;
+        }
+
+        #tab1:checked ~ .tab-nav label[for="tab1"],
+        #tab2:checked ~ .tab-nav label[for="tab2"],
+        #tab3:checked ~ .tab-nav label[for="tab3"],
+        #tab4:checked ~ .tab-nav label[for="tab4"] {
+          background: #2c023f;
+          border-bottom: 3px solid #ea79d8;
+          color: #ea79d8;
+        }
+
+        .tab-content {
+          display: none;
+          min-height: 200px;
+        }
+
+        #tab1:checked ~ .tab-content[data-tab="1"],
+        #tab2:checked ~ .tab-nav ~ .tab-content[data-tab="2"],
+        #tab3:checked ~ .tab-nav ~ .tab-content[data-tab="3"],
+        #tab4:checked ~ .tab-nav ~ .tab-content[data-tab="4"] {
+          display: block;
+        }
+      </style>
+
+      <a href="#" class="">DNSレコードの追加ボタン</a><br />
+      <a href="#" class="">DNSゾーンの削除ボタン</a><br />
+{@ if (isset($data['rec']['results']) || isset($data['zone'])) @}
+      検索バー<br />
+      <div class="tabs">
+        <input type="radio" id="tab1" name="tabs" class="tab-input" checked />
+        <input type="radio" id="tab2" name="tabs" class="tab-input" />
+        <input type="radio" id="tab3" name="tabs" class="tab-input" />
+        <input type="radio" id="tab4" name="tabs" class="tab-input" />
+
+        <div class="tab-nav">
+          <label for="tab1">レコード</label>
+          <label for="tab2">詳細</label>
+          <label for="tab3">DNSSEC鍵</label>
+          <label for="tab4">履歴</label>
+        </div>
+
+        <div class="tab-content" data-tab="1">
+          <h2>レコード</h2>
+          <table>
+            <thead>
+              <tr>
+                <th>名前</th>
+                <th>種類</th>
+                <th>内容</th>
+                <th>プライオリティ</th>
+                <th>TTL</th>
+              </tr>
+            </thead>
+            <tbody>
+{@ foreach ($data['rec']['results'] as $d) @}
+              <tr>
+                <td><a href="/openprovider/editdnszone/{{ $d['name'] }}">{{ $d['name'] }}</a></td>
+                <td>{{ $d['type'] }}</td>
+                <td>{{ substr($d['value'], 0, 40) }}</td>
+                <td>{{ $d['prio'] ?? '' }}</td>
+                <td>{{ $d['ttl'] }}</td>
+              </tr>
+{@ endforeach @}
+            </tbody>
+          </table>
+        </div>
+
+        <div class="tab-content" data-tab="2">
+          <h2>詳細</h2>
+          <table>
+            <tbody>
+              <tr>
+                <td>ドメイン名</td>
+                <td>{{ $data['zone']['name'] }}</td>
+              </tr>
+              <tr>
+                <td>種類</td>
+                <td>{{ $data['zone']['type'] }}</td>
+              </tr>
+              <tr>
+                <td>DNSゾーンプロバイダー</td>
+                <td>Openprovider</td>
+              </tr>
+              <tr>
+                <td>追加日</td>
+                <td>{{ $data['zone']['creation_date'] }}</td>
+              </tr>
+              <tr>
+                <td>最終更新日</td>
+                <td>{{ $data['zone']['modification_date'] }}</td>
+              </tr>
+              <tr>
+                <td>レコード数</td>
+                <td>{{ $data['rec']['total'] }}</td>
+              </tr>
+              <tr>
+                <td>DNSSEC有効</td>
+                <td></td>
+              </tr>
+              <tr>
+                <td>SpamExperts</td>
+                <td>{{ $data['zone']['is_spamexperts_enabled'] ? '有' : '無' }}</td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <div class="tab-content" data-tab="3">
+          <h2>DNSSEC鍵</h2>
+          <p>ささ</p>
+        </div>
+
+        <div class="tab-content" data-tab="4">
+          <h2>履歴</h2>
+          <p>ささ</p>
+        </div>
+      </div>
+{@ else @}
+      <p>何も見つけられませんでした。</p>
+{@ endif @}
+{@ include(common/footer) @}