update docs

Author: wu-clan

docs/.vuepress/components/BannerTop.vue

@@ -1,32 +1,28 @@
 <script setup>
-import { onMounted, ref } from "vue";
+import { useStorage } from "@vueuse/core";
 
-const isDismissed = ref(false);
+const isDismissed = useStorage("fba-docs-banner-top", true);
 
 function dismiss() {
-  isDismissed.value = true;
+  isDismissed.value = false;
   if (typeof window !== 'undefined') {
-    localStorage.setItem("fba-docs-banner-top", "true");
+    localStorage.setItem("fba-docs-banner-top", false);
   }
   updateDocumentClass();
 }
 
 function updateDocumentClass() {
+  console.log(isDismissed.value);
   if (typeof window !== 'undefined') {
-    document.documentElement.classList.toggle("banner-dismissed", isDismissed.value);
+    document.documentElement.classList.toggle("banner-dismissed", !isDismissed.value);
   }
 }
 
-onMounted(() => {
-  if (typeof window !== 'undefined') {
-    isDismissed.value = localStorage.getItem("fba-docs-banner-top") === "true";
-    updateDocumentClass();
-  }
-});
+updateDocumentClass();
 </script>
 
 <template>
-  <div v-if="!isDismissed" class="banner">
+  <div class="banner">
     <p class="vp-banner-text">
       <span class="vp-text-primary">FBA </span>
       <span class="vp-tagline">· FasAPI</span>

docs/.vuepress/components/SponsorPanel.vue

@@ -54,7 +54,7 @@
 </template>
 
 <script setup>
-import { computed, onMounted, ref } from "vue";
+import { computed, onMounted } from "vue";
 import {
   defaultSponsor,
   generalSponsors,
@@ -63,8 +63,9 @@ import {
   shouldShowSponsor,
   sponsorUrl
 } from "../data/sponsors";
+import { useStorage } from "@vueuse/core";
 
-const isCollapsed = ref(false);
+const isCollapsed = useStorage('fba-docs-sponsor-collapsed', false);
 
 const processedGoldSponsors = computed(() => {
   return goldSponsors.map(brand => {
@@ -86,16 +87,9 @@ const shouldShowExtraBecomeSponsor = computed(() => {
 const toggleCollapse = () => {
   isCollapsed.value = !isCollapsed.value;
   if (typeof window !== 'undefined') {
-    localStorage.setItem("sponsorCollapsed", isCollapsed.value);
+    localStorage.setItem("fba-docs-sponsor-collapsed", isCollapsed.value);
   }
 };
-
-onMounted(() => {
-  if (typeof window !== 'undefined') {
-    const savedState = localStorage.getItem("sponsorCollapsed");
-    isCollapsed.value = savedState ? savedState === "true" : false;
-  }
-});
 </script>
 
 <style scoped>

docs/.vuepress/sidebar.ts

@@ -32,8 +32,8 @@ export const mySidebar: ThemeSidebarMulti = {
                 { text: 'Schema', link: 'schema' },
                 { text: '路由', link: 'router' },
                 { text: 'CRUD', link: 'CRUD' },
-                { text: '分页', link: 'pagination' },
                 { text: '接口响应', link: 'response' },
+                { text: '分页', link: 'pagination' },
                 { text: '自定义异常', link: '/planet', icon: 'fluent-color:receipt-16' },
                 { text: '节流', link: 'limit' },
                 { text: '切换数据库', link: 'db' },
@@ -63,13 +63,25 @@ export const mySidebar: ThemeSidebarMulti = {
     ],
     '/plugin/': [
         {
-            text: '插件',
+            text: '介绍',
             collapsed: false,
             items: [
                 { text: '前言', link: 'before' },
+                { text: '快速开始', link: 'install' },
+            ]
+        },
+        {
+            text: '开发',
+            collapsed: true,
+            items: [
                 { text: '插件开发', link: 'dev' },
                 { text: '插件发布', link: 'publish' },
-                { text: '安装使用', link: 'install' },
+            ]
+        },
+        {
+            text: '市场',
+            collapsed: false,
+            items: [
                 { text: '插件市场', badge: { text: 'New' }, link: 'market' },
             ]
         }

docs/.vuepress/styles/custom.css

@@ -44,6 +44,12 @@
     margin: 24px 0 40px !important;
 }
 
+/* 首页 box */
+.vp-home-feature:hover {
+    border: 1px solid var(--vp-c-brand-1);
+    background-color: rgba(0, 148, 133, 0.1);
+}
+
 .vp-swiper .swiper-slide-img {
     /* 轮播图图片拉伸效果 */
     object-fit: fill;

docs/plugin/install.md

@@ -1,11 +1,11 @@
 ---
-title: 安装使用
+title: 快速开始
 ---
 
-插件安装方式包含以下两种：
+您可以将 [插件市场](./market.md) 中的插件通过以下方式进行安装：
 
 :::: tabs
-@tab 1. 手动
+@tab 手动
 
 1. 获取插件仓库源码并下载
 2. 将源码中的插件目录直接拷贝到 fba 项目对应的目录下
@@ -23,7 +23,7 @@ title: 安装使用
 3. 如果插件包含依赖（requirements.txt），执行 `backend/scripts/init_plugin.py` 文件安装依赖
 4. 根据插件使用说明完成安装
 
-@tab 2. 自动
+@tab 半自动
 
 1. 获取打包好的插件 zip 压缩包 <Badge type="warning" text="二选一" />
 

docs/plugin/market.md

@@ -16,8 +16,6 @@ title: 插件市场
 
 ## 内置
 
-这些插件由 fba 内置
-
 <CardGrid>
   <Card icon="charm:shield-keyhole" title="Casbin-RBAC">
     <p style="color: #898989;">基于 Casbin 实现的 RBAC 权限</p>