fix bug

pages/repo/[repo_owner]/[repo_name]/blog/[id].vue

@@ -114,11 +114,11 @@ if (post.value) {
     setBannerContent(`
     <div class="text-center text-white">
       <div class="mb-2">
-        <a href="/repo/${route.params.repo_owner}/${route.params.repo_name}" class="text-lg font-semibold hover:underline">
+        <a href="/repo/${route.params.repo_owner}/${route.params.repo_name}" class="underline decoration-sky-500 text-base font-semibold hover:underline">
           ${route.params.repo_owner}/${route.params.repo_name}
         </a>
       </div>
-      <h1 class="text-4xl font-extrabold mb-4">${post.value.title}</h1>
+      <h1 class="text-3xl font-extrabold mb-4 ">${post.value.title}</h1>
       <div class="flex items-center justify-center">
         <img src="${post.value.avatar_url}" alt="${post.value.author}" class="w-10 h-10 rounded-full mr-3">
         <div class="text-left">

pages/repo/[repo_owner]/[repo_name]/tag/[name].vue

@@ -18,7 +18,7 @@ const perPage = ref(parseInt(config.public.perPageSize) || 20)
 
 const fetchBlogPosts = async (page = 1) => {
     const { data: fetchedData } = await useAsyncData('blogPosts', () =>
-        $fetch(`/api/repo/${config.public.repoOwner}/${config.public.repoName}/blog-posts`, {
+        $fetch(`/api/repo/${route.params.repo_owner}/${route.params.repo_name}/blog-posts`, {
             params: { page, perPage: perPage.value, tag: route.params.name }
         })
     )

pages/repo/index.vue

@@ -1,19 +1,43 @@
 <template>
   <div class="container mx-auto px-4 py-8">
-    <h1 class="text-3xl font-bold mb-8 text-center">Repositories</h1>
+    <!-- <h1 class="text-3xl font-bold mb-8 text-center">Repositories</h1> -->
     <div class="columns-1 sm:columns-1 md:columns-2 lg:columns-3 gap-2">
       <div v-for="repo in repos" :key="repo.id" class="break-inside-avoid mb-4">
         <RepoCard :repo="repo" />
       </div>
     </div>
+    <!-- 新增的输入框和按钮 -->
+    <div class="mt-12">
+      <div class="bg-white shadow-md rounded-lg overflow-hidden">
+        <div class="p-4">
+          <label for="repo-input" class="block text-sm font-medium text-gray-700 mb-2"> Enter Repository (e.g. gusibi/momo) </label>
+          <div class="mt-1 flex rounded-md shadow-sm">
+            <input type="text" name="repo-input" id="repo-input" v-model="repoInput" class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full rounded-none rounded-l-md sm:text-sm border-gray-300" placeholder="owner/repo">
+            <button @click="navigateToRepo" class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-r-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"> Go </button>
+          </div>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 <script setup lang="ts">
 import { ref } from 'vue'
+import { useRouter } from 'vue-router'
 import { useBannerContentInjection } from '~/composables/useBannerContent'
+
 const { setBannerContent, setBannerImage } = useBannerContentInjection()
 const repos = ref([])
+const router = useRouter()
+const repoInput = ref('')
 
+const navigateToRepo = () => {
+  const [owner, repo] = repoInput.value.split('/')
+  if (owner && repo) {
+    router.push(`/repo/${owner}/${repo}`)
+  } else {
+    alert('Please enter a valid repository in the format "owner/repo"')
+  }
+}
 // 使用 useAsyncData 来获取仓库数据
 const { data: reposData } = await useAsyncData('reposData', () =>
   $fetch('/api/repo/list')  // 假设你有一个 API 端点来获取仓库列表
@@ -23,6 +47,6 @@ const { data: reposData } = await useAsyncData('reposData', () =>
 repos.value = reposData.value.repos || []
 
 // 设置 banner 内容
-setBannerContent('<h1 class="text-4xl font-extrabold text-center text-white mb-6">My Repositories</h1>')
+setBannerContent('<h1 class="text-4xl font-extrabold text-center text-white mb-6">Explore, Learn, and Engage</h1>')
 setBannerImage("/repo-banner.jpeg")
 </script>

server/api/repo/[repo_owner]/[repo_name]/blog-posts.ts

@@ -40,6 +40,7 @@ export default defineEventHandler(async (event) => {
             labels: tag
         }
         req_data.labels = tag
+        // console.log("request: ", req_data)
 
         // 获取仓库的 issues 列表
         const { data: issues, headers } = await octokit.issues.listForRepo(req_data)

server/api/repo/list.ts

@@ -3,19 +3,27 @@ import { defineEventHandler, getQuery } from 'h3'
 const repos = [
     {
         name: "path-meme-db",
-        description: "A Nuxt.js project with cool features",
-        stars: 120,
+        description: "一些胡言乱语",
+        stars: 1,
         forks: 35,
         owner_name: "gusibi",
-        updated_at: "2023-05-15T10:30:00Z"
+        updated_at: "2024-10-05T10:30:00Z"
     },
     {
         name: "weekly",
-        description: "An awesome Vue.js library for developers",
-        stars: 250,
+        description: "科技爱好者周刊，每周五发布",
+        stars: 46801,
         forks: 60,
         owner_name: "ruanyf",
-        updated_at: "2023-05-10T14:45:00Z"
+        updated_at: "2024-10-05T14:45:00Z"
+    },
+    {
+        name: "Python",
+        description: "All Algorithms implemented in Python",
+        stars: 187181,
+        forks: 60,
+        owner_name: "TheAlgorithms",
+        updated_at: "2024-10-05T14:45:00Z"
     },
     // ... 添加更多仓库数据
 ]