feat: add more help

documents/development.md

@@ -30,9 +30,15 @@ pytest .
 # Program Explanation
 ## Video Status
 Unstart: a video to add the download queue
+
 Fetching: the video is fetching the video information
+
 Pending: the video is waiting for the download
+
 Downloading: the video is downloading video、poster、nfo
+
 Finished: the video is downloaded. waiting for the rename folder
+
 Completed: the video folder is renamed.
+
 Failed: the video is failed in above any step.

web/src/components/HelpModel.vue

@@ -1,6 +1,6 @@
 <template>
     <div 
-        class="flex rounded-full border hover:border-black h-8 cursor-pointer"
+        class="flex rounded-full border hover:border-lime-500	 h-8 cursor-pointer"
         @click="showModal = true"
     >
         <n-icon

web/src/locales/en-US.json

@@ -51,6 +51,31 @@
             "label":"What is Video Storage Path",
             "title":"What is Video Storage Path",
             "content":"Video Storage Path is the video storage path of the video you downloaded. If you use Media Fetch Pro in a Docker. you shouldn't to change this setting. You should to change the map to move the video to the outside of the container."
+        },
+        "how-to-feedback": {
+            "label": "How to feedback",
+            "title": "How to feedback",
+            "content": "You can feedback your problem and suggest in Github Issue. https://github.com/Media-Fetch-Pro/Media-Fetch-Pro"
+        },
+        "what-website-is-supported":{
+            "label":"What website is supported",
+            "title":"What website is supported",
+            "content":"Now the program only can download the video from Youtube and Bilibili. We will support more website in the future."
+        },
+        "how-to-develop-this-project":{
+            "label":"How to develop this project",
+            "title":"How to develop this project",
+            "content":"You can fork this project and submit a PR in Github. https://github.com/Media-Fetch-Pro/Media-Fetch-Pro . Please feel free to submit a PR."
+        },
+        "how-to-require-new-website-support":{
+            "label":"How to require new website",
+            "title":"How to require new website",
+            "content":"You can submit a issue in Github. https://github.com/Media-Fetch-Pro/Media-Fetch-Pro"
+        },
+        "how-to-download-high-quality-video": {
+            "label": "How to download high quality video",
+            "title": "How to download high quality video",
+            "content": "If the video is downloaded from Youtube. It will download the highest quality video. If the video is downloaded from Bilibili. It will require to login. the program will support to download the video with your cookie to support to download high quality video."
         }
     }
 }

web/src/locales/zh-CN.json

@@ -51,6 +51,31 @@
             "label":"什么是存储路径",
             "title":"什么是存储路径",
             "content":"存储路径是指下载的视频文件存储的位置。如果你是在通过 Docker 来使用 Media Fetch Pro 那么请不要修改这里，而是通过修改 Docker 的文件夹映射来修改存储路径。"
+        },
+        "how-to-feedback": {
+            "label": "如何反馈问题",
+            "title": "如何反馈问题",
+            "content": "你可以在 Github Issue 上反馈你的问题与建议. https://github.com/Media-Fetch-Pro/Media-Fetch-Pro"
+        },
+        "what-website-is-supported":{
+            "label":"哪些网站是支持的",
+            "title":"哪些网站是支持的",
+            "content":"现在目前只支持在 Youtube 上下载视频和 Bilibili上下载视频和多P视频(playlist). 我们将在未来支持更多网站."
+        },
+        "how-to-develop-this-project":{
+            "label":"我可以如何参与开发",
+            "title":"我可以如何参与开发",
+            "content":"你可以在 Github fork和提交一个新 PR 来参与开发. https://github.com/Media-Fetch-Pro/Media-Fetch-Pro ."
+        },
+        "how-to-require-new-website-support":{
+            "label":"如何去请求新的网站支持",
+            "title":"如何去请求新的网站支持",
+            "content":"你可以在 Github 上提一个 Issue. https://github.com/Media-Fetch-Pro/Media-Fetch-Pro ."
+        },
+        "how-to-download-high-quality-video": {
+            "label": "如何去下载高清视频",
+            "title": "如何去下载高清视频",
+            "content": "如果视频是从 Youtube 上下载的，这将默认下载最高清的视频。 如果视频是从 Bilibili 上下载的，高清视频会要求登录，所以在未来版本可以在设置中填写你的Cookie来下载高清的bilibili视频。"
         }
     }
 }

web/src/views/DownloadView.vue

@@ -29,39 +29,29 @@ const store = useDownloadStore()
             FAQ:
             <div class="flex gap-2 flex-wrap">
                 <HelpModel 
-                    label="How to Feedback"
-                    :title="t('help.download-help.title')"
-                    :content="t('help.download-help.content')"
-                />
-                <HelpModel 
-                    label="What website is supported"
-                    :title="t('help.download-help.title')"
-                    :content="t('help.download-help.content')"
-                />
-                <HelpModel 
-                    label="How to upgrade the Version"
-                    :title="t('help.download-help.title')"
-                    :content="t('help.download-help.content')"
+                    :label="t('help.how-to-feedback.label')"
+                    :title="t('help.how-to-feedback.title')"
+                    :content="t('help.how-to-feedback.content')"
                 />
                 <HelpModel 
-                    label="How to develop this project"
-                    :title="t('help.download-help.title')"
-                    :content="t('help.download-help.content')"
+                    :label="t('help.what-website-is-supported.label')"
+                    :title="t('help.what-website-is-supported.title')"
+                    :content="t('help.what-website-is-supported.content')"
                 />
                 <HelpModel 
-                    label="How to require new website support"
-                    :title="t('help.download-help.title')"
-                    :content="t('help.download-help.content')"
+                    :label="t('help.how-to-develop-this-project.label')"
+                    :title="t('help.how-to-develop-this-project.title')"
+                    :content="t('help.how-to-develop-this-project.content')"
                 />
                 <HelpModel 
-                    label="How to require new language support"
-                    :title="t('help.download-help.title')"
-                    :content="t('help.download-help.content')"
+                    :label="t('help.how-to-require-new-website-support.label')"
+                    :title="t('help.how-to-require-new-website-support.title')"
+                    :content="t('help.how-to-require-new-website-support.content')"
                 />
                 <HelpModel 
-                    label="How to download high quality video"
-                    :title="t('help.download-help.title')"
-                    :content="t('help.download-help.content')"
+                    :label="t('help.how-to-download-high-quality-video.label')"
+                    :title="t('help.how-to-download-high-quality-video.title')"
+                    :content="t('help.how-to-download-high-quality-video.content')"
                 />
             </div>
         </div>

web/tsconfig.vitest.json

@@ -7,4 +7,3 @@
         "types": ["node", "jsdom","naive-ui/volar", "jest"]
         }
 }
-