chore: release v3.4.5.2

feat: add marketplace

.github/ISSUE_TEMPLATE/bug-report.yml

@@ -12,6 +12,8 @@ body:
         - Nakuru（go-cqhttp）
         - aiocqhttp（使用 OneBot 协议接入的）
         - qq-botpy（QQ官方API）
+        - lark（飞书）
+        - wecom（企业微信）
     validations:
       required: true
   - type: input
@@ -30,9 +32,9 @@ body:
   - type: textarea
     attributes:
       label: 复现步骤
-      description: 如何重现这个问题，越详细越好
+      description: 如何重现这个问题，越详细越好；请贴上所有相关的配置文件和元数据文件（注意隐去敏感信息）
     validations:
-      required: false
+      required: true
   - type: textarea
     attributes:
       label: 启用的插件

README.md

@@ -15,7 +15,6 @@
 <a href="https://docs.langbot.app/plugin/plugin-intro.html">插件介绍</a> ｜
 <a href="https://github.com/RockChinQ/LangBot/issues/new?assignees=&labels=%E7%8B%AC%E7%AB%8B%E6%8F%92%E4%BB%B6&projects=&template=submit-plugin.yml&title=%5BPlugin%5D%3A+%E8%AF%B7%E6%B1%82%E7%99%BB%E8%AE%B0%E6%96%B0%E6%8F%92%E4%BB%B6">提交插件</a>
 
-
 <div align="center">
 😎高稳定、🧩支持扩展、🦄多模态 - 大模型原生即时通信机器人平台🤖  
 </div>
@@ -33,7 +32,7 @@
 
 ## ✨ Features
 
-- 💬 大模型对话、Agent：支持多种大模型，适配群聊和私聊；具有多轮对话、工具调用、多模态能力，并深度适配 [Dify](https://dify.ai)。目前支持 QQ、QQ频道、企业微信、飞书，后续还将支持微信、WhatsApp、Discord等平台。
+- 💬 大模型对话、Agent：支持多种大模型，适配群聊和私聊；具有多轮对话、工具调用、多模态能力，并深度适配 [Dify](https://dify.ai)。目前支持 QQ、QQ频道、企业微信、飞书、Discord，后续还将支持个人微信、WhatsApp、Telegram 等平台。
 - 🛠️ 高稳定性、功能完备：原生支持访问控制、限速、敏感词过滤等机制；配置简单，支持多种部署方式。
 - 🧩 插件扩展、活跃社区：支持事件驱动、组件扩展等插件机制；丰富生态，目前已有数十个[插件](https://docs.langbot.app/plugin/plugin-intro.html)
 - 😻 [New] Web 管理面板：支持通过浏览器管理 LangBot 实例，具体支持功能，查看[文档](https://docs.langbot.app/webui/intro.html)
@@ -81,9 +80,12 @@
 | 平台 | 状态 | 备注 |
 | --- | --- | --- |
 | QQ 个人号 | ✅ | QQ 个人号私聊、群聊 |
-| QQ 官方机器人 | ✅ | QQ 频道机器人，支持频道、私聊、群聊 |
+| QQ 官方机器人 | ✅ | QQ 官方机器人，支持频道、私聊、群聊 |
 | 企业微信 | ✅ |  |
 | 飞书 | ✅ |  |
+| Discord | ✅ |  |
+| 个人微信 | 🚧 |  |
+| WhatsApp | 🚧 |  |
 | 钉钉 | 🚧 |  |
 
 🚧: 正在开发中
@@ -99,8 +101,11 @@
 | [xAI](https://x.ai/) | ✅ |  |
 | [智谱AI](https://open.bigmodel.cn/) | ✅ |  |
 | [Dify](https://dify.ai) | ✅ | LLMOps 平台 |
-| [Ollama](https://ollama.com/) | ✅ | 本地大模型管理平台 |
+| [Ollama](https://ollama.com/) | ✅ | 本地大模型运行平台 |
+| [LMStudio](https://lmstudio.ai/) | ✅ | 本地大模型运行平台 |
 | [GiteeAI](https://ai.gitee.com/) | ✅ | 大模型接口聚合平台 |
+| [SiliconFlow](https://siliconflow.cn/) | ✅ | 大模型聚合平台 |
+| [阿里云百炼](https://bailian.console.aliyun.com/) | ✅ | 大模型聚合平台 |
 
 ## 😘 社区贡献
 
@@ -109,4 +114,4 @@ LangBot 离不开以下贡献者和社区内所有人的贡献，我们欢迎任
 
 <a href="https://github.com/RockChinQ/LangBot/graphs/contributors">
   <img src="https://contrib.rocks/image?repo=RockChinQ/LangBot" />
-</a>
+</a>

pkg/core/bootutils/deps.py

@@ -26,7 +26,8 @@ required_deps = {
     "argon2": "argon2-cffi",
     "jwt": "pyjwt",
     "Crypto": "pycryptodome",
-    "lark_oapi": "lark-oapi"
+    "lark_oapi": "lark-oapi",
+    "discord": "discord.py"
 }
 
 

pkg/core/migrations/m022_lmstudio_config.py

@@ -0,0 +1,23 @@
+from __future__ import annotations
+
+from .. import migration
+
+
+@migration.migration_class("lmstudio-config", 22)
+class LmStudioConfigMigration(migration.Migration):
+    """迁移"""
+
+    async def need_migrate(self) -> bool:
+        """判断当前环境是否需要运行此迁移"""
+        
+        return 'lmstudio-chat-completions' not in self.ap.provider_cfg.data['requester']
+
+    async def run(self):
+        """执行迁移"""
+        self.ap.provider_cfg.data['requester']['lmstudio-chat-completions'] = {
+            "base-url": "http://127.0.0.1:1234/v1",
+            "args": {},
+            "timeout": 120
+        }
+
+        await self.ap.provider_cfg.dump_config()

pkg/core/migrations/m023_siliconflow_config.py

@@ -0,0 +1,27 @@
+from __future__ import annotations
+
+from .. import migration
+
+
+@migration.migration_class("siliconflow-config", 23)
+class SiliconFlowConfigMigration(migration.Migration):
+    """迁移"""
+
+    async def need_migrate(self) -> bool:
+        """判断当前环境是否需要运行此迁移"""
+        
+        return 'siliconflow-chat-completions' not in self.ap.provider_cfg.data['requester']
+
+    async def run(self):
+        """执行迁移"""
+        self.ap.provider_cfg.data['keys']['siliconflow'] = [
+            "xxxxxxx"
+        ]
+
+        self.ap.provider_cfg.data['requester']['siliconflow-chat-completions'] = {
+            "base-url": "https://api.siliconflow.cn/v1",
+            "args": {},
+            "timeout": 120
+        }
+
+        await self.ap.provider_cfg.dump_config()

pkg/core/migrations/m024_discord_config.py

@@ -0,0 +1,28 @@
+from __future__ import annotations
+
+from .. import migration
+
+
+@migration.migration_class("discord-config", 24)
+class DiscordConfigMigration(migration.Migration):
+    """迁移"""
+
+    async def need_migrate(self) -> bool:
+        """判断当前环境是否需要运行此迁移"""
+        
+        for adapter in self.ap.platform_cfg.data['platform-adapters']:
+            if adapter['adapter'] == 'discord':
+                return False
+
+        return True
+
+    async def run(self):
+        """执行迁移"""
+        self.ap.platform_cfg.data['platform-adapters'].append({
+            "adapter": "discord",
+            "enable": False,
+            "client_id": "1234567890",
+            "token": "XXXXXXXXXX"
+        })
+
+        await self.ap.platform_cfg.dump_config()

pkg/core/stages/migrate.py

@@ -8,7 +8,7 @@ from ..migrations import m001_sensitive_word_migration, m002_openai_config_migra
 from ..migrations import m005_deepseek_cfg_completion, m006_vision_config, m007_qcg_center_url, m008_ad_fixwin_config_migrate, m009_msg_truncator_cfg
 from ..migrations import m010_ollama_requester_config, m011_command_prefix_config, m012_runner_config, m013_http_api_config, m014_force_delay_config
 from ..migrations import m015_gitee_ai_config, m016_dify_service_api, m017_dify_api_timeout_params, m018_xai_config, m019_zhipuai_config
-from ..migrations import m020_wecom_config, m021_lark_config
+from ..migrations import m020_wecom_config, m021_lark_config, m022_lmstudio_config, m023_siliconflow_config, m024_discord_config
 
 
 @stage.stage_class("MigrationStage")

pkg/platform/manager.py

@@ -37,7 +37,7 @@ class PlatformManager:
     
     async def initialize(self):
 
-        from .sources import nakuru, aiocqhttp, qqbotpy, wecom, lark
+        from .sources import nakuru, aiocqhttp, qqbotpy, wecom, lark, discord
 
         async def on_friend_message(event: platform_events.FriendMessage, adapter: msadapter.MessageSourceAdapter):
 

pkg/platform/sources/discord.py

@@ -0,0 +1,264 @@
+from __future__ import annotations
+
+import discord
+
+import typing
+import asyncio
+import traceback
+import time
+import re
+import base64
+import uuid
+import json
+import os
+import datetime
+
+import aiohttp
+
+from .. import adapter
+from ...pipeline.longtext.strategies import forward
+from ...core import app
+from ..types import message as platform_message
+from ..types import events as platform_events
+from ..types import entities as platform_entities
+from ...utils import image
+
+
+class DiscordMessageConverter(adapter.MessageConverter):
+
+    @staticmethod
+    async def yiri2target(
+        message_chain: platform_message.MessageChain
+    ) -> typing.Tuple[str, typing.List[discord.File]]:
+        for ele in message_chain:
+            if isinstance(ele, platform_message.At):
+                message_chain.remove(ele)
+                break
+
+        text_string = ""
+        image_files = []
+
+        for ele in message_chain:
+            if isinstance(ele, platform_message.Image):
+                image_bytes = None
+
+                if ele.base64:
+                    image_bytes = base64.b64decode(ele.base64)
+                elif ele.url:
+                    async with aiohttp.ClientSession() as session:
+                        async with session.get(ele.url) as response:
+                            image_bytes = await response.read()
+                elif ele.path:
+                    with open(ele.path, "rb") as f:
+                        image_bytes = f.read()
+
+                image_files.append(discord.File(fp=image_bytes, filename=f"{uuid.uuid4()}.png"))
+            elif isinstance(ele, platform_message.Plain):
+                text_string += ele.text
+
+        return text_string, image_files
+
+    @staticmethod
+    async def target2yiri(
+        message: discord.Message
+    ) -> platform_message.MessageChain:
+        lb_msg_list = []
+
+        msg_create_time = datetime.datetime.fromtimestamp(
+            int(message.created_at.timestamp())
+        )
+
+        lb_msg_list.append(
+            platform_message.Source(id=message.id, time=msg_create_time)
+        )
+
+        element_list = []
+
+        def text_element_recur(text_ele: str) -> list[platform_message.MessageComponent]:
+            if text_ele == "":
+                return []
+
+            # <@1234567890>
+            # @everyone
+            # @here
+            at_pattern = re.compile(r"(@everyone|@here|<@[\d]+>)")
+            at_matches = at_pattern.findall(text_ele)
+            
+            if len(at_matches) > 0:
+                mid_at = at_matches[0]
+
+                text_split = text_ele.split(mid_at)
+
+                mid_at_component = []
+
+                if mid_at == "@everyone" or mid_at == "@here":
+                    mid_at_component.append(platform_message.AtAll())
+                else:
+                    mid_at_component.append(platform_message.At(target=mid_at[2:-1]))
+
+                return text_element_recur(text_split[0]) + \
+                    mid_at_component + \
+                    text_element_recur(text_split[1])
+            else:
+                return [platform_message.Plain(text=text_ele)]
+
+        
+        element_list.extend(text_element_recur(message.content))
+
+        # attachments
+        for attachment in message.attachments:
+            async with aiohttp.ClientSession(trust_env=True) as session:
+                async with session.get(attachment.url) as response:
+                    image_data = await response.read()
+                    image_base64 = base64.b64encode(image_data).decode("utf-8")
+                    image_format = response.headers["Content-Type"]
+                    element_list.append(platform_message.Image(base64=f"data:{image_format};base64,{image_base64}"))
+
+        return platform_message.MessageChain(element_list)
+
+
+class DiscordEventConverter(adapter.EventConverter):
+
+    @staticmethod
+    async def yiri2target(
+        event: platform_events.Event
+    ) -> discord.Message:
+        pass
+
+    @staticmethod
+    async def target2yiri(
+        event: discord.Message
+    ) -> platform_events.Event:
+        message_chain = await DiscordMessageConverter.target2yiri(event)
+
+        if type(event.channel) == discord.DMChannel:
+            return platform_events.FriendMessage(
+                sender=platform_entities.Friend(
+                    id=event.author.id,
+                    nickname=event.author.name,
+                    remark=event.channel.id,
+                ),
+                message_chain=message_chain,
+                time=event.created_at.timestamp(),
+                source_platform_object=event,
+            )
+        elif type(event.channel) == discord.TextChannel:
+            return platform_events.GroupMessage(
+                sender=platform_entities.GroupMember(
+                    id=event.author.id,
+                    member_name=event.author.name,
+                    permission=platform_entities.Permission.Member,
+                    group=platform_entities.Group(
+                        id=event.channel.id,
+                        name=event.channel.name,
+                        permission=platform_entities.Permission.Member,
+                    ),
+                    special_title="",
+                    join_timestamp=0,
+                    last_speak_timestamp=0,
+                    mute_time_remaining=0,
+                ),
+                message_chain=message_chain,
+                time=event.created_at.timestamp(),
+                source_platform_object=event,
+            )
+
+@adapter.adapter_class("discord")
+class DiscordMessageSourceAdapter(adapter.MessageSourceAdapter):
+
+    bot: discord.Client
+
+    bot_account_id: str  # 用于在流水线中识别at是否是本bot，直接以bot_name作为标识
+
+    config: dict
+
+    ap: app.Application
+
+    message_converter: DiscordMessageConverter = DiscordMessageConverter()
+    event_converter: DiscordEventConverter = DiscordEventConverter()
+
+    listeners: typing.Dict[
+        typing.Type[platform_events.Event],
+        typing.Callable[[platform_events.Event, adapter.MessageSourceAdapter], None],
+    ] = {}
+
+    def __init__(self, config: dict, ap: app.Application):
+        self.config = config
+        self.ap = ap
+
+        self.bot_account_id = self.config["client_id"]
+
+        adapter_self = self
+
+        class MyClient(discord.Client):
+
+            async def on_message(self: discord.Client, message: discord.Message):
+                if message.author.id == self.user.id or message.author.bot:
+                    return
+
+                lb_event = await adapter_self.event_converter.target2yiri(message)
+                await adapter_self.listeners[type(lb_event)](lb_event, adapter_self)
+
+        intents = discord.Intents.default()
+        intents.message_content = True
+
+        args = {}
+
+        if os.getenv("http_proxy"):
+            args["proxy"] = os.getenv("http_proxy")
+
+        self.bot = MyClient(intents=intents, **args)
+        
+    async def send_message(
+        self, target_type: str, target_id: str, message: platform_message.MessageChain
+    ):
+        pass
+
+    async def reply_message(
+        self,
+        message_source: platform_events.MessageEvent,
+        message: platform_message.MessageChain,
+        quote_origin: bool = False,
+    ):
+        msg_to_send, image_files = await self.message_converter.yiri2target(message)
+        assert isinstance(message_source.source_platform_object, discord.Message)
+
+        args = {
+            "content": msg_to_send,
+        }
+
+        if len(image_files) > 0:
+            args["files"] = image_files
+
+        if quote_origin:
+            args["reference"] = message_source.source_platform_object
+
+        if message.has(platform_message.At):
+            args["mention_author"] = True
+
+        await message_source.source_platform_object.channel.send(**args)
+
+    async def is_muted(self, group_id: int) -> bool:
+        return False
+
+    def register_listener(
+        self,
+        event_type: typing.Type[platform_events.Event],
+        callback: typing.Callable[[platform_events.Event, adapter.MessageSourceAdapter], None],
+    ):
+        self.listeners[event_type] = callback
+
+    def unregister_listener(
+        self,
+        event_type: typing.Type[platform_events.Event],
+        callback: typing.Callable[[platform_events.Event, adapter.MessageSourceAdapter], None],
+    ):
+        self.listeners.pop(event_type)
+
+    async def run_async(self):
+        async with self.bot:
+            await self.bot.start(self.config["token"], reconnect=True)
+
+    async def kill(self) -> bool:
+        await self.bot.close()
+        return True

pkg/platform/types/events.py

@@ -72,6 +72,11 @@ class MessageEvent(Event):
     message_chain: platform_message.MessageChain
     """消息内容。"""
 
+    source_platform_object: typing.Optional[typing.Any] = None
+    """原消息平台对象。
+    供消息平台适配器开发者使用，如果回复用户时需要使用原消息事件对象的信息，
+    那么可以将其存到这个字段以供之后取出使用。"""
+
 
 class FriendMessage(MessageEvent):
     """好友消息。

pkg/provider/modelmgr/modelmgr.py

@@ -6,7 +6,7 @@ from . import entities, requester
 from ...core import app
 
 from . import token
-from .requesters import chatcmpl, anthropicmsgs, moonshotchatcmpl, deepseekchatcmpl, ollamachat, giteeaichatcmpl, xaichatcmpl, zhipuaichatcmpl
+from .requesters import chatcmpl, anthropicmsgs, moonshotchatcmpl, deepseekchatcmpl, ollamachat, giteeaichatcmpl, xaichatcmpl, zhipuaichatcmpl, lmstudiochatcmpl, siliconflowchatcmpl
 
 FETCH_MODEL_LIST_URL = "https://api.qchatgpt.rockchin.top/api/v2/fetch/model_list"
 
@@ -109,4 +109,4 @@ class ModelManager:
                 self.model_list.append(model_info)
             
             except Exception as e:
-                self.ap.logger.error(f"初始化模型 {model['name']} 失败: {e} ,请检查配置文件")
+                self.ap.logger.error(f"初始化模型 {model['name']} 失败: {type(e)} {e} ,请检查配置文件")

pkg/provider/modelmgr/requesters/lmstudiochatcmpl.py

@@ -0,0 +1,21 @@
+from __future__ import annotations
+
+import openai
+
+from . import chatcmpl
+from .. import requester
+from ....core import app
+
+
+@requester.requester_class("lmstudio-chat-completions")
+class LmStudioChatCompletions(chatcmpl.OpenAIChatCompletions):
+    """LMStudio ChatCompletion API 请求器"""
+
+    client: openai.AsyncClient
+
+    requester_cfg: dict
+
+    def __init__(self, ap: app.Application):
+        self.ap = ap
+
+        self.requester_cfg = self.ap.provider_cfg.data['requester']['lmstudio-chat-completions']

pkg/provider/modelmgr/requesters/siliconflowchatcmpl.py

@@ -0,0 +1,21 @@
+from __future__ import annotations
+
+import openai
+
+from . import chatcmpl
+from .. import requester
+from ....core import app
+
+
+@requester.requester_class("siliconflow-chat-completions")
+class SiliconFlowChatCompletions(chatcmpl.OpenAIChatCompletions):
+    """SiliconFlow ChatCompletion API 请求器"""
+
+    client: openai.AsyncClient
+
+    requester_cfg: dict
+
+    def __init__(self, ap: app.Application):
+        self.ap = ap
+
+        self.requester_cfg = self.ap.provider_cfg.data['requester']['siliconflow-chat-completions']

pkg/utils/constants.py

@@ -1,4 +1,4 @@
-semantic_version = "v3.4.4.1"
+semantic_version = "v3.4.5.2"
 
 debug_mode = False
 

requirements.txt

@@ -26,6 +26,7 @@ argon2-cffi
 pyjwt
 pycryptodome
 lark-oapi
+discord.py
 
 # indirect
 taskgroup==0.0.0a4

templates/platform.json

@@ -42,6 +42,12 @@
             "app_id": "cli_abcdefgh",
             "app_secret": "XXXXXXXXXX",
             "bot_name": "LangBot"
+        },
+        {
+            "adapter": "discord",
+            "enable": false,
+            "client_id": "1234567890",
+            "token": "XXXXXXXXXX"
         }
     ],
     "track-function-calls": true,

templates/provider.json

@@ -22,6 +22,9 @@
         ],
         "zhipuai": [
             "xxxxxxx"
+        ],
+        "siliconflow": [
+            "xxxxxxx"
         ]
     },
     "requester": {
@@ -66,6 +69,16 @@
             "base-url": "https://open.bigmodel.cn/api/paas/v4",
             "args": {},
             "timeout": 120
+        },
+        "lmstudio-chat-completions": {
+            "base-url": "http://127.0.0.1:1234/v1",
+            "args": {},
+            "timeout": 120
+        },
+        "siliconflow-chat-completions": {
+            "base-url": "https://api.siliconflow.cn/v1",
+            "args": {},
+            "timeout": 120
         }
     },
     "model": "gpt-4o",

templates/schema/platform.json

@@ -213,6 +213,37 @@
                                 "description": "飞书的bot_name"
                             }
                         }
+                    },
+                    {
+                        "title": "Discord 适配器",
+                        "description": "用于接入 Discord",
+                        "properties": {
+                            "adapter": {
+                                "type": "string",
+                                "const": "discord"
+                            },
+                            "enable": {
+                                "type": "boolean",
+                                "default": false,
+                                "description": "是否启用此适配器",
+                                "layout": {
+                                    "comp": "switch",
+                                    "props": {
+                                        "color": "primary"
+                                    }
+                                }
+                            },
+                            "client_id": {
+                                "type": "string",
+                                "default": "",
+                                "description": "Discord 的 client_id"
+                            },
+                            "token": {
+                                "type": "string",
+                                "default": "",
+                                "description": "Discord 的 token"
+                            }
+                        }
                     }
                 ]
             }

templates/schema/provider.json

@@ -74,6 +74,14 @@
                         "type": "string"
                     },
                     "default": []
+                },
+                "siliconflow": {
+                    "type": "array",
+                    "title": "SiliconFlow API 密钥",
+                    "items": {
+                        "type": "string"
+                    },
+                    "default": []
                 }
             }
         },
@@ -240,6 +248,46 @@
                             "default": 120
                         }
                     }
+                },
+                "lmstudio-chat-completions": {
+                    "type": "object",
+                    "title": "LMStudio API 请求配置",
+                    "description": "仅可编辑 URL 和 超时时间，额外请求参数不支持可视化编辑，请到编辑器编辑",
+                    "properties": {
+                        "base-url": {
+                            "type": "string",
+                            "title": "API URL"
+                        },
+                        "args": {
+                            "type": "object",
+                            "default": {}
+                        },
+                        "timeout": {
+                            "type": "number",
+                            "title": "API 请求超时时间",
+                            "default": 120
+                        }
+                    }
+                },
+                "siliconflow-chat-completions": {
+                    "type": "object",
+                    "title": "SiliconFlow API 请求配置",
+                    "description": "仅可编辑 URL 和 超时时间，额外请求参数不支持可视化编辑，请到编辑器编辑",
+                    "properties": {
+                        "base-url": {
+                            "type": "string",
+                            "title": "API URL"
+                        },
+                        "args": {
+                            "type": "object",
+                            "default": {}
+                        },
+                        "timeout": {
+                            "type": "number",
+                            "title": "API 请求超时时间",
+                            "default": 120
+                        }
+                    }
                 }
             }
         },

web/src/components/MarketPluginCard.vue

@@ -0,0 +1,181 @@
+<template>
+    <div class="plugin-card">
+        <div class="plugin-card-header">
+            <div class="plugin-id">
+                <div class="plugin-card-author">{{ plugin.author }} /</div>
+                <div class="plugin-card-title">{{ plugin.name }}</div>
+            </div>
+            <div class="plugin-card-badges">
+                <v-icon class="plugin-github-source" icon="mdi-github" v-if="plugin.repository != ''"
+                    @click="openGithubSource"></v-icon>
+            </div>
+        </div>
+        <div class="plugin-card-description" >{{ plugin.description }}</div>
+
+        <div class="plugin-card-brief-info">
+            <div class="plugin-card-brief-info-item">
+                <v-icon id="plugin-stars-icon" icon="mdi-star" />
+                <div id="plugin-stars-count">{{ plugin.stars }}</div>
+            </div>
+            <v-btn color="primary" @click="installPlugin" density="compact">安装</v-btn>
+        </div>
+    </div>
+</template>
+
+<script setup>
+const props = defineProps({
+    plugin: {
+        type: Object,
+        required: true
+    },
+});
+
+const emit = defineEmits(['install']);
+
+const openGithubSource = () => {
+    window.open("https://"+props.plugin.repository, '_blank');
+}
+
+const installPlugin = () => {
+    emit('install', props.plugin);
+}
+
+</script>
+
+<style scoped>
+.plugin-card {
+    border: 1px solid #e0e0e0;
+    border-radius: 8px;
+    padding: 0.8rem;
+    padding-left: 1rem;
+    margin: 1rem 0;
+    background-color: white;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    height: 10rem;
+}
+
+.plugin-card-header {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+}
+
+.plugin-card-author {
+    font-size: 0.8rem;
+    color: #666;
+    font-weight: 500;
+    user-select: none;
+}
+
+.plugin-card-title {
+    font-size: 0.9rem;
+    font-weight: 600;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    user-select: none;
+}
+
+.plugin-card-description {
+    font-size: 0.7rem;
+    color: #666;
+    font-weight: 500;
+    margin-top: -1rem;
+    height: 2rem;
+    /* 超出部分自动换行，最多两行 */
+    text-overflow: ellipsis;
+    overflow-y: hidden;
+    white-space: wrap;
+    user-select: none;
+}
+
+.plugin-card-badges {
+    display: flex;
+    flex-direction: row;
+    gap: 0.5rem;
+}
+
+.plugin-github-source {
+    cursor: pointer;
+    color: #222;
+    font-size: 1.3rem;
+}
+
+.plugin-disabled {
+    font-size: 0.7rem;
+    font-weight: 500;
+    height: 1.3rem;
+    padding-inline: 0.4rem;
+    user-select: none;
+}
+
+
+.plugin-card-brief-info {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    /* background-color: #f0f0f0; */
+    gap: 0.8rem;
+    margin-left: -0.2rem;
+    margin-bottom: 0rem;
+}
+
+.plugin-card-events {
+    display: flex;
+    flex-direction: row;
+    gap: 0.4rem;
+}
+
+.plugin-card-events-icon {
+    font-size: 1.8rem;
+    color: #666;
+}
+
+.plugin-card-events-count {
+    font-size: 1.2rem;
+    font-weight: 600;
+    color: #666;
+}
+
+.plugin-card-functions {
+    display: flex;
+    flex-direction: row;
+    gap: 0.4rem;
+}
+
+.plugin-card-functions-icon {
+    font-size: 1.6rem;
+    color: #666;
+}
+
+.plugin-card-functions-count {
+    font-size: 1.2rem;
+    font-weight: 600;
+    color: #666;
+}
+
+.plugin-card-brief-info-item {
+    display: flex;
+    flex-direction: row;
+    gap: 0.4rem;
+}
+
+#plugin-stars-icon {
+    color: #0073ff;
+}
+
+#plugin-stars-count {
+    margin-top: 0.1rem;
+    font-weight: 700;
+    color: #0073ff;
+    user-select: none;
+}
+
+.plugin-card-brief-info-item:hover .plugin-card-brief-info-item-icon {
+    color: #333;
+}
+
+
+</style>

web/src/components/Marketplace.vue

@@ -0,0 +1,228 @@
+<template>
+    <div id="marketplace-container">
+        <div id="marketplace-search-bar">
+            
+            <span style="width: 14rem;">
+                <v-text-field id="marketplace-search-bar-search-input" variant="solo" v-model="proxy.$store.state.marketplaceParams.query" label="搜索"
+                    density="compact" @update:model-value="updateSearch" />
+            </span>
+            <!--下拉选择排序-->
+            <span style="width: 10rem;">
+                <v-select id="marketplace-search-bar-sort-select" v-model="sort" :items="sortItems" variant="solo"
+                    label="排序" density="compact" @update:model-value="updateSort" />
+            </span>
+            <span style="margin-left: 1rem;">
+                <div id="marketplace-search-bar-total-plugins-count">
+                    共 {{ proxy.$store.state.marketplaceTotalPluginsCount }} 个插件
+                </div>
+            </span>
+            <span style="margin-left: 1rem;">
+                <!-- 分页 -->
+                <v-pagination style="width: 14rem;" v-model="proxy.$store.state.marketplaceParams.page"
+                    :length="proxy.$store.state.marketplaceTotalPages" variant="solo" density="compact"
+                    total-visible="4" @update:model-value="updatePage" />
+            </span>
+        </div>
+        <div id="marketplace-plugins-container" ref="pluginsContainer">
+            <div id="marketplace-plugins-container-inner">
+                <MarketPluginCard v-for="plugin in proxy.$store.state.marketplacePlugins" :key="plugin.id" :plugin="plugin" @install="installPlugin" />
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import MarketPluginCard from './MarketPluginCard.vue'
+
+import { ref, getCurrentInstance, onMounted } from 'vue'
+
+import { inject } from "vue";
+
+const snackbar = inject('snackbar');
+
+const { proxy } = getCurrentInstance()
+
+const pluginsContainer = ref(null)
+
+const sortItems = ref([
+    '最近新增',
+    '最多星标',
+    '最近更新',
+])
+
+const sortParams = ref({
+    '最近新增': {
+        sort_by: 'created_at',
+        sort_order: 'DESC',
+    },
+    '最多星标': {
+        sort_by: 'stars',
+        sort_order: 'DESC',
+    },
+    '最近更新': {
+        sort_by: 'pushed_at',
+        sort_order: 'DESC',
+    }
+})
+
+const sort = ref(sortItems.value[0])
+
+proxy.$store.state.marketplaceParams.sort_by = sortParams.value[sort.value].sort_by
+proxy.$store.state.marketplaceParams.sort_order = sortParams.value[sort.value].sort_order
+
+const updateSort = (value) => {
+    console.log(value)
+    proxy.$store.state.marketplaceParams.sort_by = sortParams.value[value].sort_by
+    proxy.$store.state.marketplaceParams.sort_order = sortParams.value[value].sort_order
+    proxy.$store.state.marketplaceParams.page = 1
+
+    console.log(proxy.$store.state.marketplaceParams)
+    fetchMarketplacePlugins()
+}
+
+const updatePage = (value) => {
+    proxy.$store.state.marketplaceParams.page = value
+    fetchMarketplacePlugins()
+}
+
+const updateSearch = (value) => {
+    console.log(value)
+    proxy.$store.state.marketplaceParams.query = value
+    proxy.$store.state.marketplaceParams.page = 1
+    fetchMarketplacePlugins()
+}
+
+const calculatePluginsPerPage = () => {
+    if (!pluginsContainer.value) return 10
+    
+    const containerWidth = pluginsContainer.value.clientWidth
+    const containerHeight = pluginsContainer.value.clientHeight
+
+    console.log(containerWidth, containerHeight)
+    
+    // 每个卡片宽度18rem + gap 16px
+    const cardWidth = 18 * 16 + 16 // rem转px
+    // 每个卡片高度9rem + gap 16px
+    const cardHeight = 9 * 16 + 16
+    
+    // 计算每行可以放几个卡片
+    const cardsPerRow = Math.floor(containerWidth / cardWidth)
+    // 计算每行可以放几行
+    const rows = Math.floor(containerHeight / cardHeight)
+    
+    // 计算每页总数
+    const perPage = cardsPerRow * rows
+    
+    proxy.$store.state.marketplaceParams.per_page = perPage > 0 ? perPage : 10
+}
+
+const fetchMarketplacePlugins = async () => {
+    calculatePluginsPerPage()
+    proxy.$axios.post('https://space.langbot.app/api/v1/market/plugins', {
+        query: proxy.$store.state.marketplaceParams.query,
+        sort_by: proxy.$store.state.marketplaceParams.sort_by,
+        sort_order: proxy.$store.state.marketplaceParams.sort_order,
+        page: proxy.$store.state.marketplaceParams.page,
+        page_size: proxy.$store.state.marketplaceParams.per_page,
+    }).then(response => {
+        console.log(response.data)
+        if (response.data.code != 0) {
+            snackbar.error(response.data.msg)
+            return
+        }
+
+        // 解析出 name 和 author
+        response.data.data.plugins.forEach(plugin => {
+            plugin.name = plugin.repository.split('/')[2]
+            plugin.author = plugin.repository.split('/')[1]
+        })
+
+        proxy.$store.state.marketplacePlugins = response.data.data.plugins
+        proxy.$store.state.marketplaceTotalPluginsCount = response.data.data.total
+
+        let totalPages = Math.floor(response.data.data.total / proxy.$store.state.marketplaceParams.per_page)
+        if (response.data.data.total % proxy.$store.state.marketplaceParams.per_page != 0) {
+            totalPages += 1
+        }
+        proxy.$store.state.marketplaceTotalPages = totalPages
+    }).catch(error => {
+        snackbar.error(error)
+    })
+}
+
+onMounted(() => {
+    calculatePluginsPerPage()
+    fetchMarketplacePlugins()
+    
+    // 监听窗口大小变化
+    window.addEventListener('resize', () => {
+        calculatePluginsPerPage()
+        fetchMarketplacePlugins()
+    })
+})
+
+const emit = defineEmits(['installPlugin'])
+
+const installPlugin = (plugin) => {
+    emit('installPlugin', plugin.repository)
+}
+</script>
+
+<style scoped>
+#marketplace-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+}
+
+#marketplace-search-bar {
+    display: flex;
+    flex-direction: row;
+    margin-top: 1rem;
+    padding-right: 1rem;
+    gap: 1rem;
+    width: 100%;
+}
+
+#marketplace-search-bar-search-input {
+    position: relative;
+    left: 1rem;
+    width: 10rem;
+}
+
+#marketplace-search-bar-total-plugins-count {
+    font-size: 1.1rem;
+    font-weight: 500;
+    margin-top: 0.5rem;
+    color: #666;
+    user-select: none;
+}
+
+.plugin-card {
+    width: 18rem;
+    height: 9rem;
+}
+
+#marketplace-plugins-container {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+    gap: 16px;
+    margin-inline: 0rem;
+    width: 100%;
+    height: calc(100vh - 16rem);
+    overflow-y: auto;
+}
+
+#marketplace-plugins-container-inner {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+    gap: 16px;
+}
+</style>

web/src/pages/Plugins.vue

@@ -2,6 +2,10 @@
     <PageTitle title="插件" @refresh="refresh" />
     <v-card id="plugins-toolbar">
         <div id="view-btns">
+            <v-btn-toggle id="plugins-view-toggle" color="primary" v-model="proxy.$store.state.pluginsView" mandatory density="compact">
+                <v-btn class="plugins-view-toggle-btn" value="installed" density="compact">已安装</v-btn>
+                <v-btn class="plugins-view-toggle-btn" value="market" density="compact">插件市场</v-btn>
+            </v-btn-toggle>
         </div>
         <div id="operation-btns">
             <v-tooltip text="设置插件优先级" location="top">
@@ -78,17 +82,21 @@
             </v-btn>
         </div>
     </v-card>
-    <div class="plugins-container">
+    <div class="plugins-container" v-if="proxy.$store.state.pluginsView == 'installed'">
         <v-alert id="no-plugins-alert" v-if="plugins.length == 0" color="warning" icon="$warning" title="暂无插件" text="暂无已安装的插件，请安装插件" density="compact" style="margin-inline: 1rem;"></v-alert>
         <PluginCard class="plugin-card" v-if="plugins.length > 0" v-for="plugin in plugins" :key="plugin.name" :plugin="plugin"
             @toggle="togglePlugin" @update="updatePlugin" @remove="removePlugin" />
     </div>
+    <div class="plugins-container" v-if="proxy.$store.state.pluginsView == 'market'">
+        <Marketplace @installPlugin="installMarketplacePlugin" />
+    </div>
 </template>
 
 <script setup>
 
 import PageTitle from '@/components/PageTitle.vue'
 import PluginCard from '@/components/PluginCard.vue'
+import Marketplace from '@/components/Marketplace.vue'
 
 import draggable from 'vuedraggable'
 
@@ -154,6 +162,12 @@ const removePlugin = (plugin) => {
     })
 }
 
+const installMarketplacePlugin = (repository) => {
+
+    installDialogSource.value = 'https://'+repository
+    isInstallDialogActive.value = true
+}
+
 const installPlugin = () => {
 
     if (installDialogSource.value == '' || installDialogSource.value.trim() == '') {
@@ -224,6 +238,11 @@ const installDialogSource = ref('')
     margin-left: 1rem;
 }
 
+#plugins-view-toggle {
+    margin: 0.5rem;
+    box-shadow: 0 0 0 2px #dddddd;
+}
+
 #operation-btns {
     display: flex;
     flex-direction: row;

web/src/store/index.js

@@ -18,7 +18,18 @@ export default createStore({
       tokenValid: false,
       systemInitialized: true,
       jwtToken: '',
-    }
+    },
+    pluginsView: 'installed',
+    marketplaceParams: {
+      query: '',
+      page: 1,
+      per_page: 10,
+      sort_by: 'pushed_at',
+      sort_order: 'DESC',
+    },
+    marketplacePlugins: [],
+    marketplaceTotalPages: 0,
+    marketplaceTotalPluginsCount: 0,
   },
   mutations: {
     initializeFetch() {