From 64d60969e665494540ceaf9cf90d7862d819e275 Mon Sep 17 00:00:00 2001
From: 7836246 <go7836246@gmail.com>
Date: Sat, 2 Mar 2024 17:27:24 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=BA=95=E9=83=A8=E5=92=8CAp?=
 =?UTF-8?q?i=E6=96=87=E6=A1=A3=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/common/Footer.vue | 18 +++++++++
 layouts/default.vue          |  3 +-
 layouts/empty.vue            | 15 +++++++
 pages/api.html.vue           | 76 ++++++++++++++++++++++++++++++++++++
 4 files changed, 111 insertions(+), 1 deletion(-)
 create mode 100644 components/common/Footer.vue
 create mode 100644 layouts/empty.vue
 create mode 100644 pages/api.html.vue

diff --git a/components/common/Footer.vue b/components/common/Footer.vue
new file mode 100644
index 0000000..0039533
--- /dev/null
+++ b/components/common/Footer.vue
@@ -0,0 +1,18 @@
+<template>
+  <footer class="text-gray-800 h-[10vh] bg-[#F1F3F4] dark:text-white  dark:bg-[#5b77af]">
+    <div class="max-w-4xl mx-auto py-4 px-4 flex justify-between items-center">
+      <div class="text-sm">
+        © 2024 Whois查询. All rights reserved.
+      </div>
+      <div class="flex items-center space-x-4">
+        <NuxtLink to="/api.html" class="hover:underline">API文档</NuxtLink>
+        <NuxtLink to="https://github.com/7836246/Nuxt-Whois" class="hover:underline">
+          <Icon name="ant-design:github-outlined" class="h-6 w-6" />
+        </NuxtLink>
+      </div>
+    </div>
+  </footer>
+</template>
+
+<style scoped>
+</style>
diff --git a/layouts/default.vue b/layouts/default.vue
index 70af954..c9deb65 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -56,7 +56,7 @@ const timeStore = useTimeStore()
 </script>
 
 <template>
-  <div class="w-full  min-h-screen text-xs bg-[#F1F3F4] dark:bg-transparent">
+  <div class="w-full h-[90vh] text-xs bg-[#F1F3F4] dark:bg-transparent">
     <div class=" max-w-screen-lg mx-auto pt-[25vh] px-[1em] pb-[10vh] ">
       <nav class=" w-full text-[#464747] h-5 dark:bg-gray-700">
         <NuxtLink class="mb-3 font-bold text-2xl inline-block text-current no-underline dark:text-white"
@@ -121,6 +121,7 @@ const timeStore = useTimeStore()
       <slot />
     </div>
   </div>
+  <CommonFooter />
 </template>
 
 <style scoped>
diff --git a/layouts/empty.vue b/layouts/empty.vue
new file mode 100644
index 0000000..ec069fc
--- /dev/null
+++ b/layouts/empty.vue
@@ -0,0 +1,15 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+    <div class="w-full h-[90vh]  text-xs bg-[#F1F3F4] dark:bg-transparent">
+      <div class="max-w-screen-lg mx-auto pt-[15vh] px-[1em] pb-[10vh] ">
+        <slot />
+      </div>
+    </div>
+    <CommonFooter />
+</template>
+<style scoped>
+
+</style>
diff --git a/pages/api.html.vue b/pages/api.html.vue
new file mode 100644
index 0000000..89742e5
--- /dev/null
+++ b/pages/api.html.vue
@@ -0,0 +1,76 @@
+<script setup lang="ts">
+definePageMeta({
+  layout: 'empty',
+})
+</script>
+
+<template>
+  <div class="max-w-4xl mx-auto py-8 px-4">
+    <div class="overflow-hidden shadow-md rounded-lg">
+      <div class="px-6 py-4 bg-red-500 text-white font-bold uppercase">
+        <div class="flex items-center justify-between">
+          <NuxtLink to="/" class="hover:text-white">
+            <Icon name="ic:outline-home" class="h-6 w-6" /> <!-- 调整图标大小 -->
+          </NuxtLink>
+          <span>Whois关键信息提取API</span>
+          <span></span> <!-- 占位符以保持标题居中 -->
+        </div>
+      </div>
+
+    <div class="p-6">
+        <div class="grid grid-cols-3 gap-4 mb-4">
+          <div class="font-semibold">接口地址</div>
+          <div class="col-span-2">/api/whois</div>
+        </div>
+<!--        <div class="grid grid-cols-3 gap-4 mb-4">-->
+<!--          <div class="font-semibold">累计调用</div>-->
+<!--          <div class="col-span-2"><span class="count">156</span> 次</div>-->
+<!--        </div>-->
+        <div class="grid grid-cols-3 gap-4 mb-4">
+          <div class="font-semibold">请求方式</div>
+          <div class="col-span-2">POST</div>
+        </div>
+        <div class="grid grid-cols-3 gap-4 mb-4">
+          <div class="font-semibold">返回格式</div>
+          <div class="col-span-2">String</div>
+        </div>
+      </div>
+      <div class="px-6 py-4 border-t border-gray-200">
+        <div class="font-bold mb-2">输入参数</div>
+        <div class="grid grid-cols-3 gap-4 mb-4">
+          <div class="font-semibold">名称</div>
+          <div class="font-semibold">类型</div>
+          <div class="font-semibold">描述</div>
+        </div>
+        <!-- 参数列表 -->
+        <div class="grid grid-cols-3 gap-4 mb-4">
+          <div>domain</div>
+          <div>string</div>
+          <div>(必选) 域名</div>
+        </div>
+<!--        <div class="grid grid-cols-3 gap-4 mb-4">-->
+<!--          <div>whois</div>-->
+<!--          <div>string</div>-->
+<!--          <div>(必选) 域名的whois信息</div>-->
+<!--        </div>-->
+<!--        <div class="grid grid-cols-3 gap-4">-->
+<!--          <div>lang</div>-->
+<!--          <div>string</div>-->
+<!--          <div>(可选) 语言代码 ISO 639-1，例: "zh"、"en"</div>-->
+<!--        </div>-->
+<!--        <div class="grid grid-cols-3 gap-4 mb-4">-->
+<!--          <div>time_zone</div>-->
+<!--          <div>string</div>-->
+<!--          <div>(可选) 时区，例: "8"、"-3"</div>-->
+<!--        </div>-->
+      </div>
+      <div class="px-6 py-4 border-t border-gray-200">
+        <div class="font-bold">输出参数</div>
+        <div class="mt-2">返回处理后的whois字符串</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+</style>