feat: finish toggle plugin

web_ui/src/app/home/plugins/plugin-installed/PluginCardVO.ts

@@ -4,6 +4,7 @@ export interface IPluginCardVO {
     name: string,
     description: string,
     handlerCount: number,
+    isInitialized: boolean,
 }
 
 export class PluginCardVO implements IPluginCardVO {
@@ -12,6 +13,7 @@ export class PluginCardVO implements IPluginCardVO {
     name: string;
     author: string;
     version: string;
+    isInitialized: boolean;
 
     constructor(prop: IPluginCardVO) {
         this.description = prop.description
@@ -19,6 +21,7 @@ export class PluginCardVO implements IPluginCardVO {
         this.name = prop.name
         this.author = prop.author
         this.version = prop.version
+        this.isInitialized = prop.isInitialized
     }
 
 }

web_ui/src/app/home/plugins/plugin-installed/PluginInstalledComponent.tsx

@@ -8,7 +8,6 @@ import styles from "@/app/home/plugins/plugins.module.css";
 import {Modal, Input} from "antd";
 import {GithubOutlined} from "@ant-design/icons";
 import {httpClient} from "@/app/infra/http/HttpClient";
-import * as http from "node:http";
 
 export default function PluginInstalledComponent () {
     const [pluginList, setPluginList] = useState<PluginCardVO[]>([])
@@ -32,7 +31,8 @@ export default function PluginInstalledComponent () {
                     description: plugin.description.zh_CN,
                     handlerCount: 0,
                     name: plugin.name,
-                    version: plugin.version
+                    version: plugin.version,
+                    isInitialized: plugin.status === "initialized",
                 })
             }))
         })

web_ui/src/app/home/plugins/plugin-installed/plugin-card/PluginCardComponent.tsx

@@ -1,13 +1,28 @@
 import styles from "./pluginCard.module.css"
 import {PluginCardVO} from "@/app/home/plugins/plugin-installed/PluginCardVO";
 import {GithubOutlined, LinkOutlined, ToolOutlined} from '@ant-design/icons';
-import {Tag} from 'antd'
+import {Switch, Tag} from 'antd'
+import {useState} from "react";
+import {httpClient} from "@/app/infra/http/HttpClient";
 
 export default function PluginCardComponent({
     cardVO
 }: {
     cardVO: PluginCardVO
 }) {
+    const [initialized, setInitialized] = useState(cardVO.isInitialized)
+    const [switchEnable, setSwitchEnable] = useState(true)
+
+    function handleEnable() {
+        setSwitchEnable(false)
+        httpClient.togglePlugin(cardVO.author, cardVO.name, !initialized).then(result => {
+            setInitialized(!initialized)
+        }).catch(err => {
+            console.log("error: ", err)
+        }).finally(() => {
+            setSwitchEnable(true)
+        })
+    }
     return (
         <div className={`${styles.cardContainer}`}>
             {/*  header  */}
@@ -41,6 +56,12 @@ export default function PluginCardComponent({
                         style={{fontSize: '22px'}}
                     />
                 </div>
+
+                <Switch
+                    value={initialized}
+                    onClick={handleEnable}
+                    disabled={!switchEnable}
+                />
             </div>
         </div>
     );

web_ui/src/app/home/plugins/plugin-installed/plugin-card/pluginCard.module.css

@@ -40,6 +40,10 @@
 .cardFooter {
     width: 90%;
     height: 30px;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
 }
 
 

web_ui/src/app/infra/api/api-types/index.ts

@@ -193,7 +193,7 @@ export interface MarketPlugin {
     artifacts_path: string
     stars: number
     downloads: number
-    status: "synced" | string // 可根据实际状态值扩展联合类型
+    status: "initialized" | "mounted" // 可根据实际状态值扩展联合类型
     synced_at: string
     pushed_at: string // 最后一次代码推送时间
 }

web_ui/src/app/infra/http/HttpClient.ts

@@ -339,7 +339,7 @@ class HttpClient {
     name: string,
     target_enabled: boolean
   ): Promise<object> {
-    return this.post(`/api/v1/plugins/${author}/${name}/toggle`, {
+    return this.put(`/api/v1/plugins/${author}/${name}/toggle`, {
       target_enabled
     });
   }