update docs

Author: wu-clan

.prettierrc.json5

@@ -24,6 +24,6 @@ export default defineClientConfig({
         Layout,
         NotFound: () => h(NotFound, null, {
             'layout-top': () => h(BannerTop),
-          }),
+        }),
     }
 })

docs/.vuepress/client.ts

@@ -1,24 +1,15 @@
-<script setup lang="ts">
-import { computed } from 'vue'
+<script lang="ts" setup>
 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">
+    <VPLink class="link" href="https://github.com/fastapi-practices/fastapi_best_architecture" no-icon>
       <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">
+    <VPLink class="link" href="/questions.html" no-icon>
       <span class="vpi-github-issue" />
       <span class="link-text">遇到问题？</span>
       <span class="vpi-arrow-right" />

docs/.vuepress/components/AsideNavAfter.vue

@@ -1,30 +1,32 @@
 <script setup>
-import { ref, onMounted } from "vue";
+import { onMounted, ref } from "vue";
 
 const isDismissed = ref(false);
 
 function dismiss() {
   isDismissed.value = true;
-  sessionStorage.setItem("fba-docs-banner-top", "true");
+  if (typeof window !== 'undefined') {
+    localStorage.setItem("fba-docs-banner-top", "true");
+  }
   updateDocumentClass();
 }
 
 function updateDocumentClass() {
-  if (isDismissed.value) {
-    document.documentElement.classList.add("banner-dismissed");
-  } else {
-    document.documentElement.classList.remove("banner-dismissed");
+  if (typeof window !== 'undefined') {
+    document.documentElement.classList.toggle("banner-dismissed", isDismissed.value);
   }
 }
 
 onMounted(() => {
-  isDismissed.value = sessionStorage.getItem("fba-docs-banner-top") === "true";
-  updateDocumentClass();
+  if (typeof window !== 'undefined') {
+    isDismissed.value = localStorage.getItem("fba-docs-banner-top") === "true";
+    updateDocumentClass();
+  }
 });
 </script>
 
 <template>
-  <div class="banner" v-if="!isDismissed">
+  <div v-if="!isDismissed" class="banner">
     <p class="vp-banner-text">
       <span class="vp-text-primary">FBA </span>
       <span class="vp-tagline">· FasAPI</span>
@@ -117,6 +119,7 @@ button {
   .vp-tagline {
     display: none;
   }
+
   .vp-primary-action {
     padding: 5px 5px;
   }
@@ -130,6 +133,7 @@ button {
   .vp-place {
     display: none;
   }
+
   .vp-date {
     display: none;
   }

docs/.vuepress/components/BannerTop.vue

@@ -1,12 +1,12 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import { homeSponsor } from "../data/sponsors";
 </script>
 
 <template>
   <section v-if="homeSponsor.href && homeSponsor.link" id="special-spsr">
     <span>特别赞助商</span>
     <a :href="homeSponsor.href" target="_blank">
-      <img width="121" :src="homeSponsor.link" :alt="homeSponsor.alt" />
+      <img :alt="homeSponsor.alt" :src="homeSponsor.link" width="121" />
     </a>
     <span>fba 官方合作伙伴</span>
   </section>

docs/.vuepress/components/SponsorHome.vue

@@ -9,14 +9,14 @@
   <div class="sponsor-container">
     <div class="gold-sponsors">
       <div
-        v-for="(sponsor, index) in goldSponsors"
-        :key="'gold-' + index"
-        class="sponsor-item gold"
-        :class="{ 'collapsed-mode': isCollapsed }"
-        @click="openSponsorLink(sponsor.href)"
-        v-show="!isCollapsed || (isCollapsed && !sponsor.alt.includes('成为赞助商'))"
+          v-for="(sponsor, index) in goldSponsors"
+          v-show="!isCollapsed || (isCollapsed && !sponsor.alt.includes('成为赞助商'))"
+          :key="'gold-' + index"
+          :class="{ 'collapsed-mode': isCollapsed }"
+          class="sponsor-item gold"
+          @click="openSponsorLink(sponsor.href)"
       >
-        <img v-if="sponsor.link" :src="sponsor.link" :alt="sponsor.alt" class="sponsor-image" />
+        <img v-if="sponsor.link" :alt="sponsor.alt" :src="sponsor.link" class="sponsor-image" />
         <span v-if="!isCollapsed && sponsor.alt.includes('成为赞助商')" class="sponsor-text">
           {{ sponsor.alt }}
         </span>
@@ -27,14 +27,14 @@
     </div>
     <div class="general-sponsors">
       <div
-        v-for="(sponsor, index) in generalSponsors"
-        :key="'general-' + index"
-        class="sponsor-item"
-        :class="{ 'collapsed-mode': isCollapsed }"
-        @click="openSponsorLink(sponsor.href)"
-        v-show="!isCollapsed || (isCollapsed && !sponsor.alt.includes('成为赞助商'))"
+          v-for="(sponsor, index) in generalSponsors"
+          v-show="!isCollapsed || (isCollapsed && !sponsor.alt.includes('成为赞助商'))"
+          :key="'general-' + index"
+          :class="{ 'collapsed-mode': isCollapsed }"
+          class="sponsor-item"
+          @click="openSponsorLink(sponsor.href)"
       >
-        <img v-if="sponsor.link" :src="sponsor.link" :alt="sponsor.alt" class="sponsor-image" />
+        <img v-if="sponsor.link" :alt="sponsor.alt" :src="sponsor.link" class="sponsor-image" />
         <span v-if="!isCollapsed && sponsor.alt.includes('成为赞助商')" class="sponsor-text">
           {{ sponsor.alt }}
         </span>
@@ -50,28 +50,33 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from "vue";
-import { sponsorUrl, goldSponsors, generalSponsors } from "../data/sponsors";
+import { onMounted, ref } from "vue";
+import { generalSponsors, goldSponsors, sponsorUrl } from "../data/sponsors";
 
-const isCollapsed = ref(sessionStorage.getItem("sponsorCollapsed") === "true");
+const isCollapsed = ref(false);
 
 const toggleCollapse = () => {
   isCollapsed.value = !isCollapsed.value;
-  sessionStorage.setItem("sponsorCollapsed", isCollapsed.value);
+  if (typeof window !== 'undefined') {
+    localStorage.setItem("sponsorCollapsed", isCollapsed.value);
+  }
 };
 
 const openSponsorLink = (href) => {
-  window.open(href, "_blank");
+  if (typeof window !== 'undefined') {
+    window.open(href, "_blank");
+  }
 };
 
 onMounted(() => {
-  const savedState = sessionStorage.getItem("sponsorCollapsed");
-  if (savedState !== null) {
-    isCollapsed.value = savedState === "true";
+  if (typeof window !== 'undefined') {
+    const savedState = localStorage.getItem("sponsorCollapsed");
+    isCollapsed.value = savedState ? savedState === "true" : false;
   }
 });
 </script>
 
+
 <style scoped>
 .sponsor-header {
   display: flex;

docs/.vuepress/components/SponsorPanel.vue

@@ -5,7 +5,7 @@
   <div class="sponsor-container">
     <div class="sidebar-sponsor">
       <div class="sponsor" @click="openSponsorLink(homeSponsor.href)">
-        <img v-if="homeSponsor.link" :src="homeSponsor.link" :alt="homeSponsor.alt" class="sponsor-image" />
+        <img v-if="homeSponsor.link" :alt="homeSponsor.alt" :src="homeSponsor.link" class="sponsor-image" />
         <span v-else class="sponsor-text">成为赞助商</span>
       </div>
     </div>

docs/.vuepress/components/SponsorSidebar.vue

@@ -1,5 +1,5 @@
-<script setup lang="ts">
-import type { AutoplayOptions, SwiperModule, Swiper as SwiperType } from "swiper/types";
+<script lang="ts" setup>
+import type { AutoplayOptions, Swiper as SwiperType, SwiperModule } from "swiper/types";
 import { useMutationObserver } from "@vueuse/core";
 import {
   Autoplay,
@@ -67,16 +67,16 @@ const props = withDefaults(defineProps<Props>(), {
 
 const slideList = computed<SlideItem[]>(() => {
   return (
-    props.items?.map((link) => {
-      if (typeof link === "string") return { link };
-      return link;
-    }) ?? []
+      props.items?.map((link) => {
+        if (typeof link === "string") return { link };
+        return link;
+      }) ?? []
   );
 });
 
 function parseSize(size: number | string) {
   if (typeof size === "number") {
-    return `${size}px`;
+    return `${ size }px`;
   }
   return size;
 }
@@ -123,7 +123,7 @@ const autoplay = computed<AutoplayOptions | boolean>(() => {
 });
 
 const hasNavigation = computed(() =>
-  props.mode === "banner" || props.mode === "broadcast" ? props.navigation : false
+    props.mode === "banner" || props.mode === "broadcast" ? props.navigation : false
 );
 
 let swiper: SwiperType;
@@ -139,13 +139,13 @@ function onSwiper(_swiper: SwiperType) {
 onMounted(() => {
   if (props.mode === "carousel" && !props.pauseOnMouseEnter) {
     useMutationObserver(
-      () => document.documentElement,
-      () => {
-        if (!swiper) return;
-        swiper.wrapperEl.style.transform = "translate3d(0px, 0px, 0px)";
-        setTimeout(() => swiper.update(), 350);
-      },
-      { attributeFilter: ["data-theme"] }
+        () => document.documentElement,
+        () => {
+          if (!swiper) return;
+          swiper.wrapperEl.style.transform = "translate3d(0px, 0px, 0px)";
+          setTimeout(() => swiper.update(), 350);
+        },
+        { attributeFilter: ["data-theme"] }
     );
   }
 });
@@ -154,44 +154,44 @@ onMounted(() => {
 <template>
   <ClientOnly>
     <Swiper
-      class="vp-swiper"
-      :class="{ 'swiper-no-swiping': mode === 'banner' ? !swipe : mode === 'carousel' }"
-      :style="styles"
-      :modules="modules"
-      :autoplay="autoplay"
-      :navigation="hasNavigation"
-      :pagination="
+        :autoplay="autoplay"
+        :class="{ 'swiper-no-swiping': mode === 'banner' ? !swipe : mode === 'carousel' }"
+        :effect="mode === 'banner' ? effect : 'slide'"
+        :loop="loop"
+        :modules="modules"
+        :navigation="hasNavigation"
+        :pagination="
         props.mode !== 'carousel'
           ? {
               dynamicBullets: true,
               clickable: true
             }
           : false
       "
-      :speed="speed"
-      :loop="loop"
-      :effect="mode === 'banner' ? effect : 'slide'"
-      lazy
-      v-bind="$attrs"
-      @swiper="onSwiper"
+        :speed="speed"
+        :style="styles"
+        class="vp-swiper"
+        lazy
+        v-bind="$attrs"
+        @swiper="onSwiper"
     >
       <SwiperSlide v-for="(item, index) in slideList" :key="'general-' + index">
         <a
-          v-if="item.href && item.link"
-          :href="item.href"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="swiper-slide-link no-icon"
+            v-if="item.href && item.link"
+            :href="item.href"
+            class="swiper-slide-link no-icon"
+            rel="noopener noreferrer"
+            target="_blank"
         >
-          <img class="swiper-slide-custom-container swiper-slide-img" :src="item.link" :alt="item.alt" />
+          <img :alt="item.alt" :src="item.link" class="swiper-slide-custom-container swiper-slide-img" />
         </a>
         <div v-else-if="item.alt" class="swiper-slide-custom-container">
           <a
-            v-if="item.href"
-            :href="item.href"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="swiper-slide-text-link"
+              v-if="item.href"
+              :href="item.href"
+              class="swiper-slide-text-link"
+              rel="noopener noreferrer"
+              target="_blank"
           >
             <div class="swiper-slide-text">{{ item.alt }}</div>
           </a>

docs/.vuepress/components/Swiper.vue

@@ -44,7 +44,7 @@ export const myNavbar = defineNavbarConfig([
         ]
     },
     {
-        text: 'v1.1.1',
+        text: 'v1.1.2',
         items: [
             {
                 text: '线上演示',

docs/.vuepress/navbar.ts

@@ -1,4 +1,3 @@
-import { text } from "mermaid/dist/rendering-util/rendering-elements/shapes/text.js";
 import { ThemeSidebarMulti } from "vuepress-theme-plume";