update docs

Author: wu-clan

docs/.vuepress/components/PluginMarket.vue

@@ -12,7 +12,7 @@
     <div
         v-for="(item, index) in filteredItems"
         :key="index"
-        :class="{ 'clickable': item.link }"
+        :class="{ 'clickable': item.link, 'expired': item.expired }"
         class="plugin-card"
         @click="handleCardClick(item)"
     >
@@ -32,6 +32,9 @@
         >
           <span class="price-corner-text">Not Free</span>
         </div>
+        <div v-if="item.expired" class="expired-overlay">
+          <span class="expired-text">已过期</span>
+        </div>
       </div>
       <div class="card-content">
         <div class="card-title-row">
@@ -57,6 +60,7 @@
           />
         </div>
       </div>
+      <div v-if="item.expired" class="expired-overlay-card"></div>
     </div>
   </div>
 </template>
@@ -74,6 +78,7 @@ export interface PluginItem {
   image?: string
   logo: string
   free?: boolean
+  expired?: boolean
 }
 
 const props = withDefaults(
@@ -141,6 +146,7 @@ const handleCardClick = (item: PluginItem) => {
   height: 100%;
   max-height: 360px;
   border: 1px solid var(--vp-c-border);
+  position: relative;
 }
 
 .plugin-card.clickable:hover {
@@ -292,6 +298,35 @@ const handleCardClick = (item: PluginItem) => {
   border-color: var(--vp-c-brand);
 }
 
+.expired-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.expired-overlay-card {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.6);
+  z-index: 3;
+  pointer-events: none;
+}
+
+.expired-text {
+  color: white;
+  font-size: 1.5rem;
+  font-weight: bold;
+}
+
 @media (max-width: 767px) {
   .plugin-card-container {
     grid-template-columns: repeat(1, 1fr);

docs/.vuepress/data/plugin.ts

@@ -6,42 +6,42 @@ export const pluginItems: PluginItem[] = [
         title: "代码生成",
         description: "生成通用业务代码",
         tags: ["mysql", "pgsql", "后端", "前端"],
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "fe:notice-active",
         title: "通知公告",
         description: "发布系统内部通知、公告",
         tags: ["mysql", "pgsql", "后端", "前端"],
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "fluent-mdl2:dictionary",
         title: "数据字典",
         description: "通常用于约束前端工程数据传输/展示",
         tags: ["mysql", "pgsql", "后端", "前端"],
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "icon-park-outline:config",
         title: "参数配置",
         description: "通常用于动态配置系统参数/前端工程数据展示",
         tags: ["mysql", "pgsql", "后端", "前端"],
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "logos:oauth",
         title: "OAuth 2.0",
         description: "通过 OAuth 2.0 的方式登录系统",
         tags: ["mysql", "pgsql", "后端"],
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "ic:twotone-email",
         title: "Email",
         description: "发送电子邮件，例如验证码、通知等",
         tags: ["mysql", "pgsql", "后端"],
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "charm:shield-keyhole",
@@ -51,7 +51,7 @@ export const pluginItems: PluginItem[] = [
         tags: ["mysql", "pgsql", "后端"],
         link: "https://github.com/fastapi-practices/casbin_rbac",
         image: "https://avatars.githubusercontent.com/u/27810343?s=200&v=4",
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "codicon:mcp",
@@ -60,7 +60,7 @@ export const pluginItems: PluginItem[] = [
         label: '官方',
         tags: ["mysql", "pgsql", "后端"],
         link: "https://github.com/fastapi-practices/mcp",
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "ant-design:aliyun-outlined",
@@ -70,7 +70,7 @@ export const pluginItems: PluginItem[] = [
         tags: ["mysql", "pgsql", "后端"],
         link: "https://github.com/fastapi-practices/aliyun_oss",
         image: "https://registry.npmmirror.com/@lobehub/icons-static-png/latest/files/dark/alibabacloud-color.png",
-        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png'
+        logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
     },
     {
         icon: "material-symbols:token-outline",
@@ -90,6 +90,7 @@ export const pluginItems: PluginItem[] = [
         link: "https://github.com/dividduang/wecom-task",
         image: "https://play-lh.googleusercontent.com/Grc8X-UKT5qlDyUeGACwt9npfGFi8RM5N7lxZHfEtavSSu5zavMdv1YwBB3rHYokorw=w240-h480-rw",
         logo: 'https://avatars.githubusercontent.com/u/110005582?v=4',
+        expired: true,
     },
     {
         icon: "arcticons:sso-plus",
@@ -100,7 +101,7 @@ export const pluginItems: PluginItem[] = [
         link: "/fastapi_best_architecture_docs/planet.html",
         image: "https://casdoor.org/zh/img/casdoor.png",
         logo: 'https://wu-clan.github.io/picx-images-hosting/logo/fba.png',
-        free: false
+        free: false,
     },
     {
         icon: "material-icon-theme:authors",