update docs

Author: wu-clan

docs/.vuepress/components/AsideNavAfter.vue

@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { VPLink } from 'vuepress-theme-plume/client'
+import { useRouteLocale } from 'vuepress/client'
+
+interface Locale {
+  star: string
+  issue: string
+  sponsor: string
+}
+
+</script>
+
+<template>
+  <div class="aside-nav-wrapper">
+    <VPLink class="link" no-icon href="https://github.com/fastapi-practices/fastapi_best_architecture">
+      <span class="vpi-github-star" />
+      <span class="link-text">在 GitHub 上 Star</span>
+      <span class="vpi-arrow-right" />
+    </VPLink>
+    <VPLink class="link" no-icon href="/questions.html">
+      <span class="vpi-github-issue" />
+      <span class="link-text">遇到问题？</span>
+      <span class="vpi-arrow-right" />
+    </VPLink>
+  </div>
+</template>
+
+<style scoped>
+.aside-nav-wrapper {
+  display: flex;
+  flex-direction: column;
+  padding: 8px 0;
+  margin: 8px 8px 0;
+  border-top: solid 1px var(--vp-c-divider);
+}
+
+.aside-nav-wrapper .link {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+  font-size: 14px;
+  color: var(--vp-c-text-3);
+  transition: color var(--vp-t-color);
+}
+
+.aside-nav-wrapper .link:hover {
+  color: var(--vp-c-brand-1);
+}
+
+.aside-nav-wrapper .link .link-text {
+  flex: 1 2;
+  font-size: 12px;
+}
+
+.vpi-github-star {
+  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m12 1.5l3.1 6.3l6.9 1l-5 4.8l1.2 6.9l-6.2-3.2l-6.2 3.2L7 13.6L2 8.8l6.9-1z'/%3E%3C/svg%3E");
+}
+
+.vpi-github-issue {
+  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M8 9.5a1.5 1.5 0 1 0 0-3a1.5 1.5 0 0 0 0 3'/%3E%3Cpath fill='%23000' d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0M1.5 8a6.5 6.5 0 1 0 13 0a6.5 6.5 0 0 0-13 0'/%3E%3C/svg%3E");
+}
+</style>

docs/.vuepress/components/SponsorPanel.vue

@@ -2,8 +2,8 @@
   <div class="sponsor-header" @click="toggleCollapse">
     <span>倾情赞助</span>
     <span class="toggle-icon">
-       <Icon v-if="isCollapsed" name="iconamoon:arrow-right-2"/>
-       <Icon v-else name="iconamoon:arrow-down-2"/>
+      <Icon v-if="isCollapsed" name="iconamoon:arrow-right-2" />
+      <Icon v-else name="iconamoon:arrow-down-2" />
     </span>
   </div>
   <div class="sponsor-container" v-if="!isCollapsed">
@@ -33,18 +33,26 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, onMounted } from "vue";
 import { goldSponsors, generalSponsors } from "../data/sponsors";
 
-const isCollapsed = ref(false);
+const isCollapsed = ref(sessionStorage.getItem("sponsorCollapsed") === "true");
 
 const toggleCollapse = () => {
   isCollapsed.value = !isCollapsed.value;
+  sessionStorage.setItem("sponsorCollapsed", isCollapsed.value);
 };
 
 const openSponsorLink = (href) => {
   window.open(href, "_blank");
 };
+
+onMounted(() => {
+  const savedState = sessionStorage.getItem("sponsorCollapsed");
+  if (savedState !== null) {
+    isCollapsed.value = savedState === "true";
+  }
+});
 </script>
 
 <style scoped>

docs/.vuepress/data/sponsors.ts

@@ -6,7 +6,7 @@ export const homeSponsor = ref(
     {
         link: '',
         text: '成为赞助商',
-        href: '',
+        href: sponsorUrl,
         alt: 'wu-clan',
         description: 'fba 官方合作伙伴',
     }

docs/.vuepress/layouts/Layout.vue

@@ -1,23 +1,25 @@
 <script setup>
 import { Layout } from "vuepress-theme-plume/client";
 import SponsorPanel from "../components/SponsorPanel.vue";
+import AsideNavAfter from "../components/AsideNavAfter.vue";
 </script>
 
 <template>
   <Layout>
-    <template #aside-outline-after>
+    <template #layout-top>
       <div class="custom-content">
-        <SponsorPanel />
+        <BannerTop />
       </div>
     </template>
     <template #sidebar-nav-before>
       <div class="custom-content">
         <SponsorSidebar />
       </div>
     </template>
-    <template #layout-top>
+    <template #aside-outline-after>
       <div class="custom-content">
-        <BannerTop />
+        <SponsorPanel />
+        <AsideNavAfter />
       </div>
     </template>
   </Layout>

docs/questions.md

@@ -2,6 +2,10 @@
 title: 常见问题
 ---
 
+::: tip
+如果以下解决方案未能帮助到您，请通过 [互动](./group.md) 与我们联系
+:::
+
 ## Redis 缓存
 
 由于缓存机制的特性，非接口操作对数据的更改可能无法实时反映到结果中。以下是两种常见场景：

docs/sponsors.md

@@ -66,7 +66,7 @@ fba 是一款基于 FastAPI 框架的后端架构解决方案，遵循伪三层
       <td>
         - 首页独家展示位<br>
         - 文档左侧边栏独家展示位<br>
-        - 不可折叠<br>
+        - 固定不可折叠<br>
         - 移动端可见
       </td>
       <td rowspan="2">
@@ -83,7 +83,7 @@ fba 是一款基于 FastAPI 框架的后端架构解决方案，遵循伪三层
       <td>
         - 首页信息展播展示位<br>
         - 文档右侧边栏大号展示位<br>
-        - 不可折叠
+        - 可折叠
     </td>
     </tr>
     <tr>
@@ -92,7 +92,8 @@ fba 是一款基于 FastAPI 框架的后端架构解决方案，遵循伪三层
       <td>联系作者</td>
       <td>
         - 首页滚动展示位<br>
-        - 文档右侧边栏小号展示位
+        - 文档右侧边栏小号展示位<br>
+        - 可折叠
       </td>
       <td>
         - 赞助商名称<br>