From 6a43623aa3167e6a01c6b6cb226966d83f76c766 Mon Sep 17 00:00:00 2001
From: zhaoying <zhaoyingyz@126.com>
Date: Thu, 7 May 2026 19:11:24 +0800
Subject: [PATCH] feat(web): add csv template

---
 web/src/assets/csv_template.csv               |   1 +
 web/src/i18n/en.ts                            |   3 +-
 web/src/i18n/zh.ts                            |   3 +-
 .../[knowledgeBaseId]/CreateDataset.tsx       | 202 +++++++++---------
 4 files changed, 111 insertions(+), 98 deletions(-)
 create mode 100644 web/src/assets/csv_template.csv

diff --git a/web/src/assets/csv_template.csv b/web/src/assets/csv_template.csv
new file mode 100644
index 00000000..4002af7e
--- /dev/null
+++ b/web/src/assets/csv_template.csv
@@ -0,0 +1 @@
+Q	A
\ No newline at end of file
diff --git a/web/src/i18n/en.ts b/web/src/i18n/en.ts
index 4b53403e..61e2bfbc 100644
--- a/web/src/i18n/en.ts
+++ b/web/src/i18n/en.ts
@@ -951,7 +951,8 @@ export const en = {
         feishuFolderToken: 'Folder Token',
         feishuFolderTokenRequired: 'Please enter Folder Token',
         feishuFolderTokenPlaceholder: 'Enter your Feishu Folder Token',
-      }
+      },
+      csvTemplate: 'Click to download CSV template',
     },
     api: {
       pageTitle: 'Memory library IAP document',
diff --git a/web/src/i18n/zh.ts b/web/src/i18n/zh.ts
index 9ec419ca..fabd8190 100644
--- a/web/src/i18n/zh.ts
+++ b/web/src/i18n/zh.ts
@@ -438,7 +438,8 @@ export const zh = {
         feishuFolderToken: '文件夹 Token',
         feishuFolderTokenRequired: '请输入文件夹 Token',
         feishuFolderTokenPlaceholder: '请输入您的飞书文件夹 Token',
-      }
+      },
+      csvTemplate: '点击下载 CSV 模板',
     },
     application: {
       searchPlaceholder: '搜索应用',
diff --git a/web/src/views/KnowledgeBase/[knowledgeBaseId]/CreateDataset.tsx b/web/src/views/KnowledgeBase/[knowledgeBaseId]/CreateDataset.tsx
index 41375981..127aab43 100644
--- a/web/src/views/KnowledgeBase/[knowledgeBaseId]/CreateDataset.tsx
+++ b/web/src/views/KnowledgeBase/[knowledgeBaseId]/CreateDataset.tsx
@@ -596,111 +596,121 @@ const CreateDataset = () => {
       </div> } 
       <div className='rb:bg-white rb:rounded-xl rb:flex-1 rb:mt-3'>
 
-        {current === 0 && (
+        {current === 0 && (<>
           <div className='rb:flex rb:w-full rb:p-6'>
-              {source && (source === 'local' || source === 'csv') && (
-                  <UploadFiles 
-                    ref={uploadRef}
-                    isCanDrag={true} 
-                    fileSize={100} 
-                    multiple={source !== 'csv'} 
-                    maxCount={source === 'csv' ? 1 : 99}
-                    fileType={source === 'csv' ? csvFileType : fileType} 
-                    customRequest={handleUpload}
-                    onChange={(fileList) => {
-                      console.log('File list changed:', fileList);
-                    }}
-                    onRemove={async (file) => {
-                        // 如果文件正在上传，取消上传
-                        const fileUid = file.uid;
-                        const abortController = abortControllersRef.current.get(fileUid);
-                        if (abortController) {
-                          abortController.abort();
-                          abortControllersRef.current.delete(fileUid);
-                          console.log('Upload cancelled:', (file as any).name);
-                          // 取消上传后直接返回 true，允许移除文件
-                          return true;
-                        }
-                        
-                        // Only delete server file when file upload was successful (has response.id)
-                        if (file.response?.id) {
-                          try {
-                            await deleteDocument(file.response.id);
-                            setRechunkFileIds(prev => prev.filter(id => id !== file.response.id));
-                            console.log('Server file deleted:', file.response.id);
-                            return true;
-                          } catch (error) {
-                            console.error('Failed to delete file:', error);
-                            messageApi.error(t('common.deleteFailed') || 'Failed to delete file');
-                            return false; // Don't remove file when deletion fails
-                          }
-                        }
-                        
-                        // Also allow removal in other cases (such as failed uploads)
-                        return true;
-                      }} />
-              )}
-              {source && source === 'link' && (
-                  <div className='rb:flex rb:w-full rb:flex-col rb:mt-10 rb:px-40'>
+            {source && (source === 'local' || source === 'csv') && (
+              <UploadFiles 
+                ref={uploadRef}
+                isCanDrag={true} 
+                fileSize={100} 
+                multiple={source !== 'csv'} 
+                maxCount={source === 'csv' ? 1 : 99}
+                fileType={source === 'csv' ? csvFileType : fileType} 
+                customRequest={handleUpload}
+                onChange={(fileList) => {
+                  console.log('File list changed:', fileList);
+                }}
+                onRemove={async (file) => {
+                  // 如果文件正在上传，取消上传
+                  const fileUid = file.uid;
+                  const abortController = abortControllersRef.current.get(fileUid);
+                  if (abortController) {
+                    abortController.abort();
+                    abortControllersRef.current.delete(fileUid);
+                    console.log('Upload cancelled:', (file as any).name);
+                    // 取消上传后直接返回 true，允许移除文件
+                    return true;
+                  }
+                  
+                  // Only delete server file when file upload was successful (has response.id)
+                  if (file.response?.id) {
+                    try {
+                      await deleteDocument(file.response.id);
+                      setRechunkFileIds(prev => prev.filter(id => id !== file.response.id));
+                      console.log('Server file deleted:', file.response.id);
+                      return true;
+                    } catch (error) {
+                      console.error('Failed to delete file:', error);
+                      messageApi.error(t('common.deleteFailed') || 'Failed to delete file');
+                      return false; // Don't remove file when deletion fails
+                    }
+                  }
+                  
+                  // Also allow removal in other cases (such as failed uploads)
+                  return true;
+                }}
+              />
+            )}
+            {source && source === 'link' && (
+              <div className='rb:flex rb:w-full rb:flex-col rb:mt-10 rb:px-40'>
 
-                    <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mb-3'>
-                        {t('knowledgeBase.webLink')}
-                    </div>
-                    <TextArea  rows={6} placeholder={t('knowledgeBase.webLinkPlaceholder')} />
-                    <div className='rb:text-sm rb:text-gray-500 rb:mt-3'>
-                        {t('knowledgeBase.webLinkDesc',{count: 5})}
-                    </div>
-                    <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mt-10 rb:mb-3'>
-                        {t('knowledgeBase.selectorTutorial')}
-                    </div>
-                    <Input className='rb:w-full' placeholder={t('knowledgeBase.webLinkPlaceholder')}/>
+                <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mb-3'>
+                    {t('knowledgeBase.webLink')}
                 </div>
+                <TextArea  rows={6} placeholder={t('knowledgeBase.webLinkPlaceholder')} />
+                <div className='rb:text-sm rb:text-gray-500 rb:mt-3'>
+                    {t('knowledgeBase.webLinkDesc',{count: 5})}
+                </div>
+                <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mt-10 rb:mb-3'>
+                    {t('knowledgeBase.selectorTutorial')}
+                </div>
+                <Input className='rb:w-full' placeholder={t('knowledgeBase.webLinkPlaceholder')}/>
+              </div>
             )}
             {source && source === 'text' && (
-                <div className='rb:flex rb:w-full rb:flex-col rb:mt-10 rb:px-20'>
-                    <Form 
-                      form={form} 
-                      layout="vertical"
-                      onValuesChange={() => {
-                        // 检查表单字段是否都已填写
-                        const values = form.getFieldsValue();
-                        const isValid = !!(values.title?.trim() && values.content?.trim());
-                        setTextFormValid(isValid);
-                      }}
+              <div className='rb:flex rb:w-full rb:flex-col rb:mt-10 rb:px-20'>
+                <Form 
+                  form={form} 
+                  layout="vertical"
+                  onValuesChange={() => {
+                    // 检查表单字段是否都已填写
+                    const values = form.getFieldsValue();
+                    const isValid = !!(values.title?.trim() && values.content?.trim());
+                    setTextFormValid(isValid);
+                  }}
+                >
+                    <Form.Item
+                      name="title"
+                      label={t('knowledgeBase.title')}
+                      rules={[{ required: true, message: t('knowledgeBase.pleaseEnterTitle') }]}
                     >
-                        <Form.Item
-                          name="title"
-                          label={t('knowledgeBase.title')}
-                          rules={[{ required: true, message: t('knowledgeBase.pleaseEnterTitle') }]}
-                        >
-                          <Input placeholder={t('knowledgeBase.pleaseEnterTitle')} />
-                        </Form.Item>
+                      <Input placeholder={t('knowledgeBase.pleaseEnterTitle')} />
+                    </Form.Item>
 
-                        <Form.Item
-                          name="content"
-                          label={t('knowledgeBase.customContent')}
-                          rules={[{ required: true, message: t('knowledgeBase.pleaseEnterContent') }]}
-                        >
-                          <Input.TextArea
-                            placeholder={t('knowledgeBase.pleaseEnterContent')}
-                            rows={8}
-                            showCount
-                            maxLength={5000}
-                          />
-                        </Form.Item>
-                      </Form>
-                    {/* <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mb-3'>
-                        {t('knowledgeBase.customText')}
-                    </div>
-                    <Input className='rb:w-full' placeholder={t('knowledgeBase.webLinkPlaceholder')}/>
-                    <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mt-10 rb:mb-3'>
-                        {t('knowledgeBase.customContent')}
-                    </div>
-                    <TextArea  rows={6} placeholder={t('knowledgeBase.webLinkPlaceholder')} /> */}
+                    <Form.Item
+                      name="content"
+                      label={t('knowledgeBase.customContent')}
+                      rules={[{ required: true, message: t('knowledgeBase.pleaseEnterContent') }]}
+                    >
+                      <Input.TextArea
+                        placeholder={t('knowledgeBase.pleaseEnterContent')}
+                        rows={8}
+                        showCount
+                        maxLength={5000}
+                      />
+                    </Form.Item>
+                  </Form>
+                {/* <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mb-3'>
+                    {t('knowledgeBase.customText')}
                 </div>
+                <Input className='rb:w-full' placeholder={t('knowledgeBase.webLinkPlaceholder')}/>
+                <div className='rb:text-sm rb:font-medium rb:text-gray-800 rb:mt-10 rb:mb-3'>
+                    {t('knowledgeBase.customContent')}
+                </div>
+                <TextArea  rows={6} placeholder={t('knowledgeBase.webLinkPlaceholder')} /> */}
+              </div>
             )}
-        </div>
-        )}
+          </div>
+          {source === 'csv' &&
+            <a
+              href="@/assets/csv_template.csv"
+              download="csv_template.csv"
+              className='rb:mx-6 rb:text-sm rb:font-medium rb:text-gray-800 rb:-mt-6!'
+            >
+                {t('knowledgeBase.csvTemplate')}
+            </a>
+          }
+        </>)}
 
         {current === 1 && (
           <div className='rb:flex rb:flex-col rb:mt-10 rb:px-40'>