feat:forge支持批量导出

Author: luoluoTH

app/renderer/src/main/src/pages/ai-agent/aiChatWelcome/AIChatWelcome.tsx

@@ -16,6 +16,7 @@ import {YakitButton} from "@/components/yakitUI/YakitButton/YakitButton"
 import {
     OutlineArrowrightIcon,
     OutlineCloseIcon,
+    OutlineExportIcon,
     OutlineImportIcon,
     OutlineInformationcircleIcon,
     OutlineOpenIcon,
@@ -246,6 +247,7 @@ const AIChatWelcome: React.FC<AIChatWelcomeProps> = React.memo(
             return randomAIMaterialsDataIsEmpty(randomAIMaterialsData)
         }, [randomAIMaterials])
 
+        const [isSelectForgeName, setIsSelectForgeName] = useState<boolean>(false)
         const knowledgeSidebarListRef = useRef<KnowledgeModalRef>(null)
         const forgeNameRef = useRef<ForgeNameRef>(null)
         const {installPlug, refresh: refreshPluginStatus, ThirdPartyBinaryRunAsync} = useCheckKnowledgePlugin()
@@ -289,8 +291,17 @@ const AIChatWelcome: React.FC<AIChatWelcomeProps> = React.memo(
                 {
                     label: t("AIChatWelcome.skillBase"),
                     key: "skills",
-                    children: <ForgeName ref={forgeNameRef} />,
+                    children: <ForgeName ref={forgeNameRef} onSelectChange={setIsSelectForgeName} />,
                     extra: [
+                        <YakitButton
+                            key='batch-import'
+                            onClick={() => {
+                                forgeNameRef.current?.onBatchExport()
+                            }}
+                            type='text2'
+                            icon={<OutlineExportIcon />}
+                            disabled={!isSelectForgeName}
+                        />,
                         <YakitButton
                             key='import'
                             onClick={() => {
@@ -325,7 +336,7 @@ const AIChatWelcome: React.FC<AIChatWelcomeProps> = React.memo(
                     ]
                 }
             ]
-        }, [api, streams, installPlug, i18n.language])
+        }, [api, streams, installPlug, i18n.language, isSelectForgeName])
 
         return (
             <div className={styles["ai-chat-welcome-wrapper"]} ref={welcomeRef}>

app/renderer/src/main/src/pages/ai-agent/defaultConstant.tsx

@@ -45,6 +45,7 @@ import {DefaultMemoryList, DefaultPlanHistoryList} from "../ai-re-act/hooks/defa
 import {ColorsAIIcon} from "@/assets/icon/colors"
 import {AIGlobalConfig, AIModelTypeFileName} from "./aiModelList/utils"
 import {cloneDeep} from "lodash"
+import {ExportAIForgeRequest} from "./forgeName/type"
 
 /** AI-Agent 页面的唯一 id */
 export const YakitAIAgentPageID = "yakit-ai-agent"
@@ -375,3 +376,12 @@ export const defaultAIGlobalConfig: AIGlobalConfig = {
     LightweightModels: [],
     VisionModels: []
 }
+
+export const defaultExportAIForgeRequest: ExportAIForgeRequest = {
+    ForgeNames: [],
+    TargetPath: "",
+    OutputName: "",
+    ToolNames: [],
+    Password: "",
+    Filter: {}
+}

app/renderer/src/main/src/pages/ai-agent/forgeName/ForgeName.module.scss

@@ -10,7 +10,7 @@
         padding: 8px 12px 0 12px;
         display: flex;
         flex-direction: column;
-        gap: 12px;
+        gap: 8px;
         .haeder-first {
             display: flex;
             justify-content: space-between;
@@ -31,13 +31,24 @@
         }
 
         .header-second {
+            display: flex;
+            flex-direction: column;
+            gap: 8px;
             .search-icon {
                 svg {
                     width: 16px;
                     height: 16px;
                     color: var(--Colors-Use-Neutral-Text-3-Secondary);
                 }
             }
+            .select-all {
+                display: flex;
+                align-items: center;
+                gap: 4px;
+                color: var(--Colors-Use-Neutral-Text-1-Title);
+                font-size: 12px;
+                font-weight: 400;
+            }
         }
     }
 }
@@ -84,6 +95,10 @@
         font-size: 12px;
         font-weight: 400;
         line-height: 16px;
+
+        display: flex;
+        align-items: center;
+        gap: 4px;
     }
     .item-extra {
         display: none;
@@ -109,7 +124,7 @@
 .forge-opt-popover {
     padding-left: 4px;
     :global {
-        .ant-popover-inner{
+        .ant-popover-inner {
             border: none;
         }
         .ant-popover-inner-content {

app/renderer/src/main/src/pages/ai-agent/forgeName/ForgeName.tsx

@@ -22,6 +22,7 @@ import {
     useDebounceFn,
     useInViewport,
     useMemoizedFn,
+    useSelections,
     useThrottleFn,
     useUpdateEffect,
     useVirtualList
@@ -37,7 +38,7 @@ import {YakitButton} from "@/components/yakitUI/YakitButton/YakitButton"
 import {YakitRoute} from "@/enums/yakitRoute"
 import {Form, Tooltip} from "antd"
 import {yakitNotify} from "@/utils/notification"
-import {AIForgeListDefaultPagination, ReActChatEventEnum} from "../defaultConstant"
+import {AIForgeListDefaultPagination, defaultExportAIForgeRequest, ReActChatEventEnum} from "../defaultConstant"
 import {YakitPopconfirm} from "@/components/yakitUI/YakitPopconfirm/YakitPopconfirm"
 import {AIForge, QueryAIForgeRequest, QueryAIForgeResponse} from "../type/forge"
 import ImportExportModal, {ImportExportModalExtra} from "@/components/ImportExportModal/ImportExportModal"
@@ -51,14 +52,18 @@ import {LogListInfo} from "@/components/YakitUploadModal/YakitUploadModal"
 
 import classNames from "classnames"
 import styles from "./ForgeName.module.scss"
+import {YakitProtoCheckbox} from "@/components/TableVirtualResize/YakitProtoCheckbox/YakitProtoCheckbox"
+import {YakitCheckbox} from "@/components/yakitUI/YakitCheckbox/YakitCheckbox"
+import {cloneDeep} from "lodash"
 const {ipcRenderer} = window.require("electron")
 
 export interface ForgeNameRef {
     openAdd: () => void
     openImport: () => void
+    onBatchExport: () => void
 }
 
-const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
+const ForwardForgeName = forwardRef((props: ForgeNameProps, ref: Ref<ForgeNameRef>) => {
     // const {} = props
 
     // #region AIForge 模板增删改功能 使用功能
@@ -288,16 +293,15 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
         apiKey: "ExportAIForge"
     })
     const logListRef = useRef<LogListInfo[]>([])
-    const forgeNamesRef = useRef<string[]>([])
-    const toolNames = useRef<string[]>([])
-    const outputNameRef = useRef<string>("")
+    const forgeExtraParams = useRef<ExportAIForgeRequest>(cloneDeep(defaultExportAIForgeRequest))
     const handleOpenImportExportHint = useMemoizedFn((extra: Omit<ImportExportModalExtra, "hint">) => {
         if (importExportExtra.hint) return
         setImportExportExtra({...extra, hint: true})
     })
 
     const exportPath = useRef<string>("")
     const handleFinishedImportExportHint = useMemoizedFn((result: boolean) => {
+        onResetExportExtraParams()
         if (result) {
             const type = importExportExtra.type
             if (type === "import") {
@@ -397,16 +401,56 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
         }
     }
     // #endregion
+    // #region AIForge 批量导出
+    const {selected, allSelected, isSelected, toggle, toggleAll, partiallySelected} = useSelections(data.Data)
+    useEffect(() => {
+        props.onSelectChange(selected.length > 0)
+    }, [selected.length])
+    const onBatchExport = useMemoizedFn(() => {
+        const query: ExportAIForgeRequest = {
+            ForgeNames: [],
+            OutputName: "",
+            Filter: {
+                Keyword: ""
+            }
+        }
+        if (allSelected) {
+            query.Filter = {
+                Keyword: search
+            }
+        } else {
+            query.ForgeNames = selected.map((item) => item.ForgeName) as any
+        }
+        forgeExtraParams.current = {
+            ...forgeExtraParams.current,
+            ...query
+        }
+        handleOpenImportExportHint({
+            title: "导出技能",
+            type: "export",
+            apiKey: "ExportAIForge"
+        })
+    })
 
-    useImperativeHandle(ref, () => ({
-        openAdd: handleNewAIForge,
-        openImport: () =>
-            handleOpenImportExportHint({
-                title: "导入技能",
-                type: "import",
-                apiKey: "ImportAIForge"
-            })
-    }))
+    const onResetExportExtraParams = useMemoizedFn(() => {
+        forgeExtraParams.current = cloneDeep(defaultExportAIForgeRequest)
+    })
+    //#endregion
+
+    useImperativeHandle(
+        ref,
+        () => ({
+            openAdd: handleNewAIForge,
+            openImport: () =>
+                handleOpenImportExportHint({
+                    title: "导入技能",
+                    type: "import",
+                    apiKey: "ImportAIForge"
+                }),
+            onBatchExport: () => onBatchExport()
+        }),
+        []
+    )
 
     return (
         <div ref={wrapper} className={styles["forge-name"]}>
@@ -439,6 +483,14 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
                         value={search}
                         onChange={(e) => setSearch(e.target.value)}
                     />
+                    <div className={styles["select-all"]}>
+                        <YakitCheckbox
+                            checked={allSelected}
+                            onChange={() => toggleAll()}
+                            indeterminate={partiallySelected}
+                        />
+                        <span>全选</span>
+                    </div>
                 </div>
             </div>
 
@@ -500,13 +552,17 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
                                     >
                                         <div className={styles["forge-list-opt"]} onClick={() => handleOnClick(data)}>
                                             <div
-                                                className={classNames(
-                                                    styles["opt-title"],
-                                                    "yakit-content-single-ellipsis"
-                                                )}
+                                                className={classNames(styles["opt-title"])}
                                                 title={ForgeVerboseName || ForgeName}
                                             >
-                                                {ForgeVerboseName || ForgeName}
+                                                <YakitProtoCheckbox
+                                                    checked={isSelected(data)}
+                                                    onChange={() => toggle(data)}
+                                                    onClick={(e) => e.stopPropagation()}
+                                                />
+                                                <div className='yakit-content-single-ellipsis'>
+                                                    {ForgeVerboseName || ForgeName}
+                                                </div>
                                             </div>
 
                                             <div className={styles["item-extra"]}>
@@ -520,9 +576,12 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
                                                         icon={<OutlineExportIcon />}
                                                         onClick={(e) => {
                                                             e.stopPropagation()
-                                                            forgeNamesRef.current = [ForgeName]
-                                                            toolNames.current = tools
-                                                            outputNameRef.current = ForgeVerboseName || ForgeName || ""
+                                                            forgeExtraParams.current = {
+                                                                ...forgeExtraParams.current,
+                                                                ForgeNames: [ForgeName],
+                                                                ToolNames: tools,
+                                                                OutputName: ForgeVerboseName || ForgeName || ""
+                                                            }
                                                             handleOpenImportExportHint({
                                                                 title: "导出技能",
                                                                 type: "export",
@@ -594,7 +653,10 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
                 <ImportExportModal<ExportAIForgeFormValues, ExportAIForgeRequest, ExportImportAIForgeProgress>
                     {...commonImportExportProps}
                     formProps={{
-                        initialValues: {OutputName: outputNameRef.current || "", ToolNames: toolNames.current}
+                        initialValues: {
+                            OutputName: forgeExtraParams.current?.OutputName || "",
+                            ToolNames: forgeExtraParams.current?.ToolNames || []
+                        }
                     }}
                     renderForm={() => (
                         <>
@@ -650,7 +712,7 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
                         } catch (error) {}
                     }}
                     onSubmitForm={(values) => ({
-                        ForgeNames: forgeNamesRef.current,
+                        ...forgeExtraParams.current,
                         ...values
                     })}
                     isProgressFinished={(p: ExportImportAIForgeProgress) =>
@@ -687,8 +749,6 @@ const ForgeName = (props, ref: Ref<ForgeNameRef>) => {
             )}
         </div>
     )
-}
-
-const ForwardForgeName = forwardRef<ForgeNameRef, {}>(ForgeName)
+})
 
 export default memo(ForwardForgeName)

app/renderer/src/main/src/pages/ai-agent/forgeName/type.d.ts

@@ -1,4 +1,8 @@
-export interface ForgeNameProps {}
+import {QueryAIForgeRequest} from "../type/forge"
+
+export interface ForgeNameProps {
+    onSelectChange: (b:boolean) => void
+}
 export interface ExportAIForgeFormValues {
     OutputName: string
     ToolNames?: string[]
@@ -14,6 +18,7 @@ export interface ExportAIForgeRequest {
     OutputName: string
     ToolNames?: string[]
     Password?: string
+    Filter: QueryAIForgeRequest["Filter"]
 }
 export interface ImportAIForgeRequest {
     InputPath: string

app/renderer/src/main/src/yakitLib.scss

@@ -11,6 +11,7 @@ html {
     white-space: nowrap;
     word-wrap: normal;
     text-overflow: ellipsis;
+    overflow: hidden;
 }
 // 多行内容省略
 // 行数可通过设置 变量 --yakit-ellipsis-row 控制