mirror of
https://github.com/JefferyHcool/BiliNote.git
synced 2026-09-05 23:56:59 +08:00
first commit
This commit is contained in:
@@ -0,0 +1,43 @@
|
|||||||
|
# 通用端口配置
|
||||||
|
BACKEND_PORT=8001
|
||||||
|
FRONTEND_PORT=3015
|
||||||
|
BACKEND_HOST=0.0.0.0
|
||||||
|
|
||||||
|
# 前端访问后端用(生产环境建议写公网或宿主机 IP)
|
||||||
|
VITE_API_BASE_URL=http://127.0.0.1:8001
|
||||||
|
VITE_SCREENSHOT_BASE_URL=http://127.0.0.1:8001/static/screenshots
|
||||||
|
|
||||||
|
# 生产环境配置
|
||||||
|
ENV=production
|
||||||
|
STATIC=/static
|
||||||
|
OUT_DIR=./static/screenshots
|
||||||
|
IMAGE_BASE_URL=/static/screenshots
|
||||||
|
DATA_DIR=data
|
||||||
|
|
||||||
|
|
||||||
|
# AI 相关配置
|
||||||
|
OPENAI_API_KEY=
|
||||||
|
OPENAI_API_BASE_URL=
|
||||||
|
OPENAI_MODEL=
|
||||||
|
DEEP_SEEK_API_KEY=
|
||||||
|
DEEP_SEEK_API_BASE_URL=
|
||||||
|
DEEP_SEEK_MODEL=
|
||||||
|
QWEN_API_KEY=
|
||||||
|
QWEN_API_BASE_URL=
|
||||||
|
QWEN_MODEL=
|
||||||
|
|
||||||
|
# FFMPEG 配置
|
||||||
|
FFMPEG_BIN_PATH=/Users/jeffery/Downloads/
|
||||||
|
|
||||||
|
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
|
~
|
||||||
+318
@@ -0,0 +1,318 @@
|
|||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
.pnpm-debug.log*
|
||||||
|
|
||||||
|
# Diagnostic reports (https://nodejs.org/api/report.html)
|
||||||
|
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
||||||
|
BiliNote/pnpm-lock.yaml
|
||||||
|
# Runtime data
|
||||||
|
pids
|
||||||
|
*.pid
|
||||||
|
*.seed
|
||||||
|
*.pid.lock
|
||||||
|
|
||||||
|
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||||
|
lib-cov
|
||||||
|
|
||||||
|
# Coverage directory used by tools like istanbul
|
||||||
|
coverage
|
||||||
|
*.lcov
|
||||||
|
|
||||||
|
# nyc test coverage
|
||||||
|
.nyc_output
|
||||||
|
|
||||||
|
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
||||||
|
.grunt
|
||||||
|
|
||||||
|
# Bower dependency directory (https://bower.io/)
|
||||||
|
bower_components
|
||||||
|
|
||||||
|
# node-waf configuration
|
||||||
|
.lock-wscript
|
||||||
|
|
||||||
|
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||||
|
build/Release
|
||||||
|
|
||||||
|
# Dependency directories
|
||||||
|
node_modules/
|
||||||
|
jspm_packages/
|
||||||
|
|
||||||
|
# Snowpack dependency directory (https://snowpack.dev/)
|
||||||
|
web_modules/
|
||||||
|
|
||||||
|
# TypeScript cache
|
||||||
|
*.tsbuildinfo
|
||||||
|
|
||||||
|
# Optional npm cache directory
|
||||||
|
.npm
|
||||||
|
|
||||||
|
# Optional eslint cache
|
||||||
|
.eslintcache
|
||||||
|
|
||||||
|
# Optional stylelint cache
|
||||||
|
.stylelintcache
|
||||||
|
|
||||||
|
# Microbundle cache
|
||||||
|
.rpt2_cache/
|
||||||
|
.rts2_cache_cjs/
|
||||||
|
.rts2_cache_es/
|
||||||
|
.rts2_cache_umd/
|
||||||
|
|
||||||
|
# Optional REPL history
|
||||||
|
.node_repl_history
|
||||||
|
|
||||||
|
# Output of 'npm pack'
|
||||||
|
*.tgz
|
||||||
|
|
||||||
|
# Yarn Integrity file
|
||||||
|
.yarn-integrity
|
||||||
|
|
||||||
|
# dotenv environment variable files
|
||||||
|
.env
|
||||||
|
.env.development.local
|
||||||
|
.env.test.local
|
||||||
|
.env.production.local
|
||||||
|
.env.local
|
||||||
|
!.env.example
|
||||||
|
# parcel-bundler cache (https://parceljs.org/)
|
||||||
|
.cache
|
||||||
|
.parcel-cache
|
||||||
|
|
||||||
|
# Next.js build output
|
||||||
|
.next
|
||||||
|
out
|
||||||
|
|
||||||
|
# Nuxt.js build / generate output
|
||||||
|
.nuxt
|
||||||
|
dist
|
||||||
|
|
||||||
|
# Gatsby files
|
||||||
|
.cache/
|
||||||
|
# Comment in the public line in if your project uses Gatsby and not Next.js
|
||||||
|
# https://nextjs.org/blog/next-9-1#public-directory-support
|
||||||
|
# public
|
||||||
|
|
||||||
|
# vuepress build output
|
||||||
|
.vuepress/dist
|
||||||
|
|
||||||
|
# vuepress v2.x temp and cache directory
|
||||||
|
.temp
|
||||||
|
.cache
|
||||||
|
|
||||||
|
# vitepress build output
|
||||||
|
**/.vitepress/dist
|
||||||
|
|
||||||
|
# vitepress cache directory
|
||||||
|
**/.vitepress/cache
|
||||||
|
|
||||||
|
# Docusaurus cache and generated files
|
||||||
|
.docusaurus
|
||||||
|
|
||||||
|
# Serverless directories
|
||||||
|
.serverless/
|
||||||
|
|
||||||
|
# FuseBox cache
|
||||||
|
.fusebox/
|
||||||
|
|
||||||
|
# DynamoDB Local files
|
||||||
|
.dynamodb/
|
||||||
|
|
||||||
|
# TernJS port file
|
||||||
|
.tern-port
|
||||||
|
|
||||||
|
# Stores VSCode versions used for testing VSCode extensions
|
||||||
|
.vscode-test
|
||||||
|
|
||||||
|
# yarn v2
|
||||||
|
.yarn/cache
|
||||||
|
.yarn/unplugged
|
||||||
|
.yarn/build-state.yml
|
||||||
|
.yarn/install-state.gz
|
||||||
|
.pnp.*
|
||||||
|
# Byte-compiled / optimized / DLL files
|
||||||
|
__pycache__/
|
||||||
|
*.py[cod]
|
||||||
|
*$py.class
|
||||||
|
|
||||||
|
# C extensions
|
||||||
|
*.so
|
||||||
|
|
||||||
|
# Distribution / packaging
|
||||||
|
.Python
|
||||||
|
build/
|
||||||
|
develop-eggs/
|
||||||
|
dist/
|
||||||
|
downloads/
|
||||||
|
eggs/
|
||||||
|
.eggs/
|
||||||
|
|
||||||
|
lib64/
|
||||||
|
parts/
|
||||||
|
sdist/
|
||||||
|
var/
|
||||||
|
wheels/
|
||||||
|
share/python-wheels/
|
||||||
|
*.egg-info/
|
||||||
|
.installed.cfg
|
||||||
|
*.egg
|
||||||
|
MANIFEST
|
||||||
|
|
||||||
|
# PyInstaller
|
||||||
|
# Usually these files are written by a python script from a template
|
||||||
|
# before PyInstaller builds the exe, so as to inject date/other infos into it.
|
||||||
|
*.manifest
|
||||||
|
*.spec
|
||||||
|
|
||||||
|
# Installer logs
|
||||||
|
pip-log.txt
|
||||||
|
pip-delete-this-directory.txt
|
||||||
|
|
||||||
|
# Unit test / coverage reports
|
||||||
|
htmlcov/
|
||||||
|
.tox/
|
||||||
|
.nox/
|
||||||
|
.coverage
|
||||||
|
.coverage.*
|
||||||
|
.cache
|
||||||
|
nosetests.xml
|
||||||
|
coverage.xml
|
||||||
|
*.cover
|
||||||
|
*.py,cover
|
||||||
|
.hypothesis/
|
||||||
|
.pytest_cache/
|
||||||
|
cover/
|
||||||
|
|
||||||
|
# Translations
|
||||||
|
*.mo
|
||||||
|
*.pot
|
||||||
|
|
||||||
|
# Django stuff:
|
||||||
|
*.log
|
||||||
|
local_settings.py
|
||||||
|
db.sqlite3
|
||||||
|
db.sqlite3-journal
|
||||||
|
|
||||||
|
# Flask stuff:
|
||||||
|
instance/
|
||||||
|
.webassets-cache
|
||||||
|
|
||||||
|
# Scrapy stuff:
|
||||||
|
.scrapy
|
||||||
|
|
||||||
|
# Sphinx documentation
|
||||||
|
docs/_build/
|
||||||
|
|
||||||
|
# PyBuilder
|
||||||
|
.pybuilder/
|
||||||
|
target/
|
||||||
|
|
||||||
|
# Jupyter Notebook
|
||||||
|
.ipynb_checkpoints
|
||||||
|
|
||||||
|
# IPython
|
||||||
|
profile_default/
|
||||||
|
ipython_config.py
|
||||||
|
|
||||||
|
# pyenv
|
||||||
|
# For a library or package, you might want to ignore these files since the code is
|
||||||
|
# intended to run in multiple environments; otherwise, check them in:
|
||||||
|
# .python-version
|
||||||
|
|
||||||
|
# pipenv
|
||||||
|
# According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
|
||||||
|
# However, in case of collaboration, if having platform-specific dependencies or dependencies
|
||||||
|
# having no cross-platform support, pipenv may install dependencies that don't work, or not
|
||||||
|
# install all needed dependencies.
|
||||||
|
#Pipfile.lock
|
||||||
|
|
||||||
|
# UV
|
||||||
|
# Similar to Pipfile.lock, it is generally recommended to include uv.lock in version control.
|
||||||
|
# This is especially recommended for binary packages to ensure reproducibility, and is more
|
||||||
|
# commonly ignored for libraries.
|
||||||
|
#uv.lock
|
||||||
|
|
||||||
|
# poetry
|
||||||
|
# Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
|
||||||
|
# This is especially recommended for binary packages to ensure reproducibility, and is more
|
||||||
|
# commonly ignored for libraries.
|
||||||
|
# https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
|
||||||
|
#poetry.lock
|
||||||
|
|
||||||
|
# pdm
|
||||||
|
# Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
|
||||||
|
#pdm.lock
|
||||||
|
# pdm stores project-wide configurations in .pdm.toml, but it is recommended to not include it
|
||||||
|
# in version control.
|
||||||
|
# https://pdm.fming.dev/latest/usage/project/#working-with-version-control
|
||||||
|
.pdm.toml
|
||||||
|
.pdm-python
|
||||||
|
.pdm-build/
|
||||||
|
|
||||||
|
# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
|
||||||
|
__pypackages__/
|
||||||
|
|
||||||
|
# Celery stuff
|
||||||
|
celerybeat-schedule
|
||||||
|
celerybeat.pid
|
||||||
|
|
||||||
|
# SageMath parsed files
|
||||||
|
*.sage.py
|
||||||
|
|
||||||
|
# Environments
|
||||||
|
.env
|
||||||
|
.venv
|
||||||
|
env/
|
||||||
|
venv/
|
||||||
|
ENV/
|
||||||
|
env.bak/
|
||||||
|
venv.bak/
|
||||||
|
|
||||||
|
# Spyder project settings
|
||||||
|
.spyderproject
|
||||||
|
.spyproject
|
||||||
|
|
||||||
|
# Rope project settings
|
||||||
|
.ropeproject
|
||||||
|
|
||||||
|
# mkdocs documentation
|
||||||
|
/site
|
||||||
|
|
||||||
|
# mypy
|
||||||
|
.mypy_cache/
|
||||||
|
.dmypy.json
|
||||||
|
dmypy.json
|
||||||
|
|
||||||
|
# Pyre type checker
|
||||||
|
.pyre/
|
||||||
|
|
||||||
|
# pytype static type analyzer
|
||||||
|
.pytype/
|
||||||
|
|
||||||
|
# Cython debug symbols
|
||||||
|
cython_debug/
|
||||||
|
|
||||||
|
# PyCharm
|
||||||
|
# JetBrains specific template is maintained in a separate JetBrains.gitignore that can
|
||||||
|
# be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
|
||||||
|
# and can be added to the global gitignore or merged into this file. For a more nuclear
|
||||||
|
# option (not recommended) you can uncomment the following to ignore the entire idea folder.
|
||||||
|
#.idea/
|
||||||
|
|
||||||
|
# Ruff stuff:
|
||||||
|
.ruff_cache/
|
||||||
|
|
||||||
|
# PyPI configuration file
|
||||||
|
.pypirc
|
||||||
|
/backend/data/*
|
||||||
|
/backend/static/*
|
||||||
|
/backend/note_tasks.db
|
||||||
|
/backend/bin/
|
||||||
|
/backend/logs/
|
||||||
|
/backend/note_results
|
||||||
|
/backend/models
|
||||||
|
/backend/.idea
|
||||||
@@ -0,0 +1,3 @@
|
|||||||
|
# 前端专用
|
||||||
|
VITE_API_BASE_URL=http://127.0.0.1:8000
|
||||||
|
VITE_SCREENSHOT_BASE_URL=http://127.0.0.1:8000/static/screenshots
|
||||||
@@ -0,0 +1,25 @@
|
|||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
|
||||||
|
node_modules
|
||||||
|
dist
|
||||||
|
dist-ssr
|
||||||
|
*.local
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.vscode/*
|
||||||
|
!.vscode/extensions.json
|
||||||
|
.idea
|
||||||
|
.DS_Store
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
||||||
|
/pnpm-lock.yaml
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
FROM node:18-alpine AS build
|
||||||
|
|
||||||
|
WORKDIR /app
|
||||||
|
|
||||||
|
COPY ./BillNote_frontend /app
|
||||||
|
|
||||||
|
RUN npm install && npm run build
|
||||||
|
|
||||||
|
FROM nginx:alpine
|
||||||
|
|
||||||
|
COPY --from=build /app/dist /usr/share/nginx/html
|
||||||
|
|
||||||
|
EXPOSE 80
|
||||||
@@ -0,0 +1,54 @@
|
|||||||
|
# React + TypeScript + Vite
|
||||||
|
|
||||||
|
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
|
||||||
|
|
||||||
|
Currently, two official plugins are available:
|
||||||
|
|
||||||
|
- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
|
||||||
|
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
|
||||||
|
|
||||||
|
## Expanding the ESLint configuration
|
||||||
|
|
||||||
|
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
|
||||||
|
|
||||||
|
```js
|
||||||
|
export default tseslint.config({
|
||||||
|
extends: [
|
||||||
|
// Remove ...tseslint.configs.recommended and replace with this
|
||||||
|
...tseslint.configs.recommendedTypeChecked,
|
||||||
|
// Alternatively, use this for stricter rules
|
||||||
|
...tseslint.configs.strictTypeChecked,
|
||||||
|
// Optionally, add this for stylistic rules
|
||||||
|
...tseslint.configs.stylisticTypeChecked,
|
||||||
|
],
|
||||||
|
languageOptions: {
|
||||||
|
// other options...
|
||||||
|
parserOptions: {
|
||||||
|
project: ['./tsconfig.node.json', './tsconfig.app.json'],
|
||||||
|
tsconfigRootDir: import.meta.dirname,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
})
|
||||||
|
```
|
||||||
|
|
||||||
|
You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
|
||||||
|
|
||||||
|
```js
|
||||||
|
// eslint.config.js
|
||||||
|
import reactX from 'eslint-plugin-react-x'
|
||||||
|
import reactDom from 'eslint-plugin-react-dom'
|
||||||
|
|
||||||
|
export default tseslint.config({
|
||||||
|
plugins: {
|
||||||
|
// Add the react-x and react-dom plugins
|
||||||
|
'react-x': reactX,
|
||||||
|
'react-dom': reactDom,
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
// other rules...
|
||||||
|
// Enable its recommended typescript rules
|
||||||
|
...reactX.configs['recommended-typescript'].rules,
|
||||||
|
...reactDom.configs.recommended.rules,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
```
|
||||||
@@ -0,0 +1,21 @@
|
|||||||
|
{
|
||||||
|
"$schema": "https://ui.shadcn.com/schema.json",
|
||||||
|
"style": "new-york",
|
||||||
|
"rsc": false,
|
||||||
|
"tsx": true,
|
||||||
|
"tailwind": {
|
||||||
|
"config": "",
|
||||||
|
"css": "src/index.css",
|
||||||
|
"baseColor": "neutral",
|
||||||
|
"cssVariables": true,
|
||||||
|
"prefix": ""
|
||||||
|
},
|
||||||
|
"aliases": {
|
||||||
|
"components": "@/components",
|
||||||
|
"utils": "@/lib/utils",
|
||||||
|
"ui": "@/components/ui",
|
||||||
|
"lib": "@/lib",
|
||||||
|
"hooks": "@/hooks"
|
||||||
|
},
|
||||||
|
"iconLibrary": "lucide"
|
||||||
|
}
|
||||||
@@ -0,0 +1,28 @@
|
|||||||
|
import js from '@eslint/js'
|
||||||
|
import globals from 'globals'
|
||||||
|
import reactHooks from 'eslint-plugin-react-hooks'
|
||||||
|
import reactRefresh from 'eslint-plugin-react-refresh'
|
||||||
|
import tseslint from 'typescript-eslint'
|
||||||
|
|
||||||
|
export default tseslint.config(
|
||||||
|
{ ignores: ['dist'] },
|
||||||
|
{
|
||||||
|
extends: [js.configs.recommended, ...tseslint.configs.recommended],
|
||||||
|
files: ['**/*.{ts,tsx}'],
|
||||||
|
languageOptions: {
|
||||||
|
ecmaVersion: 2020,
|
||||||
|
globals: globals.browser,
|
||||||
|
},
|
||||||
|
plugins: {
|
||||||
|
'react-hooks': reactHooks,
|
||||||
|
'react-refresh': reactRefresh,
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
...reactHooks.configs.recommended.rules,
|
||||||
|
'react-refresh/only-export-components': [
|
||||||
|
'warn',
|
||||||
|
{ allowConstantExport: true },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
)
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/icon.svg" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>BiliNote - 强大的AI视频笔记神器</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="root"></div>
|
||||||
|
<script type="module" src="/src/main.tsx"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,61 @@
|
|||||||
|
{
|
||||||
|
"name": "bili_note",
|
||||||
|
"private": true,
|
||||||
|
"version": "0.0.0",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vite",
|
||||||
|
"build": "vite build",
|
||||||
|
"lint": "eslint .",
|
||||||
|
"preview": "vite preview"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@hookform/resolvers": "^5.0.1",
|
||||||
|
"@lottiefiles/dotlottie-react": "^0.13.3",
|
||||||
|
"@radix-ui/react-checkbox": "^1.1.4",
|
||||||
|
"@radix-ui/react-label": "^2.1.2",
|
||||||
|
"@radix-ui/react-scroll-area": "^1.2.3",
|
||||||
|
"@radix-ui/react-select": "^2.1.6",
|
||||||
|
"@radix-ui/react-slot": "^1.1.2",
|
||||||
|
"@radix-ui/react-tooltip": "^1.1.8",
|
||||||
|
"@tailwindcss/vite": "^4.1.3",
|
||||||
|
"@uiw/react-markdown-preview": "^5.1.3",
|
||||||
|
"axios": "^1.8.4",
|
||||||
|
"class-variance-authority": "^0.7.1",
|
||||||
|
"clsx": "^2.1.1",
|
||||||
|
"github-markdown-css": "^5.8.1",
|
||||||
|
"katex": "^0.16.21",
|
||||||
|
"lottie-react": "^2.4.1",
|
||||||
|
"lucide-react": "^0.487.0",
|
||||||
|
"next-themes": "^0.4.6",
|
||||||
|
"react": "^19.0.0",
|
||||||
|
"react-dom": "^19.0.0",
|
||||||
|
"react-hook-form": "^7.55.0",
|
||||||
|
"react-hot-toast": "^2.5.2",
|
||||||
|
"react-markdown": "^10.1.0",
|
||||||
|
"react-syntax-highlighter": "^15.6.1",
|
||||||
|
"remark-gfm": "1.0.0",
|
||||||
|
"sonner": "^2.0.3",
|
||||||
|
"tailwind-merge": "^3.1.0",
|
||||||
|
"tailwindcss": "^4.1.3",
|
||||||
|
"tw-animate-css": "^1.2.5",
|
||||||
|
"zod": "^3.24.2",
|
||||||
|
"zustand": "^5.0.3"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@eslint/js": "^9.21.0",
|
||||||
|
"@tailwindcss/postcss": "^4.1.3",
|
||||||
|
"@types/node": "^22.14.0",
|
||||||
|
"@types/react": "^19.0.10",
|
||||||
|
"@types/react-dom": "^19.0.4",
|
||||||
|
"@vitejs/plugin-react": "^4.3.4",
|
||||||
|
"autoprefixer": "^10.4.21",
|
||||||
|
"eslint": "^9.21.0",
|
||||||
|
"eslint-plugin-react-hooks": "^5.1.0",
|
||||||
|
"eslint-plugin-react-refresh": "^0.4.19",
|
||||||
|
"globals": "^15.15.0",
|
||||||
|
"typescript": "~5.7.2",
|
||||||
|
"typescript-eslint": "^8.24.1",
|
||||||
|
"vite": "^6.2.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
module.exports = {
|
||||||
|
plugins: {
|
||||||
|
'@tailwindcss/postcss': {},
|
||||||
|
autoprefixer: {},
|
||||||
|
},
|
||||||
|
}
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
<svg width="415" height="412" viewBox="0 0 415 412" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M0 28C0 12.536 12.536 0 28 0H387C402.464 0 415 12.536 415 28V384C415 399.464 402.464 412 387 412H28C12.536 412 0 399.464 0 384V28Z" fill="#3C77FB"/>
|
||||||
|
<rect x="60" y="64" width="296" height="283" rx="37" fill="white"/>
|
||||||
|
<path d="M268.422 175.657C276.308 180.298 276.308 191.702 268.422 196.343L186.335 244.641C178.336 249.348 168.25 243.58 168.25 234.298V137.702C168.25 128.42 178.336 122.652 186.335 127.359L268.422 175.657Z" fill="#3C77FB"/>
|
||||||
|
<path d="M17 282C17 270.954 25.9543 262 37 262H83C94.0457 262 103 270.954 103 282V282C103 293.046 94.0457 302 83 302H37C25.9543 302 17 293.046 17 282V282Z" fill="#3C77FB"/>
|
||||||
|
<path d="M38 281.5C38 274.044 44.0442 268 51.5 268H82.5C89.9558 268 96 274.044 96 281.5V281.5C96 288.956 89.9558 295 82.5 295H51.5C44.0442 295 38 288.956 38 281.5V281.5Z" fill="white"/>
|
||||||
|
<path d="M17 206C17 194.954 25.9543 186 37 186H83C94.0457 186 103 194.954 103 206V206C103 217.046 94.0457 226 83 226H37C25.9543 226 17 217.046 17 206V206Z" fill="#3C77FB"/>
|
||||||
|
<path d="M38 205.5C38 198.044 44.0442 192 51.5 192H82.5C89.9558 192 96 198.044 96 205.5V205.5C96 212.956 89.9558 219 82.5 219H51.5C44.0442 219 38 212.956 38 205.5V205.5Z" fill="white"/>
|
||||||
|
<path d="M17 130C17 118.954 25.9543 110 37 110H83C94.0457 110 103 118.954 103 130V130C103 141.046 94.0457 150 83 150H37C25.9543 150 17 141.046 17 130V130Z" fill="#3C77FB"/>
|
||||||
|
<path d="M38 129.5C38 122.044 44.0442 116 51.5 116H82.5C89.9558 116 96 122.044 96 129.5V129.5C96 136.956 89.9558 143 82.5 143H51.5C44.0442 143 38 136.956 38 129.5V129.5Z" fill="white"/>
|
||||||
|
<path d="M145 290C145 285.582 148.582 282 153 282H284C288.418 282 292 285.582 292 290V299C292 303.418 288.418 307 284 307H153C148.582 307 145 303.418 145 299V290Z" fill="#3C77FB"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1008 KiB |
@@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
||||||
|
After Width: | Height: | Size: 1.5 KiB |
@@ -0,0 +1,16 @@
|
|||||||
|
|
||||||
|
import './App.css'
|
||||||
|
import {HomePage} from "./pages/Home.tsx";
|
||||||
|
import {useTaskPolling} from "@/hooks/useTaskPolling.ts";
|
||||||
|
|
||||||
|
function App() {
|
||||||
|
useTaskPolling(3000) // 每 3 秒轮询一次
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<HomePage></HomePage>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default App
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>
|
||||||
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,18 @@
|
|||||||
|
import { FC } from 'react'
|
||||||
|
import Lottie from 'lottie-react'
|
||||||
|
import loadingJson from '@/assets/Lottie/idle.json'
|
||||||
|
|
||||||
|
const Idle: FC = () => {
|
||||||
|
return (
|
||||||
|
<div className="flex justify-center items-center ">
|
||||||
|
<Lottie
|
||||||
|
animationData={loadingJson}
|
||||||
|
loop
|
||||||
|
autoplay
|
||||||
|
style={{ width: 350, height: 350 }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Idle
|
||||||
@@ -0,0 +1,18 @@
|
|||||||
|
import { FC } from 'react'
|
||||||
|
import Lottie from 'lottie-react'
|
||||||
|
import loadingJson from '@/assets/Lottie/loading.json'
|
||||||
|
|
||||||
|
const Loading: FC = () => {
|
||||||
|
return (
|
||||||
|
<div className="flex justify-center items-center ">
|
||||||
|
<Lottie
|
||||||
|
animationData={loadingJson}
|
||||||
|
loop
|
||||||
|
autoplay
|
||||||
|
style={{ width: 150, height: 150 }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Loading
|
||||||
@@ -0,0 +1,46 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
import { Slot } from "@radix-ui/react-slot"
|
||||||
|
import { cva, type VariantProps } from "class-variance-authority"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
const badgeVariants = cva(
|
||||||
|
"inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
|
||||||
|
{
|
||||||
|
variants: {
|
||||||
|
variant: {
|
||||||
|
default:
|
||||||
|
"border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
|
||||||
|
secondary:
|
||||||
|
"border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
|
||||||
|
destructive:
|
||||||
|
"border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
||||||
|
outline:
|
||||||
|
"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
defaultVariants: {
|
||||||
|
variant: "default",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
function Badge({
|
||||||
|
className,
|
||||||
|
variant,
|
||||||
|
asChild = false,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<"span"> &
|
||||||
|
VariantProps<typeof badgeVariants> & { asChild?: boolean }) {
|
||||||
|
const Comp = asChild ? Slot : "span"
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Comp
|
||||||
|
data-slot="badge"
|
||||||
|
className={cn(badgeVariants({ variant }), className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Badge, badgeVariants }
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
import { Slot } from "@radix-ui/react-slot"
|
||||||
|
import { cva, type VariantProps } from "class-variance-authority"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
const buttonVariants = cva(
|
||||||
|
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
||||||
|
{
|
||||||
|
variants: {
|
||||||
|
variant: {
|
||||||
|
default:
|
||||||
|
"bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
|
||||||
|
destructive:
|
||||||
|
"bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
|
||||||
|
outline:
|
||||||
|
"border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
|
||||||
|
secondary:
|
||||||
|
"bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
|
||||||
|
ghost:
|
||||||
|
"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
|
||||||
|
link: "text-primary underline-offset-4 hover:underline",
|
||||||
|
},
|
||||||
|
size: {
|
||||||
|
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
||||||
|
sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
|
||||||
|
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
|
||||||
|
icon: "size-9",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
defaultVariants: {
|
||||||
|
variant: "default",
|
||||||
|
size: "default",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
function Button({
|
||||||
|
className,
|
||||||
|
variant,
|
||||||
|
size,
|
||||||
|
asChild = false,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<"button"> &
|
||||||
|
VariantProps<typeof buttonVariants> & {
|
||||||
|
asChild?: boolean
|
||||||
|
}) {
|
||||||
|
const Comp = asChild ? Slot : "button"
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Comp
|
||||||
|
data-slot="button"
|
||||||
|
className={cn(buttonVariants({ variant, size, className }))}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Button, buttonVariants }
|
||||||
@@ -0,0 +1,92 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
function Card({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
data-slot="card"
|
||||||
|
className={cn(
|
||||||
|
"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
data-slot="card-header"
|
||||||
|
className={cn(
|
||||||
|
"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
data-slot="card-title"
|
||||||
|
className={cn("leading-none font-semibold", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
data-slot="card-description"
|
||||||
|
className={cn("text-muted-foreground text-sm", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function CardAction({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
data-slot="card-action"
|
||||||
|
className={cn(
|
||||||
|
"col-start-2 row-span-2 row-start-1 self-start justify-self-end",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function CardContent({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
data-slot="card-content"
|
||||||
|
className={cn("px-6", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
data-slot="card-footer"
|
||||||
|
className={cn("flex items-center px-6 [.border-t]:pt-6", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export {
|
||||||
|
Card,
|
||||||
|
CardHeader,
|
||||||
|
CardFooter,
|
||||||
|
CardTitle,
|
||||||
|
CardAction,
|
||||||
|
CardDescription,
|
||||||
|
CardContent,
|
||||||
|
}
|
||||||
@@ -0,0 +1,30 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
|
||||||
|
import { CheckIcon } from "lucide-react"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
function Checkbox({
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {
|
||||||
|
return (
|
||||||
|
<CheckboxPrimitive.Root
|
||||||
|
data-slot="checkbox"
|
||||||
|
className={cn(
|
||||||
|
"peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<CheckboxPrimitive.Indicator
|
||||||
|
data-slot="checkbox-indicator"
|
||||||
|
className="flex items-center justify-center text-current transition-none"
|
||||||
|
>
|
||||||
|
<CheckIcon className="size-3.5" />
|
||||||
|
</CheckboxPrimitive.Indicator>
|
||||||
|
</CheckboxPrimitive.Root>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Checkbox }
|
||||||
@@ -0,0 +1,165 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
import * as LabelPrimitive from "@radix-ui/react-label"
|
||||||
|
import { Slot } from "@radix-ui/react-slot"
|
||||||
|
import {
|
||||||
|
Controller,
|
||||||
|
FormProvider,
|
||||||
|
useFormContext,
|
||||||
|
useFormState,
|
||||||
|
type ControllerProps,
|
||||||
|
type FieldPath,
|
||||||
|
type FieldValues,
|
||||||
|
} from "react-hook-form"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
import { Label } from "@/components/ui/label"
|
||||||
|
|
||||||
|
const Form = FormProvider
|
||||||
|
|
||||||
|
type FormFieldContextValue<
|
||||||
|
TFieldValues extends FieldValues = FieldValues,
|
||||||
|
TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
|
||||||
|
> = {
|
||||||
|
name: TName
|
||||||
|
}
|
||||||
|
|
||||||
|
const FormFieldContext = React.createContext<FormFieldContextValue>(
|
||||||
|
{} as FormFieldContextValue
|
||||||
|
)
|
||||||
|
|
||||||
|
const FormField = <
|
||||||
|
TFieldValues extends FieldValues = FieldValues,
|
||||||
|
TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
|
||||||
|
>({
|
||||||
|
...props
|
||||||
|
}: ControllerProps<TFieldValues, TName>) => {
|
||||||
|
return (
|
||||||
|
<FormFieldContext.Provider value={{ name: props.name }}>
|
||||||
|
<Controller {...props} />
|
||||||
|
</FormFieldContext.Provider>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
const useFormField = () => {
|
||||||
|
const fieldContext = React.useContext(FormFieldContext)
|
||||||
|
const itemContext = React.useContext(FormItemContext)
|
||||||
|
const { getFieldState } = useFormContext()
|
||||||
|
const formState = useFormState({ name: fieldContext.name })
|
||||||
|
const fieldState = getFieldState(fieldContext.name, formState)
|
||||||
|
|
||||||
|
if (!fieldContext) {
|
||||||
|
throw new Error("useFormField should be used within <FormField>")
|
||||||
|
}
|
||||||
|
|
||||||
|
const { id } = itemContext
|
||||||
|
|
||||||
|
return {
|
||||||
|
id,
|
||||||
|
name: fieldContext.name,
|
||||||
|
formItemId: `${id}-form-item`,
|
||||||
|
formDescriptionId: `${id}-form-item-description`,
|
||||||
|
formMessageId: `${id}-form-item-message`,
|
||||||
|
...fieldState,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
type FormItemContextValue = {
|
||||||
|
id: string
|
||||||
|
}
|
||||||
|
|
||||||
|
const FormItemContext = React.createContext<FormItemContextValue>(
|
||||||
|
{} as FormItemContextValue
|
||||||
|
)
|
||||||
|
|
||||||
|
function FormItem({ className, ...props }: React.ComponentProps<"div">) {
|
||||||
|
const id = React.useId()
|
||||||
|
|
||||||
|
return (
|
||||||
|
<FormItemContext.Provider value={{ id }}>
|
||||||
|
<div
|
||||||
|
data-slot="form-item"
|
||||||
|
className={cn("grid gap-2", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
</FormItemContext.Provider>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function FormLabel({
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof LabelPrimitive.Root>) {
|
||||||
|
const { error, formItemId } = useFormField()
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Label
|
||||||
|
data-slot="form-label"
|
||||||
|
data-error={!!error}
|
||||||
|
className={cn("data-[error=true]:text-destructive", className)}
|
||||||
|
htmlFor={formItemId}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function FormControl({ ...props }: React.ComponentProps<typeof Slot>) {
|
||||||
|
const { error, formItemId, formDescriptionId, formMessageId } = useFormField()
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Slot
|
||||||
|
data-slot="form-control"
|
||||||
|
id={formItemId}
|
||||||
|
aria-describedby={
|
||||||
|
!error
|
||||||
|
? `${formDescriptionId}`
|
||||||
|
: `${formDescriptionId} ${formMessageId}`
|
||||||
|
}
|
||||||
|
aria-invalid={!!error}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function FormDescription({ className, ...props }: React.ComponentProps<"p">) {
|
||||||
|
const { formDescriptionId } = useFormField()
|
||||||
|
|
||||||
|
return (
|
||||||
|
<p
|
||||||
|
data-slot="form-description"
|
||||||
|
id={formDescriptionId}
|
||||||
|
className={cn("text-muted-foreground text-sm", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function FormMessage({ className, ...props }: React.ComponentProps<"p">) {
|
||||||
|
const { error, formMessageId } = useFormField()
|
||||||
|
const body = error ? String(error?.message ?? "") : props.children
|
||||||
|
|
||||||
|
if (!body) {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<p
|
||||||
|
data-slot="form-message"
|
||||||
|
id={formMessageId}
|
||||||
|
className={cn("text-destructive text-sm", className)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
{body}
|
||||||
|
</p>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export {
|
||||||
|
useFormField,
|
||||||
|
Form,
|
||||||
|
FormItem,
|
||||||
|
FormLabel,
|
||||||
|
FormControl,
|
||||||
|
FormDescription,
|
||||||
|
FormMessage,
|
||||||
|
FormField,
|
||||||
|
}
|
||||||
@@ -0,0 +1,21 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
function Input({ className, type, ...props }: React.ComponentProps<"input">) {
|
||||||
|
return (
|
||||||
|
<input
|
||||||
|
type={type}
|
||||||
|
data-slot="input"
|
||||||
|
className={cn(
|
||||||
|
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
||||||
|
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
||||||
|
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Input }
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
"use client"
|
||||||
|
|
||||||
|
import * as React from "react"
|
||||||
|
import * as LabelPrimitive from "@radix-ui/react-label"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
function Label({
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof LabelPrimitive.Root>) {
|
||||||
|
return (
|
||||||
|
<LabelPrimitive.Root
|
||||||
|
data-slot="label"
|
||||||
|
className={cn(
|
||||||
|
"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Label }
|
||||||
@@ -0,0 +1,56 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
function ScrollArea({
|
||||||
|
className,
|
||||||
|
children,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {
|
||||||
|
return (
|
||||||
|
<ScrollAreaPrimitive.Root
|
||||||
|
data-slot="scroll-area"
|
||||||
|
className={cn("relative", className)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<ScrollAreaPrimitive.Viewport
|
||||||
|
data-slot="scroll-area-viewport"
|
||||||
|
className="focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1"
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</ScrollAreaPrimitive.Viewport>
|
||||||
|
<ScrollBar />
|
||||||
|
<ScrollAreaPrimitive.Corner />
|
||||||
|
</ScrollAreaPrimitive.Root>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function ScrollBar({
|
||||||
|
className,
|
||||||
|
orientation = "vertical",
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {
|
||||||
|
return (
|
||||||
|
<ScrollAreaPrimitive.ScrollAreaScrollbar
|
||||||
|
data-slot="scroll-area-scrollbar"
|
||||||
|
orientation={orientation}
|
||||||
|
className={cn(
|
||||||
|
"flex touch-none p-px transition-colors select-none",
|
||||||
|
orientation === "vertical" &&
|
||||||
|
"h-full w-2.5 border-l border-l-transparent",
|
||||||
|
orientation === "horizontal" &&
|
||||||
|
"h-2.5 flex-col border-t border-t-transparent",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<ScrollAreaPrimitive.ScrollAreaThumb
|
||||||
|
data-slot="scroll-area-thumb"
|
||||||
|
className="bg-border relative flex-1 rounded-full"
|
||||||
|
/>
|
||||||
|
</ScrollAreaPrimitive.ScrollAreaScrollbar>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { ScrollArea, ScrollBar }
|
||||||
@@ -0,0 +1,183 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
import * as SelectPrimitive from "@radix-ui/react-select"
|
||||||
|
import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
function Select({
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Root>) {
|
||||||
|
return <SelectPrimitive.Root data-slot="select" {...props} />
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectGroup({
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Group>) {
|
||||||
|
return <SelectPrimitive.Group data-slot="select-group" {...props} />
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectValue({
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Value>) {
|
||||||
|
return <SelectPrimitive.Value data-slot="select-value" {...props} />
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectTrigger({
|
||||||
|
className,
|
||||||
|
size = "default",
|
||||||
|
children,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
|
||||||
|
size?: "sm" | "default"
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<SelectPrimitive.Trigger
|
||||||
|
data-slot="select-trigger"
|
||||||
|
data-size={size}
|
||||||
|
className={cn(
|
||||||
|
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
<SelectPrimitive.Icon asChild>
|
||||||
|
<ChevronDownIcon className="size-4 opacity-50" />
|
||||||
|
</SelectPrimitive.Icon>
|
||||||
|
</SelectPrimitive.Trigger>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectContent({
|
||||||
|
className,
|
||||||
|
children,
|
||||||
|
position = "popper",
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Content>) {
|
||||||
|
return (
|
||||||
|
<SelectPrimitive.Portal>
|
||||||
|
<SelectPrimitive.Content
|
||||||
|
data-slot="select-content"
|
||||||
|
className={cn(
|
||||||
|
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
|
||||||
|
position === "popper" &&
|
||||||
|
"data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
position={position}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<SelectScrollUpButton />
|
||||||
|
<SelectPrimitive.Viewport
|
||||||
|
className={cn(
|
||||||
|
"p-1",
|
||||||
|
position === "popper" &&
|
||||||
|
"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</SelectPrimitive.Viewport>
|
||||||
|
<SelectScrollDownButton />
|
||||||
|
</SelectPrimitive.Content>
|
||||||
|
</SelectPrimitive.Portal>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectLabel({
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Label>) {
|
||||||
|
return (
|
||||||
|
<SelectPrimitive.Label
|
||||||
|
data-slot="select-label"
|
||||||
|
className={cn("text-muted-foreground px-2 py-1.5 text-xs", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectItem({
|
||||||
|
className,
|
||||||
|
children,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Item>) {
|
||||||
|
return (
|
||||||
|
<SelectPrimitive.Item
|
||||||
|
data-slot="select-item"
|
||||||
|
className={cn(
|
||||||
|
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<span className="absolute right-2 flex size-3.5 items-center justify-center">
|
||||||
|
<SelectPrimitive.ItemIndicator>
|
||||||
|
<CheckIcon className="size-4" />
|
||||||
|
</SelectPrimitive.ItemIndicator>
|
||||||
|
</span>
|
||||||
|
<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
|
||||||
|
</SelectPrimitive.Item>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectSeparator({
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
|
||||||
|
return (
|
||||||
|
<SelectPrimitive.Separator
|
||||||
|
data-slot="select-separator"
|
||||||
|
className={cn("bg-border pointer-events-none -mx-1 my-1 h-px", className)}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectScrollUpButton({
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
|
||||||
|
return (
|
||||||
|
<SelectPrimitive.ScrollUpButton
|
||||||
|
data-slot="select-scroll-up-button"
|
||||||
|
className={cn(
|
||||||
|
"flex cursor-default items-center justify-center py-1",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<ChevronUpIcon className="size-4" />
|
||||||
|
</SelectPrimitive.ScrollUpButton>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function SelectScrollDownButton({
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
|
||||||
|
return (
|
||||||
|
<SelectPrimitive.ScrollDownButton
|
||||||
|
data-slot="select-scroll-down-button"
|
||||||
|
className={cn(
|
||||||
|
"flex cursor-default items-center justify-center py-1",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
<ChevronDownIcon className="size-4" />
|
||||||
|
</SelectPrimitive.ScrollDownButton>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export {
|
||||||
|
Select,
|
||||||
|
SelectContent,
|
||||||
|
SelectGroup,
|
||||||
|
SelectItem,
|
||||||
|
SelectLabel,
|
||||||
|
SelectScrollDownButton,
|
||||||
|
SelectScrollUpButton,
|
||||||
|
SelectSeparator,
|
||||||
|
SelectTrigger,
|
||||||
|
SelectValue,
|
||||||
|
}
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
import { useTheme } from "next-themes"
|
||||||
|
import { Toaster as Sonner, ToasterProps } from "sonner"
|
||||||
|
|
||||||
|
const Toaster = ({ ...props }: ToasterProps) => {
|
||||||
|
const { theme = "system" } = useTheme()
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Sonner
|
||||||
|
theme={theme as ToasterProps["theme"]}
|
||||||
|
className="toaster group"
|
||||||
|
style={
|
||||||
|
{
|
||||||
|
"--normal-bg": "var(--popover)",
|
||||||
|
"--normal-text": "var(--popover-foreground)",
|
||||||
|
"--normal-border": "var(--border)",
|
||||||
|
} as React.CSSProperties
|
||||||
|
}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Toaster }
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
import * as React from "react"
|
||||||
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip"
|
||||||
|
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
|
||||||
|
function TooltipProvider({
|
||||||
|
delayDuration = 0,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
|
||||||
|
return (
|
||||||
|
<TooltipPrimitive.Provider
|
||||||
|
data-slot="tooltip-provider"
|
||||||
|
delayDuration={delayDuration}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function Tooltip({
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof TooltipPrimitive.Root>) {
|
||||||
|
return (
|
||||||
|
<TooltipProvider>
|
||||||
|
<TooltipPrimitive.Root data-slot="tooltip" {...props} />
|
||||||
|
</TooltipProvider>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
function TooltipTrigger({
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
|
||||||
|
return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
|
||||||
|
}
|
||||||
|
|
||||||
|
function TooltipContent({
|
||||||
|
className,
|
||||||
|
sideOffset = 0,
|
||||||
|
children,
|
||||||
|
...props
|
||||||
|
}: React.ComponentProps<typeof TooltipPrimitive.Content>) {
|
||||||
|
return (
|
||||||
|
<TooltipPrimitive.Portal>
|
||||||
|
<TooltipPrimitive.Content
|
||||||
|
data-slot="tooltip-content"
|
||||||
|
sideOffset={sideOffset}
|
||||||
|
className={cn(
|
||||||
|
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
|
||||||
|
className
|
||||||
|
)}
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
<TooltipPrimitive.Arrow className="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
|
||||||
|
</TooltipPrimitive.Content>
|
||||||
|
</TooltipPrimitive.Portal>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
|
||||||
@@ -0,0 +1,46 @@
|
|||||||
|
// hooks/useTaskPolling.ts
|
||||||
|
import { useEffect } from "react"
|
||||||
|
import { useTaskStore } from "@/store/taskStore"
|
||||||
|
import {get_task_status} from "@/services/note.ts";
|
||||||
|
|
||||||
|
export const useTaskPolling = (interval = 3000) => {
|
||||||
|
const tasks = useTaskStore(state => state.tasks)
|
||||||
|
const updateTaskContent = useTaskStore(state => state.updateTaskContent)
|
||||||
|
const removeTask=useTaskStore(state=>state.removeTask)
|
||||||
|
useEffect(() => {
|
||||||
|
const timer = setInterval(async () => {
|
||||||
|
const pendingTasks = tasks.filter(
|
||||||
|
(task) => task.status === "PENDING" || task.status === "running"
|
||||||
|
)
|
||||||
|
|
||||||
|
for (const task of pendingTasks) {
|
||||||
|
try {
|
||||||
|
console.log(task)
|
||||||
|
const res = await get_task_status(task.id)
|
||||||
|
const {status}=res.data
|
||||||
|
|
||||||
|
if (status && status !== task.status) {
|
||||||
|
if (status === "SUCCESS") {
|
||||||
|
const { markdown, transcript, audio_meta } = res.data.result
|
||||||
|
|
||||||
|
updateTaskContent(task.id, {
|
||||||
|
status,
|
||||||
|
markdown,
|
||||||
|
transcript,
|
||||||
|
audioMeta: audio_meta,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
updateTaskStatus(task.id, status)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error("❌ 任务轮询失败:", e)
|
||||||
|
removeTask(task.id)
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, interval)
|
||||||
|
|
||||||
|
return () => clearInterval(timer)
|
||||||
|
}, [interval, tasks])
|
||||||
|
}
|
||||||
@@ -0,0 +1,123 @@
|
|||||||
|
@import "tailwindcss";
|
||||||
|
@import "tw-animate-css";
|
||||||
|
|
||||||
|
@custom-variant dark (&:is(.dark *));
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--radius: 0.625rem;
|
||||||
|
--background: oklch(1 0 0);
|
||||||
|
--foreground: oklch(0.145 0 0);
|
||||||
|
--card: oklch(1 0 0);
|
||||||
|
--card-foreground: oklch(0.145 0 0);
|
||||||
|
--popover: oklch(1 0 0);
|
||||||
|
--popover-foreground: oklch(0.145 0 0);
|
||||||
|
--primary: #3C77FB;
|
||||||
|
--primary-light: #e0eeff;
|
||||||
|
--primary-foreground: oklch(0.985 0 0);
|
||||||
|
--secondary: oklch(0.97 0 0);
|
||||||
|
--secondary-foreground: oklch(0.205 0 0);
|
||||||
|
--muted: oklch(0.97 0 0);
|
||||||
|
--muted-foreground: oklch(0.556 0 0);
|
||||||
|
--accent: oklch(0.97 0 0);
|
||||||
|
--accent-foreground: oklch(0.205 0 0);
|
||||||
|
--destructive: oklch(0.577 0.245 27.325);
|
||||||
|
--border: #e6f7ff;
|
||||||
|
--input: oklch(0.922 0 0);
|
||||||
|
--ring: #096dd9;
|
||||||
|
--chart-1: oklch(0.646 0.222 41.116);
|
||||||
|
--chart-2: oklch(0.6 0.118 184.704);
|
||||||
|
--chart-3: oklch(0.398 0.07 227.392);
|
||||||
|
--chart-4: oklch(0.828 0.189 84.429);
|
||||||
|
--chart-5: oklch(0.769 0.188 70.08);
|
||||||
|
--sidebar: oklch(0.985 0 0);
|
||||||
|
--sidebar-foreground: oklch(0.145 0 0);
|
||||||
|
--sidebar-primary: oklch(0.205 0 0);
|
||||||
|
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-accent: oklch(0.97 0 0);
|
||||||
|
--sidebar-accent-foreground: oklch(0.205 0 0);
|
||||||
|
--sidebar-border: oklch(0.922 0 0);
|
||||||
|
--sidebar-ring: oklch(0.708 0 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark {
|
||||||
|
--background: oklch(0.145 0 0);
|
||||||
|
--foreground: oklch(0.985 0 0);
|
||||||
|
--card: oklch(0.205 0 0);
|
||||||
|
--card-foreground: oklch(0.985 0 0);
|
||||||
|
--popover: oklch(0.205 0 0);
|
||||||
|
--popover-foreground: oklch(0.985 0 0);
|
||||||
|
--primary: #3C77FB;
|
||||||
|
--primary-light:#e0eeff;
|
||||||
|
--primary-foreground: oklch(0.205 0 0);
|
||||||
|
--secondary: oklch(0.269 0 0);
|
||||||
|
--secondary-foreground: oklch(0.985 0 0);
|
||||||
|
--muted: oklch(0.269 0 0);
|
||||||
|
--muted-foreground: oklch(0.708 0 0);
|
||||||
|
--accent: oklch(0.269 0 0);
|
||||||
|
--accent-foreground: oklch(0.985 0 0);
|
||||||
|
--destructive: oklch(0.704 0.191 22.216);
|
||||||
|
--border: #e6f7ff;
|
||||||
|
--input: oklch(1 0 0 / 15%);
|
||||||
|
--ring: oklch(0.556 0 0);
|
||||||
|
--chart-1: oklch(0.488 0.243 264.376);
|
||||||
|
--chart-2: oklch(0.696 0.17 162.48);
|
||||||
|
--chart-3: oklch(0.769 0.188 70.08);
|
||||||
|
--chart-4: oklch(0.627 0.265 303.9);
|
||||||
|
--chart-5: oklch(0.645 0.246 16.439);
|
||||||
|
--sidebar: oklch(0.205 0 0);
|
||||||
|
--sidebar-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-primary: oklch(0.488 0.243 264.376);
|
||||||
|
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-accent: oklch(0.269 0 0);
|
||||||
|
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-border: oklch(1 0 0 / 10%);
|
||||||
|
--sidebar-ring: oklch(0.556 0 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
@theme inline {
|
||||||
|
--radius-sm: calc(var(--radius) - 4px);
|
||||||
|
--radius-md: calc(var(--radius) - 2px);
|
||||||
|
--radius-lg: var(--radius);
|
||||||
|
--radius-xl: calc(var(--radius) + 4px);
|
||||||
|
--color-background: var(--background);
|
||||||
|
--color-foreground: var(--foreground);
|
||||||
|
--color-card: var(--card);
|
||||||
|
--color-card-foreground: var(--card-foreground);
|
||||||
|
--color-popover: var(--popover);
|
||||||
|
--color-popover-foreground: var(--popover-foreground);
|
||||||
|
--color-primary: var(--primary);
|
||||||
|
--color-primary-light: var(--primary-light);
|
||||||
|
--color-primary-foreground: var(--primary-foreground);
|
||||||
|
--color-secondary: var(--secondary);
|
||||||
|
--color-secondary-foreground: var(--secondary-foreground);
|
||||||
|
--color-muted: var(--muted);
|
||||||
|
--color-muted-foreground: var(--muted-foreground);
|
||||||
|
--color-accent: var(--accent);
|
||||||
|
--color-accent-foreground: var(--accent-foreground);
|
||||||
|
--color-destructive: var(--destructive);
|
||||||
|
--color-border: var(--border);
|
||||||
|
--color-input: var(--input);
|
||||||
|
--color-ring: var(--ring);
|
||||||
|
--color-chart-1: var(--chart-1);
|
||||||
|
--color-chart-2: var(--chart-2);
|
||||||
|
--color-chart-3: var(--chart-3);
|
||||||
|
--color-chart-4: var(--chart-4);
|
||||||
|
--color-chart-5: var(--chart-5);
|
||||||
|
--color-sidebar: var(--sidebar);
|
||||||
|
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||||
|
--color-sidebar-primary: var(--sidebar-primary);
|
||||||
|
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||||
|
--color-sidebar-accent: var(--sidebar-accent);
|
||||||
|
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||||
|
--color-sidebar-border: var(--sidebar-border);
|
||||||
|
--color-sidebar-ring: var(--sidebar-ring);
|
||||||
|
}
|
||||||
|
|
||||||
|
@layer base {
|
||||||
|
* {
|
||||||
|
@apply border-border outline-ring/50;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
@apply bg-background text-foreground;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,124 @@
|
|||||||
|
@tailwind base;
|
||||||
|
@tailwind components;
|
||||||
|
@tailwind utilities;
|
||||||
|
|
||||||
|
@custom-variant dark (&:is(.dark *));
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--radius: 0.625rem;
|
||||||
|
--background: oklch(1 0 0);
|
||||||
|
--foreground: oklch(0.145 0 0);
|
||||||
|
--card: oklch(1 0 0);
|
||||||
|
--card-foreground: oklch(0.145 0 0);
|
||||||
|
--popover: oklch(1 0 0);
|
||||||
|
--popover-foreground: oklch(0.145 0 0);
|
||||||
|
--primary: #3C77FB;
|
||||||
|
--primary-light: #e0eeff;
|
||||||
|
--primary-foreground: oklch(0.985 0 0);
|
||||||
|
--secondary: oklch(0.97 0 0);
|
||||||
|
--secondary-foreground: oklch(0.205 0 0);
|
||||||
|
--muted: oklch(0.97 0 0);
|
||||||
|
--muted-foreground: oklch(0.556 0 0);
|
||||||
|
--accent: oklch(0.97 0 0);
|
||||||
|
--accent-foreground: oklch(0.205 0 0);
|
||||||
|
--destructive: oklch(0.577 0.245 27.325);
|
||||||
|
--border: #e6f7ff;
|
||||||
|
--input: oklch(0.922 0 0);
|
||||||
|
--ring: #096dd9;
|
||||||
|
--chart-1: oklch(0.646 0.222 41.116);
|
||||||
|
--chart-2: oklch(0.6 0.118 184.704);
|
||||||
|
--chart-3: oklch(0.398 0.07 227.392);
|
||||||
|
--chart-4: oklch(0.828 0.189 84.429);
|
||||||
|
--chart-5: oklch(0.769 0.188 70.08);
|
||||||
|
--sidebar: oklch(0.985 0 0);
|
||||||
|
--sidebar-foreground: oklch(0.145 0 0);
|
||||||
|
--sidebar-primary: oklch(0.205 0 0);
|
||||||
|
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-accent: oklch(0.97 0 0);
|
||||||
|
--sidebar-accent-foreground: oklch(0.205 0 0);
|
||||||
|
--sidebar-border: oklch(0.922 0 0);
|
||||||
|
--sidebar-ring: oklch(0.708 0 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark {
|
||||||
|
--background: oklch(0.145 0 0);
|
||||||
|
--foreground: oklch(0.985 0 0);
|
||||||
|
--card: oklch(0.205 0 0);
|
||||||
|
--card-foreground: oklch(0.985 0 0);
|
||||||
|
--popover: oklch(0.205 0 0);
|
||||||
|
--popover-foreground: oklch(0.985 0 0);
|
||||||
|
--primary: #3C77FB;
|
||||||
|
--primary-light:#e0eeff;
|
||||||
|
--primary-foreground: oklch(0.205 0 0);
|
||||||
|
--secondary: oklch(0.269 0 0);
|
||||||
|
--secondary-foreground: oklch(0.985 0 0);
|
||||||
|
--muted: oklch(0.269 0 0);
|
||||||
|
--muted-foreground: oklch(0.708 0 0);
|
||||||
|
--accent: oklch(0.269 0 0);
|
||||||
|
--accent-foreground: oklch(0.985 0 0);
|
||||||
|
--destructive: oklch(0.704 0.191 22.216);
|
||||||
|
--border: #e6f7ff;
|
||||||
|
--input: oklch(1 0 0 / 15%);
|
||||||
|
--ring: oklch(0.556 0 0);
|
||||||
|
--chart-1: oklch(0.488 0.243 264.376);
|
||||||
|
--chart-2: oklch(0.696 0.17 162.48);
|
||||||
|
--chart-3: oklch(0.769 0.188 70.08);
|
||||||
|
--chart-4: oklch(0.627 0.265 303.9);
|
||||||
|
--chart-5: oklch(0.645 0.246 16.439);
|
||||||
|
--sidebar: oklch(0.205 0 0);
|
||||||
|
--sidebar-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-primary: oklch(0.488 0.243 264.376);
|
||||||
|
--sidebar-primary-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-accent: oklch(0.269 0 0);
|
||||||
|
--sidebar-accent-foreground: oklch(0.985 0 0);
|
||||||
|
--sidebar-border: oklch(1 0 0 / 10%);
|
||||||
|
--sidebar-ring: oklch(0.556 0 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
@theme inline {
|
||||||
|
--radius-sm: calc(var(--radius) - 4px);
|
||||||
|
--radius-md: calc(var(--radius) - 2px);
|
||||||
|
--radius-lg: var(--radius);
|
||||||
|
--radius-xl: calc(var(--radius) + 4px);
|
||||||
|
--color-background: var(--background);
|
||||||
|
--color-foreground: var(--foreground);
|
||||||
|
--color-card: var(--card);
|
||||||
|
--color-card-foreground: var(--card-foreground);
|
||||||
|
--color-popover: var(--popover);
|
||||||
|
--color-popover-foreground: var(--popover-foreground);
|
||||||
|
--color-primary: var(--primary);
|
||||||
|
--color-primary-light: var(--primary-light);
|
||||||
|
--color-primary-foreground: var(--primary-foreground);
|
||||||
|
--color-secondary: var(--secondary);
|
||||||
|
--color-secondary-foreground: var(--secondary-foreground);
|
||||||
|
--color-muted: var(--muted);
|
||||||
|
--color-muted-foreground: var(--muted-foreground);
|
||||||
|
--color-accent: var(--accent);
|
||||||
|
--color-accent-foreground: var(--accent-foreground);
|
||||||
|
--color-destructive: var(--destructive);
|
||||||
|
--color-border: var(--border);
|
||||||
|
--color-input: var(--input);
|
||||||
|
--color-ring: var(--ring);
|
||||||
|
--color-chart-1: var(--chart-1);
|
||||||
|
--color-chart-2: var(--chart-2);
|
||||||
|
--color-chart-3: var(--chart-3);
|
||||||
|
--color-chart-4: var(--chart-4);
|
||||||
|
--color-chart-5: var(--chart-5);
|
||||||
|
--color-sidebar: var(--sidebar);
|
||||||
|
--color-sidebar-foreground: var(--sidebar-foreground);
|
||||||
|
--color-sidebar-primary: var(--sidebar-primary);
|
||||||
|
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
|
||||||
|
--color-sidebar-accent: var(--sidebar-accent);
|
||||||
|
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
|
||||||
|
--color-sidebar-border: var(--sidebar-border);
|
||||||
|
--color-sidebar-ring: var(--sidebar-ring);
|
||||||
|
}
|
||||||
|
|
||||||
|
@layer base {
|
||||||
|
* {
|
||||||
|
@apply border-border outline-ring/50;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
@apply bg-background text-foreground;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,43 @@
|
|||||||
|
import type { FC, ReactNode } from 'react'
|
||||||
|
import { Button } from "@/components/ui/button.tsx"
|
||||||
|
|
||||||
|
interface HomeLayoutProps {
|
||||||
|
form: ReactNode
|
||||||
|
preview: ReactNode
|
||||||
|
}
|
||||||
|
|
||||||
|
const HomeLayout: FC<HomeLayoutProps> = ({ form, preview }) => {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen flex flex-col bg-white">
|
||||||
|
<div className="flex flex-1">
|
||||||
|
{/* 左侧部分:Header + 表单 */}
|
||||||
|
<aside className="w-[400px] bg-white border-r border-neutral-200 flex flex-col">
|
||||||
|
{/* Header */}
|
||||||
|
<header className="h-16 flex items-center px-6 gap-2">
|
||||||
|
<div className="w-10 h-10 rounded-2xl overflow-hidden flex justify-center items-center">
|
||||||
|
<img src="/icon.svg" alt="logo" className="w-full h-full object-contain" />
|
||||||
|
</div>
|
||||||
|
<div className="text-2xl font-bold text-gray-800">BiliNote</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
{/* 表单内容 */}
|
||||||
|
<div className="flex-1 p-4 overflow-auto">
|
||||||
|
{form}
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
{/* 右侧预览区域 */}
|
||||||
|
<main className="flex-1 h-screen p-6 bg-white overflow-hidden">
|
||||||
|
{preview}
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 页脚 */}
|
||||||
|
{/*<footer className="h-12 bg-white shadow-inner flex items-center justify-center text-sm text-neutral-600">*/}
|
||||||
|
{/* © 2025 BiliNote. All rights reserved.*/}
|
||||||
|
{/*</footer>*/}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default HomeLayout
|
||||||
@@ -0,0 +1,32 @@
|
|||||||
|
import type { ReactNode, FC } from "react"
|
||||||
|
// import "@/global.css"
|
||||||
|
import { Toaster } from 'react-hot-toast'
|
||||||
|
|
||||||
|
interface RootLayoutProps {
|
||||||
|
children: ReactNode
|
||||||
|
}
|
||||||
|
|
||||||
|
export const metadata = {
|
||||||
|
title: "BiliNote - 视频笔记生成器",
|
||||||
|
description: "通过视频链接结合大模型自动生成对应的笔记",
|
||||||
|
}
|
||||||
|
|
||||||
|
const RootLayout: FC<RootLayoutProps> = ({ children }) => {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen bg-neutral-100 text-neutral-900 font-sans">
|
||||||
|
<Toaster
|
||||||
|
position="top-center" // 顶部居中显示
|
||||||
|
toastOptions={{
|
||||||
|
style: {
|
||||||
|
borderRadius: '8px',
|
||||||
|
background: '#333',
|
||||||
|
color: '#fff',
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
{children}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default RootLayout
|
||||||
@@ -0,0 +1,6 @@
|
|||||||
|
import { clsx, type ClassValue } from "clsx"
|
||||||
|
import { twMerge } from "tailwind-merge"
|
||||||
|
|
||||||
|
export function cn(...inputs: ClassValue[]) {
|
||||||
|
return twMerge(clsx(inputs))
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
import { StrictMode } from 'react'
|
||||||
|
import { createRoot } from 'react-dom/client'
|
||||||
|
import './index.css'
|
||||||
|
import App from './App.tsx'
|
||||||
|
import RootLayout from "./layouts/RootLayout.tsx";
|
||||||
|
|
||||||
|
createRoot(document.getElementById('root')!).render(
|
||||||
|
<StrictMode>
|
||||||
|
<RootLayout>
|
||||||
|
<App />
|
||||||
|
</RootLayout>
|
||||||
|
</StrictMode>,
|
||||||
|
)
|
||||||
@@ -0,0 +1,42 @@
|
|||||||
|
import React,{FC,useEffect,useState} from "react";
|
||||||
|
import HomeLayout from "@/layouts/HomeLayout.tsx";
|
||||||
|
import NoteForm from '@/pages/components/NoteForm'
|
||||||
|
import MarkdownViewer from '@/pages/components/MarkdownViewer'
|
||||||
|
import NoteFormWrapper from "@/pages/components/NoteFormWrapper.tsx";
|
||||||
|
import {get_task_status} from "@/services/note.ts";
|
||||||
|
import {useTaskStore} from "@/store/taskStore";
|
||||||
|
type ViewStatus = 'idle' | 'loading' | 'success'
|
||||||
|
export const HomePage:FC =()=>{
|
||||||
|
const tasks = useTaskStore((state) => state.tasks)
|
||||||
|
const currentTaskId = useTaskStore((state) => state.currentTaskId)
|
||||||
|
|
||||||
|
const currentTask = tasks.find((t) => t.id === currentTaskId)
|
||||||
|
|
||||||
|
const [status, setStatus] = useState<ViewStatus>('idle')
|
||||||
|
|
||||||
|
const content = currentTask?.markdown || ''
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!currentTask) {
|
||||||
|
setStatus('idle')
|
||||||
|
} else if (currentTask.status === 'PENDING') {
|
||||||
|
setStatus('loading')
|
||||||
|
} else if (currentTask.status === 'SUCCESS') {
|
||||||
|
setStatus('success')
|
||||||
|
}
|
||||||
|
}, [currentTask])
|
||||||
|
|
||||||
|
// useEffect( () => {
|
||||||
|
// get_task_status('d4e87938-c066-48a0-bbd5-9bec40d53354').then(res=>{
|
||||||
|
// console.log('res1',res)
|
||||||
|
// setContent(res.data.result.markdown)
|
||||||
|
// })
|
||||||
|
// }, [tasks]);
|
||||||
|
return (
|
||||||
|
<HomeLayout
|
||||||
|
form={<NoteForm/>}
|
||||||
|
preview={<MarkdownViewer status={status} content={content} />}
|
||||||
|
|
||||||
|
/>
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -0,0 +1,168 @@
|
|||||||
|
import { useState } from "react"
|
||||||
|
import ReactMarkdown from "react-markdown"
|
||||||
|
import { Button } from "@/components/ui/button"
|
||||||
|
import { Copy, Download, FileText,ArrowRight } from "lucide-react"
|
||||||
|
import { toast } from "sonner" // 你可以换成自己的通知组件
|
||||||
|
import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter'
|
||||||
|
import { solarizedlight as codeStyle } from 'react-syntax-highlighter/dist/cjs/styles/prism'
|
||||||
|
import 'github-markdown-css/github-markdown-light.css'
|
||||||
|
import {FC} from 'react'
|
||||||
|
import Loading from "@/components/Lottie/Loading.tsx";
|
||||||
|
import Idle from "@/components/Lottie/Idle.tsx";
|
||||||
|
import {useTaskStore} from "@/store/taskStore";
|
||||||
|
interface MarkdownViewerProps {
|
||||||
|
content: string
|
||||||
|
status: 'idle' | 'loading' | 'success'
|
||||||
|
}
|
||||||
|
|
||||||
|
const MarkdownViewer: FC<MarkdownViewerProps> = ({ content, status }) => {
|
||||||
|
const [copied, setCopied] = useState(false)
|
||||||
|
const getCurrentTask =useTaskStore.getState().getCurrentTask
|
||||||
|
const handleCopy = async () => {
|
||||||
|
try {
|
||||||
|
await navigator.clipboard.writeText(content)
|
||||||
|
setCopied(true)
|
||||||
|
toast.success("已复制到剪贴板")
|
||||||
|
setTimeout(() => setCopied(false), 2000)
|
||||||
|
} catch (e) {
|
||||||
|
toast.error(`复制失败${e}`)
|
||||||
|
toast.error("复制失败",e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleDownload = () => {
|
||||||
|
const currentTask=getCurrentTask()
|
||||||
|
const currentTaskName=currentTask?.audioMeta.title
|
||||||
|
const blob = new Blob([content], { type: "text/markdown;charset=utf-8" })
|
||||||
|
const link = document.createElement("a")
|
||||||
|
link.href = URL.createObjectURL(blob)
|
||||||
|
link.download = `${currentTaskName}.md`
|
||||||
|
document.body.appendChild(link)
|
||||||
|
link.click()
|
||||||
|
document.body.removeChild(link)
|
||||||
|
}
|
||||||
|
if (status === 'loading') {
|
||||||
|
return (
|
||||||
|
<div className="w-full h-screen flex flex-col justify-center items-center text-neutral-500 space-y-4">
|
||||||
|
<Loading className='h-5 w-5' />
|
||||||
|
<div className="text-center text-sm">
|
||||||
|
<p className="text-lg font-bold">正在生成笔记,请稍候…</p>
|
||||||
|
<p className="mt-2 text-xs text-neutral-500">这可能需要几秒钟时间,取决于视频长度</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
else if (status === 'idle'){
|
||||||
|
return (
|
||||||
|
<div className="w-full h-screen flex flex-col justify-center items-center text-neutral-500 space-y-3">
|
||||||
|
|
||||||
|
<Idle ></Idle>
|
||||||
|
|
||||||
|
<div className="text-center">
|
||||||
|
<p className="text-lg font-bold">输入视频链接并点击“生成笔记”</p>
|
||||||
|
<p className="mt-2 text-xs text-neutral-500">支持哔哩哔哩、YouTube 等视频平台</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="w-full h-full flex flex-col">
|
||||||
|
{/* 顶部操作栏 */}
|
||||||
|
<div className="flex items-center justify-between mb-4">
|
||||||
|
<h2 className="text-xl font-semibold text-neutral-900 flex items-center gap-2">
|
||||||
|
<FileText className="w-5 h-5 text-primary" />
|
||||||
|
笔记内容
|
||||||
|
</h2>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<Button onClick={handleCopy} variant="outline" size="sm">
|
||||||
|
<Copy className="w-4 h-4 mr-1" />
|
||||||
|
{copied ? "已复制" : "复制"}
|
||||||
|
</Button>
|
||||||
|
<Button onClick={handleDownload} variant="outline" size="sm">
|
||||||
|
<Download className="w-4 h-4 mr-1" />
|
||||||
|
导出 Markdown
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 滚动容器 */}
|
||||||
|
|
||||||
|
<div className='overflow-y-auto'>
|
||||||
|
{
|
||||||
|
content && content!='loading' || content!='empty'?(
|
||||||
|
<div className="markdown-body flex-1 bg-white"> <ReactMarkdown
|
||||||
|
|
||||||
|
components={{
|
||||||
|
code({ node, inline, className, children, ...props }) {
|
||||||
|
const match = /language-(\w+)/.exec(className || '')
|
||||||
|
const codeContent = String(children).replace(/\n$/, '')
|
||||||
|
|
||||||
|
if (!inline && match) {
|
||||||
|
return (
|
||||||
|
<div className="relative group">
|
||||||
|
<SyntaxHighlighter
|
||||||
|
style={codeStyle}
|
||||||
|
language={match[1]}
|
||||||
|
PreTag="div"
|
||||||
|
{...props}
|
||||||
|
>
|
||||||
|
{codeContent}
|
||||||
|
</SyntaxHighlighter>
|
||||||
|
<button
|
||||||
|
onClick={() => {
|
||||||
|
navigator.clipboard.writeText(codeContent)
|
||||||
|
toast.success("代码已复制")
|
||||||
|
}}
|
||||||
|
className="absolute top-2 right-2 hidden group-hover:flex items-center gap-1 text-xs px-2 py-1 bg-white/70 border border-gray-300 rounded hover:bg-white shadow-sm transition"
|
||||||
|
>
|
||||||
|
<Copy className="w-3 h-3" />
|
||||||
|
复制
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<code className="bg-gray-100 px-1 py-0.5 rounded text-sm" {...props}>
|
||||||
|
{children}
|
||||||
|
</code>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{content}
|
||||||
|
</ReactMarkdown></div>
|
||||||
|
):(
|
||||||
|
<div className='w-full h-screen flex justify-center items-center'>
|
||||||
|
<div className='w-[300px] flex-col justify-items-center '>
|
||||||
|
<div className="w-16 h-16 bg-primary-light rounded-full flex items-center justify-center mb-4">
|
||||||
|
<ArrowRight className="h-8 w-8 text-primary" />
|
||||||
|
</div>
|
||||||
|
<p className="text-neutral-600 mb-2">输入视频链接并点击"生成笔记"按钮</p>
|
||||||
|
<p className="text-xs text-neutral-500">支持哔哩哔哩、YouTube等视频网站</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
{/*<div className="markdown-body flex-1 overflow-y-auto bg-white">*/}
|
||||||
|
{/* {content ? (*/}
|
||||||
|
{/* */}
|
||||||
|
{/* ) : (*/}
|
||||||
|
{/* <>*/}
|
||||||
|
{/* <div className="w-16 h-16 bg-primary-light rounded-full flex items-center justify-center mb-4">*/}
|
||||||
|
{/* <ArrowRight className="h-8 w-8 text-primary" />*/}
|
||||||
|
{/* </div>*/}
|
||||||
|
{/* <p className="text-neutral-600 mb-2">输入视频链接并点击"生成笔记"按钮</p>*/}
|
||||||
|
{/* <p className="text-xs text-neutral-500">支持哔哩哔哩、YouTube、腾讯视频和爱奇艺</p>*/}
|
||||||
|
{/* </>*/}
|
||||||
|
{/* )}*/}
|
||||||
|
{/*</div>*/}
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default MarkdownViewer
|
||||||
@@ -0,0 +1,287 @@
|
|||||||
|
import {
|
||||||
|
Form,
|
||||||
|
FormControl,
|
||||||
|
FormDescription,
|
||||||
|
FormField,
|
||||||
|
FormItem,
|
||||||
|
FormLabel,
|
||||||
|
FormMessage,
|
||||||
|
} from "@/components/ui/form"
|
||||||
|
import { Input } from "@/components/ui/input"
|
||||||
|
import {
|
||||||
|
Select,
|
||||||
|
SelectContent,
|
||||||
|
SelectItem,
|
||||||
|
SelectTrigger,
|
||||||
|
SelectValue,
|
||||||
|
} from "@/components/ui/select"
|
||||||
|
import { Button } from "@/components/ui/button"
|
||||||
|
import { Checkbox } from "@/components/ui/checkbox"
|
||||||
|
import { useForm } from "react-hook-form"
|
||||||
|
import { z } from "zod"
|
||||||
|
import { zodResolver } from "@hookform/resolvers/zod"
|
||||||
|
import { Info,Clock } from "lucide-react"
|
||||||
|
|
||||||
|
import {Tooltip, TooltipContent, TooltipProvider, TooltipTrigger} from "@/components/ui/tooltip.tsx";
|
||||||
|
import {generateNote} from "@/services/note.ts";
|
||||||
|
import {useTaskStore} from "@/store/taskStore";
|
||||||
|
import { useState } from "react"
|
||||||
|
import NoteHistory from "@/pages/components/NoteHistory.tsx";
|
||||||
|
|
||||||
|
// ✅ 定义表单 schema
|
||||||
|
const formSchema = z.object({
|
||||||
|
video_url: z.string().url("请输入正确的视频链接"),
|
||||||
|
platform: z.string().nonempty("请选择平台"),
|
||||||
|
quality: z.enum(["fast", "medium", "slow"], {
|
||||||
|
required_error: "请选择音频质量",
|
||||||
|
}),
|
||||||
|
screenshot: z.boolean().optional(),
|
||||||
|
link:z.boolean().optional(),
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
type NoteFormValues = z.infer<typeof formSchema>
|
||||||
|
|
||||||
|
const NoteForm = () => {
|
||||||
|
const [selectedTaskId] = useState<string | null>(null)
|
||||||
|
|
||||||
|
const tasks = useTaskStore((state) => state.tasks)
|
||||||
|
const setCurrentTask=useTaskStore((state)=>state.setCurrentTask)
|
||||||
|
const currentTaskId=useTaskStore(state=>state.currentTaskId )
|
||||||
|
tasks.find((t) => t.id === selectedTaskId);
|
||||||
|
const form = useForm<NoteFormValues>({
|
||||||
|
resolver: zodResolver(formSchema),
|
||||||
|
defaultValues: {
|
||||||
|
video_url: "",
|
||||||
|
platform: "bilibili",
|
||||||
|
quality: "medium", // 默认中等质量
|
||||||
|
screenshot: false,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
const isGenerating = false
|
||||||
|
|
||||||
|
const onSubmit = async (data: NoteFormValues) => {
|
||||||
|
console.log("🎯 提交内容:", data)
|
||||||
|
await generateNote({
|
||||||
|
video_url: data.video_url,
|
||||||
|
platform: data.platform,
|
||||||
|
quality: data.quality,
|
||||||
|
screenshot:data.screenshot,
|
||||||
|
link:data.link
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="flex flex-col h-full">
|
||||||
|
<Form {...form}>
|
||||||
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
|
||||||
|
<div className="space-y-2">
|
||||||
|
<div className="flex items-center justify-between my-3">
|
||||||
|
<h2 className="block ">视频链接</h2>
|
||||||
|
<TooltipProvider>
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<Info className="h-4 w-4 text-neutral-400 hover:text-primary cursor-pointer" />
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent>
|
||||||
|
<p className="text-xs ">输入视频链接,支持哔哩哔哩、YouTube等平台</p>
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
</TooltipProvider>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex gap-2">
|
||||||
|
{/* 平台选择 */}
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="platform"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<Select
|
||||||
|
onValueChange={field.onChange}
|
||||||
|
defaultValue={field.value}
|
||||||
|
>
|
||||||
|
<FormControl>
|
||||||
|
<SelectTrigger className="w-32">
|
||||||
|
<SelectValue placeholder="选择平台" />
|
||||||
|
</SelectTrigger>
|
||||||
|
</FormControl>
|
||||||
|
<SelectContent>
|
||||||
|
<SelectItem value="bilibili">哔哩哔哩</SelectItem>
|
||||||
|
<SelectItem value="youtube">Youtube</SelectItem>
|
||||||
|
{/*<SelectItem value="local">本地视频</SelectItem>*/}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* 视频地址 */}
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="video_url"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem className="flex-1">
|
||||||
|
<FormControl>
|
||||||
|
<Input
|
||||||
|
placeholder="视频链接"
|
||||||
|
{...field}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
{/*<p className="text-xs text-neutral-500">*/}
|
||||||
|
{/* 支持哔哩哔哩视频链接,例如:*/}
|
||||||
|
{/* https://www.bilibili.com/video/BV1vc25YQE9X/*/}
|
||||||
|
{/*</p>*/}
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="quality"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<div className="flex items-center justify-between my-3">
|
||||||
|
<h2 className="block ">音频质量</h2>
|
||||||
|
<TooltipProvider>
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<Info className="h-4 w-4 text-neutral-400 hover:text-primary cursor-pointer" />
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent>
|
||||||
|
<p className="text-xs max-w-[200px]">质量越高,下载体积越大,速度越慢</p>
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
</TooltipProvider>
|
||||||
|
</div>
|
||||||
|
<Select
|
||||||
|
onValueChange={field.onChange}
|
||||||
|
defaultValue={field.value}
|
||||||
|
>
|
||||||
|
<FormControl>
|
||||||
|
<SelectTrigger className="w-full">
|
||||||
|
<SelectValue placeholder="选择质量" />
|
||||||
|
</SelectTrigger>
|
||||||
|
</FormControl>
|
||||||
|
<SelectContent>
|
||||||
|
<SelectItem value="fast">快速(压缩)</SelectItem>
|
||||||
|
<SelectItem value="medium">中等(推荐)</SelectItem>
|
||||||
|
<SelectItem value="slow">高质量(清晰)</SelectItem>
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
{/*<FormDescription className="text-xs text-neutral-500">*/}
|
||||||
|
{/* 质量越高,下载体积越大,速度越慢*/}
|
||||||
|
{/*</FormDescription>*/}
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 是否需要原片位置 */}
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="link"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem className="flex items-center space-x-2">
|
||||||
|
{/* Tooltip 部分 */}
|
||||||
|
|
||||||
|
|
||||||
|
<FormControl>
|
||||||
|
<Checkbox
|
||||||
|
checked={field.value}
|
||||||
|
onCheckedChange={field.onChange}
|
||||||
|
id="link"
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
|
||||||
|
<FormLabel
|
||||||
|
htmlFor="link"
|
||||||
|
className="text-sm font-medium leading-none"
|
||||||
|
>
|
||||||
|
是否插入内容跳转链接
|
||||||
|
</FormLabel>
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
{/* 是否需要下载 */}
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="screenshot"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem className="flex items-center space-x-2">
|
||||||
|
{/* Tooltip 部分 */}
|
||||||
|
|
||||||
|
|
||||||
|
<FormControl>
|
||||||
|
<Checkbox
|
||||||
|
checked={field.value}
|
||||||
|
onCheckedChange={field.onChange}
|
||||||
|
id="screenshot"
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
|
||||||
|
<FormLabel
|
||||||
|
htmlFor="screenshot"
|
||||||
|
className="text-sm font-medium leading-none"
|
||||||
|
>
|
||||||
|
是否插入视频截图
|
||||||
|
</FormLabel>
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* 提交按钮 */}
|
||||||
|
<Button
|
||||||
|
type="submit"
|
||||||
|
className="w-full bg-primary cursor-pointer"
|
||||||
|
>
|
||||||
|
{isGenerating ? "正在生成…" : "生成笔记"}
|
||||||
|
</Button>
|
||||||
|
</form>
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
|
||||||
|
{/*生成历史 */}
|
||||||
|
<div className="flex items-center gap-2 my-4">
|
||||||
|
<Clock className="h-4 w-4 text-neutral-500" />
|
||||||
|
<h2 className="text-base font-medium text-neutral-900">生成历史</h2>
|
||||||
|
</div>
|
||||||
|
<div className="flex-1 min-h-0 overflow-auto">
|
||||||
|
<NoteHistory onSelect={setCurrentTask} selectedId={currentTaskId} />
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 添加一些额外的说明或功能介绍 */}
|
||||||
|
<div className="mt-6 p-4 bg-primary-light rounded-lg">
|
||||||
|
<h3 className="font-medium text-primary mb-2">功能介绍</h3>
|
||||||
|
<ul className="text-sm space-y-2 text-neutral-600">
|
||||||
|
<li className="flex items-start gap-2">
|
||||||
|
<span className="text-primary font-bold">•</span>
|
||||||
|
<span>自动提取视频内容,生成结构化笔记</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start gap-2">
|
||||||
|
<span className="text-primary font-bold">•</span>
|
||||||
|
<span>支持多个视频平台,包括哔哩哔哩、YouTube等</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start gap-2">
|
||||||
|
<span className="text-primary font-bold">•</span>
|
||||||
|
<span>一键复制笔记,支持Markdown格式</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex items-start gap-2">
|
||||||
|
<span className="text-primary font-bold">•</span>
|
||||||
|
<span>可选择是否插入图片</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default NoteForm
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
import { useForm } from "react-hook-form"
|
||||||
|
import { Form } from "@/components/ui/form"
|
||||||
|
import NoteForm from "./NoteForm"
|
||||||
|
|
||||||
|
const NoteFormWrapper = () => {
|
||||||
|
const form = useForm()
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Form {...form}>
|
||||||
|
<NoteForm />
|
||||||
|
</Form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default NoteFormWrapper
|
||||||
@@ -0,0 +1,100 @@
|
|||||||
|
import { useTaskStore } from "@/store/taskStore"
|
||||||
|
import { FC } from "react"
|
||||||
|
import { ScrollArea } from "@/components/ui/scroll-area"
|
||||||
|
import { Badge } from "@/components/ui/badge"
|
||||||
|
import { cn } from "@/lib/utils"
|
||||||
|
import { Trash ,Clock} from "lucide-react"
|
||||||
|
import { Button } from "@/components/ui/button"
|
||||||
|
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
|
||||||
|
|
||||||
|
interface NoteHistoryProps {
|
||||||
|
onSelect: (taskId: string) => void
|
||||||
|
selectedId: string | null
|
||||||
|
}
|
||||||
|
|
||||||
|
const NoteHistory: FC<NoteHistoryProps> = ({ onSelect, selectedId }) => {
|
||||||
|
const tasks = useTaskStore((state) => state.tasks)
|
||||||
|
const removeTask = useTaskStore((state) => state.removeTask)
|
||||||
|
|
||||||
|
if (tasks.length === 0) {
|
||||||
|
return (
|
||||||
|
<div className="text-center py-6 bg-neutral-50 rounded-md border border-neutral-200">
|
||||||
|
<p className="text-sm text-neutral-500">暂无历史记录</p>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ScrollArea className="h-auto max-h-[20vh] sm:max-h-[10vh]">
|
||||||
|
|
||||||
|
<div className="flex flex-col space-y-2">
|
||||||
|
{tasks.map((task) => (
|
||||||
|
<div
|
||||||
|
key={task.id}
|
||||||
|
className={cn(
|
||||||
|
"flex items-center gap-4 p-3 cursor-pointer transition hover:bg-neutral-50 rounded-md border",
|
||||||
|
selectedId === task.id && "border-primary bg-primary-light"
|
||||||
|
)}
|
||||||
|
onClick={() => onSelect(task.id)}
|
||||||
|
>
|
||||||
|
{/* 封面图 */}
|
||||||
|
<img
|
||||||
|
src={task.audioMeta.cover_url
|
||||||
|
? `/api/image_proxy?url=${encodeURIComponent(task.audioMeta.cover_url)}`
|
||||||
|
: "/placeholder.png"}
|
||||||
|
alt="封面"
|
||||||
|
className="w-16 h-10 object-cover rounded-md"
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* 标题 + 状态 */}
|
||||||
|
|
||||||
|
<div className="flex items-center justify-between gap-2 min-w-0 w-full">
|
||||||
|
<TooltipProvider>
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<div className="font-medium max-w-[120px] truncate flex-1">{task.audioMeta.title || "未命名笔记"}</div>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent>
|
||||||
|
<p>{task.audioMeta.title || "未命名笔记"}</p>
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
</TooltipProvider>
|
||||||
|
<div className="shrink-0">
|
||||||
|
{task.status === "SUCCESS" && <Badge variant="default">已完成</Badge>}
|
||||||
|
{task.status === "PENDING" && <Badge variant="outline">等待中</Badge>}
|
||||||
|
{task.status === "FAILED" && <Badge variant="destructive">失败</Badge>}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{/* 删除按钮 */}
|
||||||
|
<TooltipProvider>
|
||||||
|
<Tooltip>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
<Button
|
||||||
|
type="button"
|
||||||
|
size="icon"
|
||||||
|
variant="ghost"
|
||||||
|
onClick={(e) => {
|
||||||
|
e.stopPropagation()
|
||||||
|
removeTask(task.id)
|
||||||
|
}}
|
||||||
|
className="shrink-0"
|
||||||
|
>
|
||||||
|
<Trash className="w-4 h-4 text-muted-foreground" />
|
||||||
|
</Button>
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent>
|
||||||
|
<p>删除</p>
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
</TooltipProvider>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</ScrollArea>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default NoteHistory
|
||||||
@@ -0,0 +1,97 @@
|
|||||||
|
import request from "@/utils/request"
|
||||||
|
import toast from 'react-hot-toast'
|
||||||
|
import {useTaskStore} from "@/store/taskStore";
|
||||||
|
import request from "@/utils/request"
|
||||||
|
interface GenerateNotePayload {
|
||||||
|
video_url: string
|
||||||
|
platform: "bilibili" | "youtube"
|
||||||
|
quality: "fast" | "medium" | "slow"
|
||||||
|
}
|
||||||
|
|
||||||
|
export const generateNote = async (data: {
|
||||||
|
video_url: string;
|
||||||
|
link: undefined | boolean;
|
||||||
|
screenshot: undefined | boolean;
|
||||||
|
platform: string;
|
||||||
|
quality: string
|
||||||
|
}) => {
|
||||||
|
try {
|
||||||
|
const response = await request.post("/generate_note", data)
|
||||||
|
|
||||||
|
if (response.data.code!=0){
|
||||||
|
if (response.data.msg){
|
||||||
|
toast.error(response.data.msg)
|
||||||
|
|
||||||
|
}
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
toast.success("笔记生成任务已提交!")
|
||||||
|
|
||||||
|
const taskId = response.data.data.task_id
|
||||||
|
|
||||||
|
console.log('res',response)
|
||||||
|
// 成功提示
|
||||||
|
useTaskStore.getState().addPendingTask(taskId, data.platform)
|
||||||
|
|
||||||
|
return response.data
|
||||||
|
} catch (e: any) {
|
||||||
|
console.error("❌ 请求出错", e)
|
||||||
|
|
||||||
|
// 错误提示
|
||||||
|
toast.error(
|
||||||
|
"笔记生成失败,请稍后重试"
|
||||||
|
)
|
||||||
|
|
||||||
|
throw e // 抛出错误以便调用方处理
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
export const delete_task = async ({video_id, platform}) => {
|
||||||
|
try {
|
||||||
|
const data={
|
||||||
|
video_id,platform
|
||||||
|
}
|
||||||
|
const res = await request.post("/delete_task",
|
||||||
|
data
|
||||||
|
)
|
||||||
|
|
||||||
|
if (res.data.code === 0) {
|
||||||
|
toast.success("任务已成功删除")
|
||||||
|
return res.data
|
||||||
|
} else {
|
||||||
|
toast.error(res.data.message || "删除失败")
|
||||||
|
throw new Error(res.data.message || "删除失败")
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
toast.error("请求异常,删除任务失败")
|
||||||
|
console.error("❌ 删除任务失败:", e)
|
||||||
|
throw e
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export const get_task_status=async (task_id:string)=>{
|
||||||
|
try {
|
||||||
|
const response = await request.get("/task_status/"+task_id)
|
||||||
|
|
||||||
|
if (response.data.code==0 && response.data.status=='SUCCESS') {
|
||||||
|
// toast.success("笔记生成成功")
|
||||||
|
}
|
||||||
|
console.log('res',response)
|
||||||
|
// 成功提示
|
||||||
|
|
||||||
|
return response.data
|
||||||
|
}
|
||||||
|
catch (e){
|
||||||
|
console.error("❌ 请求出错", e)
|
||||||
|
|
||||||
|
// 错误提示
|
||||||
|
toast.error(
|
||||||
|
"笔记生成失败,请稍后重试"
|
||||||
|
)
|
||||||
|
|
||||||
|
throw e // 抛出错误以便调用方处理
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,124 @@
|
|||||||
|
import { create } from 'zustand'
|
||||||
|
import { persist } from 'zustand/middleware'
|
||||||
|
import {delete_task} from "@/services/note.ts";
|
||||||
|
|
||||||
|
export type TaskStatus = 'PENDING' | 'RUNNING' | 'SUCCESS' | 'FAILD'
|
||||||
|
|
||||||
|
export interface AudioMeta {
|
||||||
|
cover_url: string
|
||||||
|
duration: number
|
||||||
|
file_path: string
|
||||||
|
platform: string
|
||||||
|
raw_info: any
|
||||||
|
title: string
|
||||||
|
video_id: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface Segment {
|
||||||
|
start: number
|
||||||
|
end: number
|
||||||
|
text: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface Transcript {
|
||||||
|
full_text: string
|
||||||
|
language: string
|
||||||
|
raw: any
|
||||||
|
segments: Segment[]
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface Task {
|
||||||
|
id: string
|
||||||
|
markdown: string
|
||||||
|
transcript: Transcript
|
||||||
|
status: TaskStatus
|
||||||
|
audioMeta: AudioMeta
|
||||||
|
createdAt: string
|
||||||
|
}
|
||||||
|
|
||||||
|
interface TaskStore {
|
||||||
|
tasks: Task[]
|
||||||
|
currentTaskId: string | null
|
||||||
|
platform:string|null
|
||||||
|
addPendingTask: (taskId: string, platform: string) => void
|
||||||
|
updateTaskContent: (id: string, data: Partial<Omit<Task, "id" | "createdAt">>) => void
|
||||||
|
removeTask: (id: string) => void
|
||||||
|
clearTasks: () => void
|
||||||
|
setCurrentTask: (taskId: string | null) => void
|
||||||
|
getCurrentTask: () => Task | null
|
||||||
|
}
|
||||||
|
|
||||||
|
export const useTaskStore = create<TaskStore>()(
|
||||||
|
persist(
|
||||||
|
(set,get) => ({
|
||||||
|
tasks: [],
|
||||||
|
currentTaskId: null,
|
||||||
|
|
||||||
|
addPendingTask: (taskId: string,platform: string) =>
|
||||||
|
set((state) => ({
|
||||||
|
tasks: [
|
||||||
|
{
|
||||||
|
id: taskId,
|
||||||
|
status: "PENDING",
|
||||||
|
markdown: "",
|
||||||
|
platform:platform,
|
||||||
|
transcript: {
|
||||||
|
full_text: "",
|
||||||
|
language: "",
|
||||||
|
raw: null,
|
||||||
|
segments: [],
|
||||||
|
},
|
||||||
|
createdAt: new Date().toISOString(),
|
||||||
|
audioMeta: {
|
||||||
|
cover_url: "",
|
||||||
|
duration: 0,
|
||||||
|
file_path: "",
|
||||||
|
platform: '',
|
||||||
|
raw_info: null,
|
||||||
|
title: "",
|
||||||
|
video_id: "",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
...state.tasks,
|
||||||
|
],
|
||||||
|
currentTaskId: taskId, // 默认设置为当前任务
|
||||||
|
})),
|
||||||
|
|
||||||
|
updateTaskContent: (id, data) =>
|
||||||
|
set((state) => ({
|
||||||
|
tasks: state.tasks.map((task) =>
|
||||||
|
task.id === id ? { ...task, ...data } : task
|
||||||
|
),
|
||||||
|
})),
|
||||||
|
getCurrentTask: () => {
|
||||||
|
const currentTaskId = get().currentTaskId
|
||||||
|
return get().tasks.find((task) => task.id === currentTaskId) || null
|
||||||
|
},
|
||||||
|
removeTask: async (id) => {
|
||||||
|
const task = get().tasks.find((t) => t.id === id)
|
||||||
|
|
||||||
|
// 更新 Zustand 状态
|
||||||
|
set((state) => ({
|
||||||
|
tasks: state.tasks.filter((task) => task.id !== id),
|
||||||
|
currentTaskId: state.currentTaskId === id ? null : state.currentTaskId,
|
||||||
|
}))
|
||||||
|
|
||||||
|
// 调用后端删除接口(如果找到了任务)
|
||||||
|
if (task) {
|
||||||
|
await delete_task({
|
||||||
|
video_id: task.audioMeta.video_id,
|
||||||
|
platform: task.platform,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
clearTasks: () => set({ tasks: [], currentTaskId: null }),
|
||||||
|
|
||||||
|
setCurrentTask: (taskId) => set({ currentTaskId: taskId }),
|
||||||
|
}),
|
||||||
|
{
|
||||||
|
name: 'task-storage',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
)
|
||||||
@@ -0,0 +1,8 @@
|
|||||||
|
import axios from "axios"
|
||||||
|
|
||||||
|
const request = axios.create({
|
||||||
|
baseURL: "/api", // 默认请求路径前缀
|
||||||
|
timeout: 10000,
|
||||||
|
})
|
||||||
|
|
||||||
|
export default request
|
||||||
Vendored
+1
@@ -0,0 +1 @@
|
|||||||
|
/// <reference types="vite/client" />
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
/** @type {import('tailwindcss').Config} */
|
||||||
|
module.exports = {
|
||||||
|
content: [
|
||||||
|
'./index.html',
|
||||||
|
'./src/**/*.{vue,js,ts,js,jsx,tsx}'
|
||||||
|
],
|
||||||
|
theme: {
|
||||||
|
extend: {},
|
||||||
|
},
|
||||||
|
plugins: [],
|
||||||
|
};
|
||||||
@@ -0,0 +1,33 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
|
||||||
|
"target": "ES2020",
|
||||||
|
"useDefineForClassFields": true,
|
||||||
|
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||||
|
"module": "ESNext",
|
||||||
|
"skipLibCheck": true,
|
||||||
|
|
||||||
|
/* Bundler mode */
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"allowImportingTsExtensions": true,
|
||||||
|
"isolatedModules": true,
|
||||||
|
"moduleDetection": "force",
|
||||||
|
"noEmit": true,
|
||||||
|
"jsx": "react-jsx",
|
||||||
|
|
||||||
|
/* Linting */
|
||||||
|
"strict": true,
|
||||||
|
"noUnusedLocals": true,
|
||||||
|
"noUnusedParameters": true,
|
||||||
|
"noFallthroughCasesInSwitch": true,
|
||||||
|
"noUncheckedSideEffectImports": true,
|
||||||
|
|
||||||
|
"baseUrl": ".",
|
||||||
|
"paths": {
|
||||||
|
"@/*": [
|
||||||
|
"./src/*"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"include": ["src"]
|
||||||
|
}
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
{
|
||||||
|
"files": [],
|
||||||
|
"references": [
|
||||||
|
{ "path": "./tsconfig.app.json" },
|
||||||
|
{ "path": "./tsconfig.node.json" }
|
||||||
|
],
|
||||||
|
"compilerOptions": {
|
||||||
|
"baseUrl": ".",
|
||||||
|
"paths": {
|
||||||
|
"@/*": ["./src/*"]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
|
||||||
|
"target": "ES2022",
|
||||||
|
"lib": ["ES2023"],
|
||||||
|
"module": "ESNext",
|
||||||
|
"skipLibCheck": true,
|
||||||
|
|
||||||
|
/* Bundler mode */
|
||||||
|
"moduleResolution": "bundler",
|
||||||
|
"allowImportingTsExtensions": true,
|
||||||
|
"isolatedModules": true,
|
||||||
|
"moduleDetection": "force",
|
||||||
|
"noEmit": true,
|
||||||
|
|
||||||
|
/* Linting */
|
||||||
|
"strict": true,
|
||||||
|
"noUnusedLocals": true,
|
||||||
|
"noUnusedParameters": true,
|
||||||
|
"noFallthroughCasesInSwitch": true,
|
||||||
|
"noUncheckedSideEffectImports": true
|
||||||
|
},
|
||||||
|
"include": ["vite.config.ts"]
|
||||||
|
}
|
||||||
@@ -0,0 +1,31 @@
|
|||||||
|
import { defineConfig, loadEnv } from 'vite'
|
||||||
|
import react from '@vitejs/plugin-react'
|
||||||
|
import path from "path"
|
||||||
|
import tailwindcss from "@tailwindcss/vite"
|
||||||
|
|
||||||
|
// https://vitejs.dev/config/
|
||||||
|
export default defineConfig(({ mode }) => {
|
||||||
|
const env = loadEnv(mode, process.cwd() + '/../')
|
||||||
|
|
||||||
|
const apiBaseUrl = env.VITE_API_BASE_URL
|
||||||
|
|
||||||
|
return {
|
||||||
|
plugins: [react(), tailwindcss()],
|
||||||
|
resolve: {
|
||||||
|
alias: {
|
||||||
|
"@": path.resolve(__dirname, "./src"),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
server: {
|
||||||
|
host: '0.0.0.0',
|
||||||
|
port: 5173,
|
||||||
|
proxy: {
|
||||||
|
'/api': {
|
||||||
|
target: apiBaseUrl,
|
||||||
|
changeOrigin: true,
|
||||||
|
rewrite: path => path.replace(/^\/api/, '/api'),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
})
|
||||||
@@ -0,0 +1,149 @@
|
|||||||
|
<div style="display: flex; justify-content: center; align-items: center; gap: 10px;
|
||||||
|
">
|
||||||
|
<p align="center">
|
||||||
|
<img src="./doc/icon.svg" alt="BiliNote Banner" width="50" height="50" />
|
||||||
|
</p>
|
||||||
|
<h1 align="center" > BiliNote</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p align="center"><i>AI 视频笔记生成工具 让 AI 为你的视频做笔记</i></p>
|
||||||
|
|
||||||
|
<p align="center">
|
||||||
|
<img src="https://img.shields.io/badge/license-MIT-blue.svg" />
|
||||||
|
<img src="https://img.shields.io/badge/frontend-react-blue" />
|
||||||
|
<img src="https://img.shields.io/badge/backend-fastapi-green" />
|
||||||
|
<img src="https://img.shields.io/badge/GPT-openai%20%7C%20deepseek%20%7C%20qwen-ff69b4" />
|
||||||
|
<img src="https://img.shields.io/badge/docker-compose-blue" />
|
||||||
|
<img src="https://img.shields.io/badge/status-active-success" />
|
||||||
|
<img src="https://img.shields.io/github/stars/jefferyhcool/BiliNote?style=social" />
|
||||||
|
</p>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## ✨ 项目简介
|
||||||
|
|
||||||
|
BiliNote 是一个开源的 AI 视频笔记助手,支持通过哔哩哔哩、YouTube 等视频链接,自动提取内容并生成结构清晰、重点明确的 Markdown 格式笔记。支持插入截图、原片跳转等功能。
|
||||||
|
|
||||||
|
## 🔧 功能特性
|
||||||
|
|
||||||
|
- 支持多平台:Bilibili、YouTube(后续会加入更多平台)
|
||||||
|
- 本地模型音频转写(支持 Fast-Whisper)
|
||||||
|
- GPT 大模型总结视频内容(支持 OpenAI、DeepSeek、Qwen)
|
||||||
|
- 自动生成结构化 Markdown 笔记
|
||||||
|
- 可选插入截图(自动截取)
|
||||||
|
- 可选内容跳转链接(关联原视频)
|
||||||
|
- 任务记录与历史回看
|
||||||
|
|
||||||
|
## 📸 截图预览
|
||||||
|

|
||||||
|

|
||||||
|

|
||||||
|
|
||||||
|
## 🚀 快速开始
|
||||||
|
|
||||||
|
### 1. 克隆仓库
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git clone https://github.com/JefferyHcool/BiliNote.git
|
||||||
|
cd BiliNote
|
||||||
|
mv .env.example .env
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. 启动后端(FastAPI)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cd backend
|
||||||
|
pip install -r requirements.txt
|
||||||
|
uvicorn app.main:app --reload
|
||||||
|
```
|
||||||
|
|
||||||
|
### 3. 启动前端(Vite + React)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
cd BiliNote_frontend
|
||||||
|
pnpm install
|
||||||
|
pnpm dev
|
||||||
|
```
|
||||||
|
|
||||||
|
访问:`http://localhost:5173`
|
||||||
|
|
||||||
|
## ⚙️ 依赖说明
|
||||||
|
### 🎬 FFmpeg
|
||||||
|
本项目依赖 ffmpeg 用于音频处理与转码,必须安装:
|
||||||
|
```bash
|
||||||
|
# Mac (brew)
|
||||||
|
brew install ffmpeg
|
||||||
|
|
||||||
|
# Ubuntu / Debian
|
||||||
|
sudo apt install ffmpeg
|
||||||
|
|
||||||
|
# Windows
|
||||||
|
# 请从官网下载安装:https://ffmpeg.org/download.html
|
||||||
|
```
|
||||||
|
> ⚠️ 若系统无法识别 ffmpeg,请将其加入系统环境变量 PATH
|
||||||
|
|
||||||
|
### 🚀 CUDA 加速(可选)
|
||||||
|
若你希望更快地执行音频转写任务,可使用具备 NVIDIA GPU 的机器,并启用 fast-whisper + CUDA 加速版本:
|
||||||
|
|
||||||
|
具体 `fast-whisper` 配置方法,请参考:[fast-whisper 项目地址](http://github.com/SYSTRAN/faster-whisper#requirements)
|
||||||
|
|
||||||
|
### 🐳 使用 Docker 一键部署
|
||||||
|
|
||||||
|
确保你已安装 Docker 和 Docker Compose:
|
||||||
|
|
||||||
|
#### 1. 克隆本项目
|
||||||
|
```bash
|
||||||
|
git clone https://github.com/JefferyHcool/BiliNote.git
|
||||||
|
cd BiliNote
|
||||||
|
mv .env.example .env
|
||||||
|
```
|
||||||
|
#### 2. 启动 Docker Compose
|
||||||
|
``` bash
|
||||||
|
docker compose up --build
|
||||||
|
```
|
||||||
|
默认端口:
|
||||||
|
|
||||||
|
前端:http://localhost:${FRONTEND_PORT}
|
||||||
|
|
||||||
|
后端:http://localhost:${BACKEND_PORT}
|
||||||
|
|
||||||
|
.env 文件中可自定义端口与环境配置。
|
||||||
|
|
||||||
|
|
||||||
|
## ⚙️ 环境变量配置
|
||||||
|
|
||||||
|
后端 `.env` 示例:
|
||||||
|
|
||||||
|
```ini
|
||||||
|
API_BASE_URL=http://localhost:8000
|
||||||
|
OUT_DIR=note_results
|
||||||
|
IMAGE_BASE_URL=/static/screenshots
|
||||||
|
MODEl_PROVIDER=openai
|
||||||
|
OPENAI_API_KEY=sk-xxxxxx
|
||||||
|
DEEP_SEEK_API_KEY=xxx
|
||||||
|
QWEN_API_KEY=xxx
|
||||||
|
```
|
||||||
|
|
||||||
|
## 🧠 TODO
|
||||||
|
|
||||||
|
- [ ] 支持抖音及快手等视频平台
|
||||||
|
- [ ] 支持前端设置切换 AI 模型切换、语音转文字模型
|
||||||
|
- [ ] AI 摘要风格自定义(学术风、口语风、重点提取等)
|
||||||
|
- [ ] 笔记导出为 PDF / Word / Notion
|
||||||
|
- [ ] 加入更多模型支持
|
||||||
|
- [ ] 加入更多音频转文本模型支持
|
||||||
|
|
||||||
|
### Contact and Join-联系和加入社区
|
||||||
|
- BiliNote 交流QQ群:785367111
|
||||||
|
- BiliNote 交流微信群:
|
||||||
|
|
||||||
|
<img src="./doc/wechat.png" alt="wechat" style="zoom:33%;" />
|
||||||
|
|
||||||
|
## 📜 License
|
||||||
|
|
||||||
|
MIT License
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
💬 你的支持与反馈是我持续优化的动力!欢迎 PR、提 issue、Star ⭐️
|
||||||
|
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
|
||||||
|
# 通用
|
||||||
|
ENV=production
|
||||||
|
API_BASE_URL=http://127.0.0.1:8000
|
||||||
|
SCREENSHOT_BASE_URL=http://127.0.0.1:8000/static/screenshots
|
||||||
|
STATIC=/static # 外部访问路径(URL 前缀)
|
||||||
|
OUT_DIR=./static/screenshots # 本地输出目录
|
||||||
|
IMAGE_BASE_URL=/static/screenshots # 图片访问 URL
|
||||||
|
DATA_DIR=data
|
||||||
|
|
||||||
|
# 后端专用
|
||||||
|
|
||||||
|
# AI 相关配置
|
||||||
|
OPENAI_API_KEY = ""
|
||||||
|
OPENAI_API_BASE_URL = ""
|
||||||
|
OPENAI_MODEL = ""
|
||||||
|
DEEP_SEEK_API_KEY = ""
|
||||||
|
DEEP_SEEK_API_BASE_URL = ""
|
||||||
|
DEEP_SEEK_MODEL = ""
|
||||||
|
QWEN_API_KEY = ""
|
||||||
|
QWEN_API_BASE_URL = ""
|
||||||
|
QWEN_MODEL = ""
|
||||||
|
|
||||||
@@ -0,0 +1,20 @@
|
|||||||
|
FROM python:3.11-slim
|
||||||
|
|
||||||
|
|
||||||
|
RUN rm -f /etc/apt/sources.list && \
|
||||||
|
rm -rf /etc/apt/sources.list.d/* && \
|
||||||
|
echo "deb https://mirrors.tuna.tsinghua.edu.cn/debian bookworm main contrib non-free non-free-firmware" > /etc/apt/sources.list && \
|
||||||
|
echo "deb https://mirrors.tuna.tsinghua.edu.cn/debian bookworm-updates main contrib non-free non-free-firmware" >> /etc/apt/sources.list && \
|
||||||
|
echo "deb https://mirrors.tuna.tsinghua.edu.cn/debian-security bookworm-security main contrib non-free non-free-firmware" >> /etc/apt/sources.list && \
|
||||||
|
apt-get update && \
|
||||||
|
apt-get install -y ffmpeg && \
|
||||||
|
rm -rf /var/lib/apt/lists/*
|
||||||
|
|
||||||
|
# 确保 PATH 中包含 ffmpeg 路径(可选)
|
||||||
|
ENV PATH="/usr/bin:${PATH}"
|
||||||
|
|
||||||
|
WORKDIR /app
|
||||||
|
COPY ./backend /app
|
||||||
|
RUN pip install --no-cache-dir -i https://pypi.tuna.tsinghua.edu.cn/simple -r requirements.txt
|
||||||
|
|
||||||
|
CMD ["python", "main.py"]
|
||||||
@@ -0,0 +1,8 @@
|
|||||||
|
from fastapi import FastAPI
|
||||||
|
from .routers import note
|
||||||
|
|
||||||
|
|
||||||
|
def create_app() -> FastAPI:
|
||||||
|
app = FastAPI(title="BiliNote")
|
||||||
|
app.include_router(note.router, prefix="/api")
|
||||||
|
return app
|
||||||
@@ -0,0 +1,4 @@
|
|||||||
|
import sqlite3
|
||||||
|
|
||||||
|
def get_connection():
|
||||||
|
return sqlite3.connect("note_tasks.db")
|
||||||
@@ -0,0 +1,52 @@
|
|||||||
|
from .sqlite_client import get_connection
|
||||||
|
|
||||||
|
def init_video_task_table():
|
||||||
|
conn = get_connection()
|
||||||
|
cursor = conn.cursor()
|
||||||
|
cursor.execute("""
|
||||||
|
CREATE TABLE IF NOT EXISTS video_tasks (
|
||||||
|
id INTEGER PRIMARY KEY AUTOINCREMENT,
|
||||||
|
video_id TEXT NOT NULL,
|
||||||
|
platform TEXT NOT NULL,
|
||||||
|
task_id TEXT NOT NULL UNIQUE,
|
||||||
|
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
|
||||||
|
)
|
||||||
|
""")
|
||||||
|
conn.commit()
|
||||||
|
conn.close()
|
||||||
|
|
||||||
|
def insert_video_task(video_id: str, platform: str, task_id: str):
|
||||||
|
conn = get_connection()
|
||||||
|
cursor = conn.cursor()
|
||||||
|
cursor.execute("""
|
||||||
|
INSERT INTO video_tasks (video_id, platform, task_id)
|
||||||
|
VALUES (?, ?, ?)
|
||||||
|
""", (video_id, platform, task_id))
|
||||||
|
conn.commit()
|
||||||
|
conn.close()
|
||||||
|
|
||||||
|
|
||||||
|
def get_task_by_video(video_id: str, platform: str):
|
||||||
|
conn = get_connection()
|
||||||
|
cursor = conn.cursor()
|
||||||
|
cursor.execute("""
|
||||||
|
SELECT task_id FROM video_tasks
|
||||||
|
WHERE video_id = ? AND platform = ?
|
||||||
|
ORDER BY created_at DESC
|
||||||
|
LIMIT 1
|
||||||
|
""", (video_id, platform))
|
||||||
|
result = cursor.fetchone()
|
||||||
|
conn.close()
|
||||||
|
return result[0] if result else None
|
||||||
|
|
||||||
|
|
||||||
|
def delete_task_by_video(video_id: str, platform: str):
|
||||||
|
conn = get_connection()
|
||||||
|
cursor = conn.cursor()
|
||||||
|
cursor.execute("""
|
||||||
|
DELETE FROM video_tasks
|
||||||
|
WHERE video_id = ? AND platform = ?
|
||||||
|
""", (video_id, platform))
|
||||||
|
|
||||||
|
conn.commit()
|
||||||
|
conn.close()
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
import time
|
||||||
|
import functools
|
||||||
|
|
||||||
|
def timeit(func):
|
||||||
|
@functools.wraps(func)
|
||||||
|
def wrapper(*args, **kwargs):
|
||||||
|
start = time.perf_counter()
|
||||||
|
result = func(*args, **kwargs)
|
||||||
|
end = time.perf_counter()
|
||||||
|
duration = end - start
|
||||||
|
print(f"⏱️ {func.__name__} executed in {duration:.4f} seconds")
|
||||||
|
return result
|
||||||
|
return wrapper
|
||||||
@@ -0,0 +1,38 @@
|
|||||||
|
import enum
|
||||||
|
|
||||||
|
from abc import ABC, abstractmethod
|
||||||
|
from typing import Optional, Union
|
||||||
|
|
||||||
|
from app.enmus.note_enums import DownloadQuality
|
||||||
|
from app.models.notes_model import AudioDownloadResult
|
||||||
|
from os import getenv
|
||||||
|
QUALITY_MAP = {
|
||||||
|
"fast": "32",
|
||||||
|
"medium": "64",
|
||||||
|
"slow": "128"
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
class Downloader(ABC):
|
||||||
|
def __init__(self):
|
||||||
|
#TODO 需要修改为可配置
|
||||||
|
self.quality = QUALITY_MAP.get('fast')
|
||||||
|
self.cache_data=getenv('DATA_DIR')
|
||||||
|
|
||||||
|
@abstractmethod
|
||||||
|
def download(self, video_url: str, output_dir: str = None,
|
||||||
|
quality: DownloadQuality = "fast", need_video: Optional[bool] = False) -> AudioDownloadResult:
|
||||||
|
'''
|
||||||
|
|
||||||
|
:param need_video:
|
||||||
|
:param video_url: 资源链接
|
||||||
|
:param output_dir: 输出路径 默认根目录data
|
||||||
|
:param quality: 音频质量 fast | medium | slow
|
||||||
|
:return:返回一个 AudioDownloadResult 类
|
||||||
|
'''
|
||||||
|
pass
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def download_video(self, video_url: str,
|
||||||
|
output_dir: Union[str, None] = None) -> str:
|
||||||
|
pass
|
||||||
@@ -0,0 +1,104 @@
|
|||||||
|
import os
|
||||||
|
from abc import ABC
|
||||||
|
from typing import Union, Optional
|
||||||
|
|
||||||
|
import yt_dlp
|
||||||
|
|
||||||
|
from app.downloaders.base import Downloader, DownloadQuality, QUALITY_MAP
|
||||||
|
from app.models.notes_model import AudioDownloadResult
|
||||||
|
from app.utils.path_helper import get_data_dir
|
||||||
|
|
||||||
|
|
||||||
|
class BilibiliDownloader(Downloader, ABC):
|
||||||
|
def __init__(self):
|
||||||
|
super().__init__()
|
||||||
|
|
||||||
|
def download(
|
||||||
|
self,
|
||||||
|
video_url: str,
|
||||||
|
output_dir: Union[str, None] = None,
|
||||||
|
quality: DownloadQuality = "fast",
|
||||||
|
need_video:Optional[bool]=False
|
||||||
|
) -> AudioDownloadResult:
|
||||||
|
if output_dir is None:
|
||||||
|
output_dir = get_data_dir()
|
||||||
|
if not output_dir:
|
||||||
|
output_dir=self.cache_data
|
||||||
|
os.makedirs(output_dir, exist_ok=True)
|
||||||
|
|
||||||
|
output_path = os.path.join(output_dir, "%(id)s.%(ext)s")
|
||||||
|
|
||||||
|
ydl_opts = {
|
||||||
|
'format': 'bestaudio[ext=m4a]/bestaudio/best',
|
||||||
|
'outtmpl': output_path,
|
||||||
|
'postprocessors': [
|
||||||
|
{
|
||||||
|
'key': 'FFmpegExtractAudio',
|
||||||
|
'preferredcodec': 'mp3',
|
||||||
|
'preferredquality': '64',
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'noplaylist': True,
|
||||||
|
'quiet': False,
|
||||||
|
}
|
||||||
|
|
||||||
|
with yt_dlp.YoutubeDL(ydl_opts) as ydl:
|
||||||
|
info = ydl.extract_info(video_url, download=True)
|
||||||
|
video_id = info.get("id")
|
||||||
|
title = info.get("title")
|
||||||
|
duration = info.get("duration", 0)
|
||||||
|
cover_url = info.get("thumbnail")
|
||||||
|
audio_path = os.path.join(output_dir, f"{video_id}.mp3")
|
||||||
|
|
||||||
|
return AudioDownloadResult(
|
||||||
|
file_path=audio_path,
|
||||||
|
title=title,
|
||||||
|
duration=duration,
|
||||||
|
cover_url=cover_url,
|
||||||
|
platform="bilibili",
|
||||||
|
video_id=video_id,
|
||||||
|
raw_info=info,
|
||||||
|
video_path=None # ❗音频下载不包含视频路径
|
||||||
|
)
|
||||||
|
|
||||||
|
def download_video(
|
||||||
|
self,
|
||||||
|
video_url: str,
|
||||||
|
output_dir: Union[str, None] = None,
|
||||||
|
) -> str:
|
||||||
|
"""
|
||||||
|
下载视频,返回视频文件路径
|
||||||
|
"""
|
||||||
|
if output_dir is None:
|
||||||
|
output_dir = get_data_dir()
|
||||||
|
|
||||||
|
os.makedirs(output_dir, exist_ok=True)
|
||||||
|
output_path = os.path.join(output_dir, "%(id)s.%(ext)s")
|
||||||
|
|
||||||
|
ydl_opts = {
|
||||||
|
'format': 'bv*[ext=mp4]/bestvideo+bestaudio/best',
|
||||||
|
'outtmpl': output_path,
|
||||||
|
'noplaylist': True,
|
||||||
|
'quiet': False,
|
||||||
|
'merge_output_format': 'mp4', # 确保合并成 mp4
|
||||||
|
}
|
||||||
|
|
||||||
|
with yt_dlp.YoutubeDL(ydl_opts) as ydl:
|
||||||
|
info = ydl.extract_info(video_url, download=True)
|
||||||
|
video_id = info.get("id")
|
||||||
|
video_path = os.path.join(output_dir, f"{video_id}.mp4")
|
||||||
|
|
||||||
|
if not os.path.exists(video_path):
|
||||||
|
raise FileNotFoundError(f"视频文件未找到: {video_path}")
|
||||||
|
|
||||||
|
return video_path
|
||||||
|
|
||||||
|
def delete_video(self, video_path: str) -> str:
|
||||||
|
"""
|
||||||
|
删除视频文件
|
||||||
|
"""
|
||||||
|
if os.path.exists(video_path):
|
||||||
|
os.remove(video_path)
|
||||||
|
return f"视频文件已删除: {video_path}"
|
||||||
|
else:
|
||||||
|
return f"视频文件未找到: {video_path}"
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
# def download():
|
||||||
@@ -0,0 +1,90 @@
|
|||||||
|
import os
|
||||||
|
from abc import ABC
|
||||||
|
from typing import Union, Optional
|
||||||
|
|
||||||
|
import yt_dlp
|
||||||
|
|
||||||
|
from app.downloaders.base import Downloader, DownloadQuality
|
||||||
|
from app.models.notes_model import AudioDownloadResult
|
||||||
|
from app.utils.path_helper import get_data_dir
|
||||||
|
|
||||||
|
|
||||||
|
class DouyinDownloader(Downloader, ABC):
|
||||||
|
def download(
|
||||||
|
self,
|
||||||
|
video_url: str,
|
||||||
|
output_dir: Union[str, None] = None,
|
||||||
|
quality: DownloadQuality = "fast",
|
||||||
|
need_video:Optional[bool]=False
|
||||||
|
) -> AudioDownloadResult:
|
||||||
|
if output_dir is None:
|
||||||
|
output_dir = get_data_dir()
|
||||||
|
|
||||||
|
os.makedirs(output_dir, exist_ok=True)
|
||||||
|
|
||||||
|
output_path = os.path.join(output_dir, "%(id)s.%(ext)s")
|
||||||
|
|
||||||
|
ydl_opts = {
|
||||||
|
'format': 'bestaudio[ext=m4a]/bestaudio/best',
|
||||||
|
'outtmpl': output_path,
|
||||||
|
'postprocessors': [
|
||||||
|
{
|
||||||
|
'key': 'FFmpegExtractAudio',
|
||||||
|
'preferredcodec': 'mp3',
|
||||||
|
'preferredquality': '64',
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'noplaylist': True,
|
||||||
|
'quiet': False,
|
||||||
|
}
|
||||||
|
|
||||||
|
with yt_dlp.YoutubeDL(ydl_opts) as ydl:
|
||||||
|
info = ydl.extract_info(video_url, download=True)
|
||||||
|
video_id = info.get("id")
|
||||||
|
title = info.get("title")
|
||||||
|
duration = info.get("duration", 0)
|
||||||
|
cover_url = info.get("thumbnail")
|
||||||
|
audio_path = os.path.join(output_dir, f"{video_id}.mp3")
|
||||||
|
|
||||||
|
return AudioDownloadResult(
|
||||||
|
file_path=audio_path,
|
||||||
|
title=title,
|
||||||
|
duration=duration,
|
||||||
|
cover_url=cover_url,
|
||||||
|
platform="douyin",
|
||||||
|
video_id=video_id,
|
||||||
|
raw_info={'tags':info.get('tags')}, #全部返回会报错
|
||||||
|
video_path=None # ❗音频下载不包含视频路径
|
||||||
|
)
|
||||||
|
|
||||||
|
def download_video(
|
||||||
|
self,
|
||||||
|
video_url: str,
|
||||||
|
output_dir: Union[str, None] = None,
|
||||||
|
) -> str:
|
||||||
|
"""
|
||||||
|
下载视频,返回视频文件路径
|
||||||
|
"""
|
||||||
|
if output_dir is None:
|
||||||
|
output_dir = get_data_dir()
|
||||||
|
|
||||||
|
os.makedirs(output_dir, exist_ok=True)
|
||||||
|
output_path = os.path.join(output_dir, "%(id)s.%(ext)s")
|
||||||
|
|
||||||
|
ydl_opts = {
|
||||||
|
'format': 'worst[ext=mp4]/worst',
|
||||||
|
'outtmpl': output_path,
|
||||||
|
'noplaylist': True,
|
||||||
|
'quiet': False,
|
||||||
|
'merge_output_format': 'mp4', # 确保合并成 mp4
|
||||||
|
}
|
||||||
|
|
||||||
|
with yt_dlp.YoutubeDL(ydl_opts) as ydl:
|
||||||
|
info = ydl.extract_info(video_url, download=True)
|
||||||
|
video_id = info.get("id")
|
||||||
|
video_path = os.path.join(output_dir, f"{video_id}.mp4")
|
||||||
|
|
||||||
|
if not os.path.exists(video_path):
|
||||||
|
raise FileNotFoundError(f"视频文件未找到: {video_path}")
|
||||||
|
|
||||||
|
return video_path
|
||||||
@@ -0,0 +1,95 @@
|
|||||||
|
import os
|
||||||
|
from abc import ABC
|
||||||
|
from typing import Union, Optional
|
||||||
|
|
||||||
|
import yt_dlp
|
||||||
|
|
||||||
|
from app.downloaders.base import Downloader, DownloadQuality
|
||||||
|
from app.models.notes_model import AudioDownloadResult
|
||||||
|
from app.utils.path_helper import get_data_dir
|
||||||
|
|
||||||
|
|
||||||
|
class YoutubeDownloader(Downloader, ABC):
|
||||||
|
def __init__(self):
|
||||||
|
|
||||||
|
super().__init__()
|
||||||
|
|
||||||
|
def download(
|
||||||
|
self,
|
||||||
|
video_url: str,
|
||||||
|
output_dir: Union[str, None] = None,
|
||||||
|
quality: DownloadQuality = "fast",
|
||||||
|
need_video:Optional[bool]=False
|
||||||
|
) -> AudioDownloadResult:
|
||||||
|
if output_dir is None:
|
||||||
|
output_dir = get_data_dir()
|
||||||
|
if not output_dir:
|
||||||
|
output_dir=self.cache_data
|
||||||
|
os.makedirs(output_dir, exist_ok=True)
|
||||||
|
|
||||||
|
output_path = os.path.join(output_dir, "%(id)s.%(ext)s")
|
||||||
|
|
||||||
|
ydl_opts = {
|
||||||
|
'format': 'bestaudio[ext=m4a]/bestaudio/best',
|
||||||
|
'outtmpl': output_path,
|
||||||
|
'postprocessors': [
|
||||||
|
{
|
||||||
|
'key': 'FFmpegExtractAudio',
|
||||||
|
'preferredcodec': 'mp3',
|
||||||
|
'preferredquality': '64',
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'noplaylist': True,
|
||||||
|
'quiet': False,
|
||||||
|
}
|
||||||
|
|
||||||
|
with yt_dlp.YoutubeDL(ydl_opts) as ydl:
|
||||||
|
info = ydl.extract_info(video_url, download=True)
|
||||||
|
video_id = info.get("id")
|
||||||
|
title = info.get("title")
|
||||||
|
duration = info.get("duration", 0)
|
||||||
|
cover_url = info.get("thumbnail")
|
||||||
|
audio_path = os.path.join(output_dir, f"{video_id}.mp3")
|
||||||
|
|
||||||
|
return AudioDownloadResult(
|
||||||
|
file_path=audio_path,
|
||||||
|
title=title,
|
||||||
|
duration=duration,
|
||||||
|
cover_url=cover_url,
|
||||||
|
platform="youtube",
|
||||||
|
video_id=video_id,
|
||||||
|
raw_info={'tags':info.get('tags')}, #全部返回会报错
|
||||||
|
video_path=None # ❗音频下载不包含视频路径
|
||||||
|
)
|
||||||
|
|
||||||
|
def download_video(
|
||||||
|
self,
|
||||||
|
video_url: str,
|
||||||
|
output_dir: Union[str, None] = None,
|
||||||
|
) -> str:
|
||||||
|
"""
|
||||||
|
下载视频,返回视频文件路径
|
||||||
|
"""
|
||||||
|
if output_dir is None:
|
||||||
|
output_dir = get_data_dir()
|
||||||
|
|
||||||
|
os.makedirs(output_dir, exist_ok=True)
|
||||||
|
output_path = os.path.join(output_dir, "%(id)s.%(ext)s")
|
||||||
|
|
||||||
|
ydl_opts = {
|
||||||
|
'format': 'worst[ext=mp4]/worst',
|
||||||
|
'outtmpl': output_path,
|
||||||
|
'noplaylist': True,
|
||||||
|
'quiet': False,
|
||||||
|
'merge_output_format': 'mp4', # 确保合并成 mp4
|
||||||
|
}
|
||||||
|
|
||||||
|
with yt_dlp.YoutubeDL(ydl_opts) as ydl:
|
||||||
|
info = ydl.extract_info(video_url, download=True)
|
||||||
|
video_id = info.get("id")
|
||||||
|
video_path = os.path.join(output_dir, f"{video_id}.mp4")
|
||||||
|
|
||||||
|
if not os.path.exists(video_path):
|
||||||
|
raise FileNotFoundError(f"视频文件未找到: {video_path}")
|
||||||
|
|
||||||
|
return video_path
|
||||||
@@ -0,0 +1,7 @@
|
|||||||
|
import enum
|
||||||
|
|
||||||
|
|
||||||
|
class DownloadQuality(str, enum.Enum):
|
||||||
|
fast = "fast"
|
||||||
|
medium = "medium"
|
||||||
|
slow = "slow"
|
||||||
@@ -0,0 +1,13 @@
|
|||||||
|
from abc import ABC,abstractmethod
|
||||||
|
|
||||||
|
from app.models.gpt_model import GPTSource
|
||||||
|
|
||||||
|
|
||||||
|
class GPT(ABC):
|
||||||
|
def summarize(self, source:GPTSource )->str:
|
||||||
|
'''
|
||||||
|
|
||||||
|
:param source:
|
||||||
|
:return:
|
||||||
|
'''
|
||||||
|
pass
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
from typing import List
|
||||||
|
from app.gpt.base import GPT
|
||||||
|
from openai import OpenAI
|
||||||
|
from app.gpt.prompt import BASE_PROMPT, AI_SUM, SCREENSHOT
|
||||||
|
from app.gpt.utils import fix_markdown
|
||||||
|
from app.models.gpt_model import GPTSource
|
||||||
|
from app.models.transcriber_model import TranscriptSegment
|
||||||
|
from datetime import timedelta
|
||||||
|
|
||||||
|
|
||||||
|
class DeepSeekGPT(GPT):
|
||||||
|
def __init__(self):
|
||||||
|
from os import getenv
|
||||||
|
self.api_key = getenv("DEEP_SEEK_API_KEY")
|
||||||
|
self.base_url = getenv("DEEP_SEEK_API_BASE_URL")
|
||||||
|
self.model=getenv('DEEP_SEEK_MODEL')
|
||||||
|
print(self.model)
|
||||||
|
self.client = OpenAI(api_key=self.api_key, base_url=self.base_url)
|
||||||
|
self.screenshot = False
|
||||||
|
|
||||||
|
def _format_time(self, seconds: float) -> str:
|
||||||
|
return str(timedelta(seconds=int(seconds)))[2:] # e.g., 03:15
|
||||||
|
|
||||||
|
def _build_segment_text(self, segments: List[TranscriptSegment]) -> str:
|
||||||
|
return "\n".join(
|
||||||
|
f"{self._format_time(seg.start)} - {seg.text.strip()}"
|
||||||
|
for seg in segments
|
||||||
|
)
|
||||||
|
|
||||||
|
def ensure_segments_type(self, segments) -> List[TranscriptSegment]:
|
||||||
|
return [
|
||||||
|
TranscriptSegment(**seg) if isinstance(seg, dict) else seg
|
||||||
|
for seg in segments
|
||||||
|
]
|
||||||
|
|
||||||
|
def create_messages(self, segments: List[TranscriptSegment], title: str,tags:str):
|
||||||
|
content = BASE_PROMPT.format(
|
||||||
|
video_title=title,
|
||||||
|
segment_text=self._build_segment_text(segments),
|
||||||
|
tags=tags
|
||||||
|
)
|
||||||
|
if self.screenshot:
|
||||||
|
print(":需要截图")
|
||||||
|
content += SCREENSHOT
|
||||||
|
print(content)
|
||||||
|
return [{"role": "user", "content": content + AI_SUM}]
|
||||||
|
|
||||||
|
def summarize(self, source: GPTSource) -> str:
|
||||||
|
self.screenshot = source.screenshot
|
||||||
|
source.segment = self.ensure_segments_type(source.segment)
|
||||||
|
messages = self.create_messages(source.segment, source.title,source.tags)
|
||||||
|
response = self.client.chat.completions.create(
|
||||||
|
model=self.model,
|
||||||
|
messages=messages,
|
||||||
|
temperature=0.7
|
||||||
|
)
|
||||||
|
return response.choices[0].message.content.strip()
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,65 @@
|
|||||||
|
from typing import List
|
||||||
|
from app.gpt.base import GPT
|
||||||
|
from openai import OpenAI
|
||||||
|
from app.gpt.prompt import BASE_PROMPT, AI_SUM, SCREENSHOT, LINK
|
||||||
|
from app.gpt.utils import fix_markdown
|
||||||
|
from app.models.gpt_model import GPTSource
|
||||||
|
from app.models.transcriber_model import TranscriptSegment
|
||||||
|
from datetime import timedelta
|
||||||
|
|
||||||
|
|
||||||
|
class OpenaiGPT(GPT):
|
||||||
|
def __init__(self):
|
||||||
|
from os import getenv
|
||||||
|
self.api_key = getenv("OPENAI_API_KEY")
|
||||||
|
self.base_url = getenv("OPENAI_API_BASE_URL")
|
||||||
|
self.model=getenv('OPENAI_MODEL')
|
||||||
|
print(self.model)
|
||||||
|
self.client = OpenAI(api_key=self.api_key, base_url=self.base_url)
|
||||||
|
self.screenshot = False
|
||||||
|
self.link=False
|
||||||
|
|
||||||
|
def _format_time(self, seconds: float) -> str:
|
||||||
|
return str(timedelta(seconds=int(seconds)))[2:] # e.g., 03:15
|
||||||
|
|
||||||
|
def _build_segment_text(self, segments: List[TranscriptSegment]) -> str:
|
||||||
|
return "\n".join(
|
||||||
|
f"{self._format_time(seg.start)} - {seg.text.strip()}"
|
||||||
|
for seg in segments
|
||||||
|
)
|
||||||
|
|
||||||
|
def ensure_segments_type(self, segments) -> List[TranscriptSegment]:
|
||||||
|
return [
|
||||||
|
TranscriptSegment(**seg) if isinstance(seg, dict) else seg
|
||||||
|
for seg in segments
|
||||||
|
]
|
||||||
|
|
||||||
|
def create_messages(self, segments: List[TranscriptSegment], title: str,tags:str):
|
||||||
|
content = BASE_PROMPT.format(
|
||||||
|
video_title=title,
|
||||||
|
segment_text=self._build_segment_text(segments),
|
||||||
|
tags=tags
|
||||||
|
)
|
||||||
|
if self.screenshot:
|
||||||
|
print(":需要截图")
|
||||||
|
content += SCREENSHOT
|
||||||
|
if self.link:
|
||||||
|
print(":需要链接")
|
||||||
|
content += LINK
|
||||||
|
|
||||||
|
print(content)
|
||||||
|
return [{"role": "user", "content": content + AI_SUM}]
|
||||||
|
|
||||||
|
def summarize(self, source: GPTSource) -> str:
|
||||||
|
self.screenshot = source.screenshot
|
||||||
|
self.link = source.link
|
||||||
|
source.segment = self.ensure_segments_type(source.segment)
|
||||||
|
messages = self.create_messages(source.segment, source.title,source.tags)
|
||||||
|
response = self.client.chat.completions.create(
|
||||||
|
model=self.model,
|
||||||
|
messages=messages,
|
||||||
|
temperature=0.7
|
||||||
|
)
|
||||||
|
return response.choices[0].message.content.strip()
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,56 @@
|
|||||||
|
BASE_PROMPT = '''
|
||||||
|
You are a professional note-taking assistant who excels at summarizing video transcripts into clear, structured, and information-rich notes.
|
||||||
|
|
||||||
|
🎯 Language Requirement:
|
||||||
|
- The notes must be written in **Chinese**.
|
||||||
|
- Proper nouns, technical terms, brand names, and personal names should remain in **English** where appropriate.
|
||||||
|
|
||||||
|
📌 Video Title:
|
||||||
|
{video_title}
|
||||||
|
|
||||||
|
📎 Video Tags:
|
||||||
|
{tags}
|
||||||
|
|
||||||
|
📝 Your Task:
|
||||||
|
Based on the segmented transcript below, generate structured notes in standard **Markdown format**, and follow these principles:
|
||||||
|
|
||||||
|
1. **Complete information**: Record as much relevant detail as possible to ensure comprehensive coverage.
|
||||||
|
2. **Clear structure**: Organize content with logical sectioning. Use appropriate heading levels (`##`, `###`) to summarize key points in each section.
|
||||||
|
3. **Concise wording**: Use accurate, clear, and professional Chinese expressions.
|
||||||
|
4. **Remove irrelevant content**: Omit advertisements, filler words, casual greetings, and off-topic remarks.
|
||||||
|
5. **Keep critical details**: Preserve important facts, examples, conclusions, and recommendations.
|
||||||
|
6. **Readable layout**: Use bullet points where needed, and keep paragraphs reasonably short to enhance readability.
|
||||||
|
7. **Table of Contents**: Generate a table of contents at the top based on the `##` level headings.
|
||||||
|
|
||||||
|
|
||||||
|
⚠️ Output Instructions:
|
||||||
|
- Only return the final **Markdown content**.
|
||||||
|
- Do **not** wrap the output in code blocks like ```` ```markdown ```` or ```` ``` ````.
|
||||||
|
|
||||||
|
|
||||||
|
🎬 Transcript Segments (Format: Start Time - Text):
|
||||||
|
|
||||||
|
---
|
||||||
|
{segment_text}
|
||||||
|
---
|
||||||
|
'''
|
||||||
|
|
||||||
|
LINK='''
|
||||||
|
9. **Add time markers**: THIS IS IMPORTANT For every main heading (`##`), append the starting time of that segment using the format ,start with *Content ,eg: `*Content-[mm:ss]`.
|
||||||
|
|
||||||
|
|
||||||
|
'''
|
||||||
|
AI_SUM='''
|
||||||
|
|
||||||
|
🧠 Final Touch:
|
||||||
|
At the end of the notes, add a professional **AI Summary** in Chinese – a brief conclusion summarizing the whole video.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
'''
|
||||||
|
|
||||||
|
SCREENSHOT='''
|
||||||
|
8. **Screenshot placeholders**: If a section involves **visual demonstrations, code walkthroughs, UI interactions**, or any content where visuals aid understanding, insert a screenshot cue at the end of that section:
|
||||||
|
- Format: `*Screenshot-[mm:ss]`
|
||||||
|
- Only use it when truly helpful.
|
||||||
|
'''
|
||||||
@@ -0,0 +1,59 @@
|
|||||||
|
from typing import List
|
||||||
|
from app.gpt.base import GPT
|
||||||
|
from openai import OpenAI
|
||||||
|
from app.gpt.prompt import BASE_PROMPT, AI_SUM, SCREENSHOT
|
||||||
|
from app.gpt.utils import fix_markdown
|
||||||
|
from app.models.gpt_model import GPTSource
|
||||||
|
from app.models.transcriber_model import TranscriptSegment
|
||||||
|
from datetime import timedelta
|
||||||
|
|
||||||
|
|
||||||
|
class QwenGPT(GPT):
|
||||||
|
def __init__(self):
|
||||||
|
from os import getenv
|
||||||
|
self.api_key = getenv("QWEN_API_KEY")
|
||||||
|
self.base_url = getenv("QWEN_API_BASE_URL")
|
||||||
|
self.model=getenv('QWEN_MODEL')
|
||||||
|
print(self.model)
|
||||||
|
self.client = OpenAI(api_key=self.api_key, base_url=self.base_url)
|
||||||
|
self.screenshot = False
|
||||||
|
|
||||||
|
def _format_time(self, seconds: float) -> str:
|
||||||
|
return str(timedelta(seconds=int(seconds)))[2:] # e.g., 03:15
|
||||||
|
|
||||||
|
def _build_segment_text(self, segments: List[TranscriptSegment]) -> str:
|
||||||
|
return "\n".join(
|
||||||
|
f"{self._format_time(seg.start)} - {seg.text.strip()}"
|
||||||
|
for seg in segments
|
||||||
|
)
|
||||||
|
|
||||||
|
def ensure_segments_type(self, segments) -> List[TranscriptSegment]:
|
||||||
|
return [
|
||||||
|
TranscriptSegment(**seg) if isinstance(seg, dict) else seg
|
||||||
|
for seg in segments
|
||||||
|
]
|
||||||
|
|
||||||
|
def create_messages(self, segments: List[TranscriptSegment], title: str,tags:str):
|
||||||
|
content = BASE_PROMPT.format(
|
||||||
|
video_title=title,
|
||||||
|
segment_text=self._build_segment_text(segments),
|
||||||
|
tags=tags
|
||||||
|
)
|
||||||
|
if self.screenshot:
|
||||||
|
print(":需要截图")
|
||||||
|
content += SCREENSHOT
|
||||||
|
print(content)
|
||||||
|
return [{"role": "user", "content": content + AI_SUM}]
|
||||||
|
|
||||||
|
def summarize(self, source: GPTSource) -> str:
|
||||||
|
self.screenshot = source.screenshot
|
||||||
|
source.segment = self.ensure_segments_type(source.segment)
|
||||||
|
messages = self.create_messages(source.segment, source.title,source.tags)
|
||||||
|
response = self.client.chat.completions.create(
|
||||||
|
model=self.model,
|
||||||
|
messages=messages,
|
||||||
|
temperature=0.7
|
||||||
|
)
|
||||||
|
return response.choices[0].message.content.strip()
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,4 @@
|
|||||||
|
import codecs
|
||||||
|
|
||||||
|
def fix_markdown(markdown: str) -> str:
|
||||||
|
return codecs.decode(markdown, 'unicode_escape')
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
from dataclasses import dataclass
|
||||||
|
from typing import Optional
|
||||||
|
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class AudioDownloadResult:
|
||||||
|
file_path: str # 本地音频路径
|
||||||
|
title: str # 视频标题
|
||||||
|
duration: float # 视频时长(秒)
|
||||||
|
cover_url: Optional[str] # 视频封面图
|
||||||
|
platform: str # 平台,如 "bilibili"
|
||||||
|
video_id: str # 唯一视频ID
|
||||||
|
raw_info: dict # yt-dlp 的原始 info 字典
|
||||||
|
video_path: Optional[str] = None # ✅ 新增字段:可选视频文件路径
|
||||||
|
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
from dataclasses import dataclass
|
||||||
|
from typing import List, Union, Optional
|
||||||
|
|
||||||
|
from app.models.transcriber_model import TranscriptSegment
|
||||||
|
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class GPTSource:
|
||||||
|
segment: Union[List[TranscriptSegment], List]
|
||||||
|
title: str
|
||||||
|
tags:str
|
||||||
|
screenshot: Optional[bool] = False
|
||||||
|
link: Optional[bool] = False
|
||||||
|
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
from dataclasses import dataclass
|
||||||
|
from typing import Optional
|
||||||
|
|
||||||
|
from app.models.audio_model import AudioDownloadResult
|
||||||
|
from app.models.transcriber_model import TranscriptResult
|
||||||
|
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class NoteResult:
|
||||||
|
markdown: str # GPT 总结的 Markdown 内容
|
||||||
|
transcript: TranscriptResult # Whisper 转写结果
|
||||||
|
audio_meta: AudioDownloadResult # 音频下载的元信息(title、duration、封面等)
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
|
||||||
|
from dataclasses import dataclass
|
||||||
|
from typing import List, Optional
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class TranscriptSegment:
|
||||||
|
start: float # 开始时间(秒)
|
||||||
|
end: float # 结束时间(秒)
|
||||||
|
text: str # 该段文字
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class TranscriptResult:
|
||||||
|
language: Optional[str] # 检测语言(如 "zh"、"en")
|
||||||
|
full_text: str # 完整合并后的文本(用于摘要)
|
||||||
|
segments: List[TranscriptSegment] # 分段结构,适合前端显示时间轴字幕等
|
||||||
|
raw: Optional[dict] = None # 原始响应数据,便于调试或平台特性处理
|
||||||
@@ -0,0 +1,139 @@
|
|||||||
|
# app/routers/note.py
|
||||||
|
import json
|
||||||
|
import os
|
||||||
|
import uuid
|
||||||
|
from typing import Optional
|
||||||
|
|
||||||
|
from fastapi import APIRouter, HTTPException, BackgroundTasks
|
||||||
|
from pydantic import BaseModel, validator
|
||||||
|
from dataclasses import asdict
|
||||||
|
|
||||||
|
from app.db.video_task_dao import get_task_by_video
|
||||||
|
from app.enmus.note_enums import DownloadQuality
|
||||||
|
from app.services.note import NoteGenerator
|
||||||
|
from app.utils.response import ResponseWrapper as R
|
||||||
|
from app.utils.url_parser import extract_video_id
|
||||||
|
from app.validators.video_url_validator import is_supported_video_url
|
||||||
|
from fastapi import APIRouter, Request, HTTPException
|
||||||
|
from fastapi.responses import StreamingResponse
|
||||||
|
import httpx
|
||||||
|
|
||||||
|
# from app.services.downloader import download_raw_audio
|
||||||
|
# from app.services.whisperer import transcribe_audio
|
||||||
|
|
||||||
|
router = APIRouter()
|
||||||
|
|
||||||
|
|
||||||
|
class RecordRequest(BaseModel):
|
||||||
|
video_id: str
|
||||||
|
platform: str
|
||||||
|
|
||||||
|
|
||||||
|
class VideoRequest(BaseModel):
|
||||||
|
video_url: str
|
||||||
|
platform: str
|
||||||
|
quality: DownloadQuality
|
||||||
|
screenshot: Optional[bool] = False
|
||||||
|
link: Optional[bool] = False
|
||||||
|
|
||||||
|
@validator("video_url")
|
||||||
|
def validate_supported_url(cls, v):
|
||||||
|
url = str(v)
|
||||||
|
# 支持平台校验
|
||||||
|
if not is_supported_video_url(url):
|
||||||
|
raise ValueError("暂不支持该视频平台或链接格式无效")
|
||||||
|
return v
|
||||||
|
|
||||||
|
|
||||||
|
NOTE_OUTPUT_DIR = "note_results"
|
||||||
|
|
||||||
|
|
||||||
|
def save_note_to_file(task_id: str, note):
|
||||||
|
os.makedirs(NOTE_OUTPUT_DIR, exist_ok=True)
|
||||||
|
with open(os.path.join(NOTE_OUTPUT_DIR, f"{task_id}.json"), "w", encoding="utf-8") as f:
|
||||||
|
json.dump(asdict(note), f, ensure_ascii=False, indent=2)
|
||||||
|
|
||||||
|
|
||||||
|
def run_note_task(task_id: str, video_url: str, platform: str, quality: DownloadQuality, link: bool = False,screenshot: bool = False):
|
||||||
|
try:
|
||||||
|
note = NoteGenerator().generate(
|
||||||
|
video_url=video_url,
|
||||||
|
platform=platform,
|
||||||
|
quality=quality,
|
||||||
|
task_id=task_id,
|
||||||
|
link=link,
|
||||||
|
screenshot=screenshot
|
||||||
|
)
|
||||||
|
print('Note 结果',note)
|
||||||
|
save_note_to_file(task_id, note)
|
||||||
|
except Exception as e:
|
||||||
|
save_note_to_file(task_id, {"error": str(e)})
|
||||||
|
|
||||||
|
|
||||||
|
@router.post('/delete_task')
|
||||||
|
def delete_task(data:RecordRequest):
|
||||||
|
try:
|
||||||
|
|
||||||
|
NoteGenerator().delete_note(video_id=data.video_id,platform=data.platform)
|
||||||
|
return R.success(msg='删除成功')
|
||||||
|
except Exception as e:
|
||||||
|
return R.error(msg=e)
|
||||||
|
|
||||||
|
|
||||||
|
@router.post("/generate_note")
|
||||||
|
def generate_note(data: VideoRequest, background_tasks: BackgroundTasks):
|
||||||
|
try:
|
||||||
|
|
||||||
|
video_id = extract_video_id(data.video_url, data.platform)
|
||||||
|
if not video_id:
|
||||||
|
raise HTTPException(status_code=400, detail="无法提取视频 ID")
|
||||||
|
existing = get_task_by_video(video_id, data.platform)
|
||||||
|
if existing:
|
||||||
|
return R.error(
|
||||||
|
msg='笔记已生成,请勿重复发起',
|
||||||
|
|
||||||
|
)
|
||||||
|
|
||||||
|
task_id = str(uuid.uuid4())
|
||||||
|
|
||||||
|
background_tasks.add_task(run_note_task, task_id, data.video_url, data.platform, data.quality,data.link ,data.screenshot)
|
||||||
|
return R.success({"task_id": task_id})
|
||||||
|
except Exception as e:
|
||||||
|
raise HTTPException(status_code=500, detail=str(e))
|
||||||
|
|
||||||
|
|
||||||
|
@router.get("/task_status/{task_id}")
|
||||||
|
def get_task_status(task_id: str):
|
||||||
|
path = os.path.join(NOTE_OUTPUT_DIR, f"{task_id}.json")
|
||||||
|
if not os.path.exists(path):
|
||||||
|
return R.success({"status": "PENDING"})
|
||||||
|
|
||||||
|
with open(path, "r", encoding="utf-8") as f:
|
||||||
|
content = json.load(f)
|
||||||
|
|
||||||
|
if "error" in content:
|
||||||
|
return R.error(content["error"], code=500)
|
||||||
|
content['id'] = task_id
|
||||||
|
return R.success({
|
||||||
|
"status": "SUCCESS",
|
||||||
|
"result": content
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
@router.get("/image_proxy")
|
||||||
|
async def image_proxy(request: Request, url: str):
|
||||||
|
headers = {
|
||||||
|
"Referer": "https://www.bilibili.com/", # 模拟B站来源
|
||||||
|
"User-Agent": request.headers.get("User-Agent", ""),
|
||||||
|
}
|
||||||
|
|
||||||
|
try:
|
||||||
|
async with httpx.AsyncClient(timeout=10.0) as client:
|
||||||
|
resp = await client.get(url, headers=headers)
|
||||||
|
if resp.status_code != 200:
|
||||||
|
raise HTTPException(status_code=resp.status_code, detail="图片获取失败")
|
||||||
|
|
||||||
|
content_type = resp.headers.get("Content-Type", "image/jpeg")
|
||||||
|
return StreamingResponse(resp.aiter_bytes(), media_type=content_type)
|
||||||
|
except Exception as e:
|
||||||
|
raise HTTPException(status_code=500, detail=str(e))
|
||||||
@@ -0,0 +1,184 @@
|
|||||||
|
import os
|
||||||
|
from typing import Union
|
||||||
|
|
||||||
|
from pydantic import HttpUrl
|
||||||
|
|
||||||
|
from app.db.video_task_dao import insert_video_task, delete_task_by_video
|
||||||
|
from app.downloaders.base import Downloader
|
||||||
|
from app.downloaders.bilibili_downloader import BilibiliDownloader
|
||||||
|
from app.downloaders.douyin_downloader import DouyinDownloader
|
||||||
|
from app.downloaders.youtube_downloader import YoutubeDownloader
|
||||||
|
from app.gpt.base import GPT
|
||||||
|
from app.gpt.deepseek_gpt import DeepSeekGPT
|
||||||
|
from app.gpt.openai_gpt import OpenaiGPT
|
||||||
|
from app.gpt.qwen_gpt import QwenGPT
|
||||||
|
from app.models.gpt_model import GPTSource
|
||||||
|
from app.models.notes_model import NoteResult
|
||||||
|
from app.models.notes_model import AudioDownloadResult
|
||||||
|
from app.enmus.note_enums import DownloadQuality
|
||||||
|
from app.models.transcriber_model import TranscriptResult
|
||||||
|
from app.transcriber.base import Transcriber
|
||||||
|
from app.transcriber.transcriber_provider import get_transcriber
|
||||||
|
from app.transcriber.whisper import WhisperTranscriber
|
||||||
|
import re
|
||||||
|
|
||||||
|
from app.utils.note_helper import replace_content_markers
|
||||||
|
from app.utils.video_helper import generate_screenshot
|
||||||
|
|
||||||
|
# from app.services.whisperer import transcribe_audio
|
||||||
|
# from app.services.gpt import summarize_text
|
||||||
|
from dotenv import load_dotenv
|
||||||
|
|
||||||
|
load_dotenv()
|
||||||
|
BACKEND_BASE_URL = os.getenv("API_BASE_URL", "http://localhost:8000")
|
||||||
|
|
||||||
|
output_dir = os.getenv('OUT_DIR')
|
||||||
|
image_base_url = os.getenv('IMAGE_BASE_URL')
|
||||||
|
print(output_dir)
|
||||||
|
|
||||||
|
|
||||||
|
class NoteGenerator:
|
||||||
|
def __init__(self):
|
||||||
|
self.model_size: str = 'base'
|
||||||
|
self.device: Union[str, None] = None
|
||||||
|
self.transcriber_type = 'fast-whisper'
|
||||||
|
self.transcriber = self.get_transcriber()
|
||||||
|
# TODO 需要更换为可调节
|
||||||
|
|
||||||
|
self.provider = os.getenv('MODEl_PROVIDER','openai')
|
||||||
|
self.video_path = None
|
||||||
|
|
||||||
|
def get_gpt(self) -> GPT:
|
||||||
|
if self.provider == 'openai':
|
||||||
|
return OpenaiGPT()
|
||||||
|
elif self.provider == 'deepSeek':
|
||||||
|
return DeepSeekGPT()
|
||||||
|
elif self.provider == 'qwen':
|
||||||
|
return QwenGPT()
|
||||||
|
else:
|
||||||
|
raise ValueError(f"不支持的AI提供商:{self.provider}")
|
||||||
|
|
||||||
|
def get_downloader(self, platform: str) -> Downloader:
|
||||||
|
if platform == "bilibili":
|
||||||
|
return BilibiliDownloader()
|
||||||
|
elif platform == "youtube":
|
||||||
|
return YoutubeDownloader()
|
||||||
|
elif platform == 'douyin':
|
||||||
|
return DouyinDownloader()
|
||||||
|
else:
|
||||||
|
raise ValueError(f"不支持的平台:{platform}")
|
||||||
|
|
||||||
|
def get_transcriber(self) -> Transcriber:
|
||||||
|
'''
|
||||||
|
|
||||||
|
:param transcriber: 选择的转义器
|
||||||
|
:return:
|
||||||
|
'''
|
||||||
|
if self.transcriber_type == 'fast-whisper':
|
||||||
|
return get_transcriber()
|
||||||
|
else:
|
||||||
|
raise ValueError(f"不支持的转义器:{self.transcriber}")
|
||||||
|
|
||||||
|
def save_meta(self, video_id, platform, task_id):
|
||||||
|
insert_video_task(video_id=video_id, platform=platform, task_id=task_id)
|
||||||
|
|
||||||
|
def insert_screenshots_into_markdown(self, markdown: str, video_path: str, image_base_url: str,
|
||||||
|
output_dir: str) -> str:
|
||||||
|
"""
|
||||||
|
扫描 markdown 中的 *Screenshot-xx:xx,生成截图并插入 markdown 图片
|
||||||
|
:param markdown:
|
||||||
|
:param image_base_url: 最终返回给前端的路径前缀(如 /static/screenshots)
|
||||||
|
"""
|
||||||
|
matches = self.extract_screenshot_timestamps(markdown)
|
||||||
|
new_markdown = markdown
|
||||||
|
|
||||||
|
for idx, (marker, ts) in enumerate(matches):
|
||||||
|
image_path = generate_screenshot(video_path, output_dir, ts, idx)
|
||||||
|
image_relative_path = os.path.join(image_base_url, os.path.basename(image_path)).replace("\\", "/")
|
||||||
|
image_url = f"{BACKEND_BASE_URL.rstrip('/')}/{image_relative_path.lstrip('/')}"
|
||||||
|
replacement = f""
|
||||||
|
new_markdown = new_markdown.replace(marker, replacement, 1)
|
||||||
|
|
||||||
|
return new_markdown
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def delete_note(video_id: str, platform: str):
|
||||||
|
return delete_task_by_video(video_id, platform)
|
||||||
|
|
||||||
|
import re
|
||||||
|
|
||||||
|
def extract_screenshot_timestamps(self, markdown: str) -> list[tuple[str, int]]:
|
||||||
|
"""
|
||||||
|
从 Markdown 中提取 Screenshot 时间标记(如 *Screenshot-03:39 或 Screenshot-[03:39]),
|
||||||
|
并返回匹配文本和对应时间戳(秒)
|
||||||
|
"""
|
||||||
|
pattern = r"(?:\*Screenshot-(\d{2}):(\d{2})|Screenshot-\[(\d{2}):(\d{2})\])"
|
||||||
|
matches = list(re.finditer(pattern, markdown))
|
||||||
|
results = []
|
||||||
|
for match in matches:
|
||||||
|
mm = match.group(1) or match.group(3)
|
||||||
|
ss = match.group(2) or match.group(4)
|
||||||
|
total_seconds = int(mm) * 60 + int(ss)
|
||||||
|
results.append((match.group(0), total_seconds))
|
||||||
|
return results
|
||||||
|
|
||||||
|
def generate(
|
||||||
|
self,
|
||||||
|
|
||||||
|
video_url: Union[str, HttpUrl],
|
||||||
|
platform: str,
|
||||||
|
quality: DownloadQuality = DownloadQuality.medium,
|
||||||
|
task_id: Union[str, None] = None,
|
||||||
|
link: bool = False,
|
||||||
|
screenshot: bool = False,
|
||||||
|
path: Union[str, None] = None
|
||||||
|
|
||||||
|
) -> NoteResult:
|
||||||
|
|
||||||
|
# 1. 选择下载器
|
||||||
|
downloader = self.get_downloader(platform)
|
||||||
|
gpt = self.get_gpt()
|
||||||
|
|
||||||
|
if screenshot:
|
||||||
|
video_path = downloader.download_video(video_url)
|
||||||
|
self.video_path = video_path
|
||||||
|
print(video_path)
|
||||||
|
|
||||||
|
# 2. 下载音频
|
||||||
|
audio: AudioDownloadResult = downloader.download(
|
||||||
|
video_url=video_url,
|
||||||
|
quality=quality,
|
||||||
|
output_dir=path,
|
||||||
|
need_video=screenshot
|
||||||
|
|
||||||
|
)
|
||||||
|
|
||||||
|
# 3. Whisper 转写
|
||||||
|
transcript: TranscriptResult = self.transcriber.transcript(file_path=audio.file_path)
|
||||||
|
|
||||||
|
# 4. GPT 总结
|
||||||
|
source = GPTSource(
|
||||||
|
title=audio.title,
|
||||||
|
segment=transcript.segments,
|
||||||
|
tags=audio.raw_info.get('tags'),
|
||||||
|
screenshot=screenshot,
|
||||||
|
link=link
|
||||||
|
)
|
||||||
|
markdown: str = gpt.summarize(source)
|
||||||
|
print("markdown结果", markdown)
|
||||||
|
|
||||||
|
markdown = replace_content_markers(markdown=markdown, video_id=audio.video_id, platform=platform)
|
||||||
|
if self.video_path:
|
||||||
|
markdown = self.insert_screenshots_into_markdown(markdown, self.video_path, image_base_url, output_dir)
|
||||||
|
self.save_meta(video_id=audio.video_id, platform=platform, task_id=task_id)
|
||||||
|
# 5. 返回结构体
|
||||||
|
return NoteResult(
|
||||||
|
markdown=markdown,
|
||||||
|
transcript=transcript,
|
||||||
|
audio_meta=audio
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
note = NoteGenerator()
|
||||||
|
print(note.audio_meta)
|
||||||
@@ -0,0 +1,14 @@
|
|||||||
|
from abc import ABC, abstractmethod
|
||||||
|
|
||||||
|
from app.models.transcriber_model import TranscriptResult
|
||||||
|
|
||||||
|
|
||||||
|
class Transcriber(ABC):
|
||||||
|
@abstractmethod
|
||||||
|
def transcript(self,file_path:str)->TranscriptResult:
|
||||||
|
'''
|
||||||
|
|
||||||
|
:param file_path:音频路径
|
||||||
|
:return: 返回一个 TranscriptResult 类
|
||||||
|
'''
|
||||||
|
pass
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
from app.transcriber.whisper import WhisperTranscriber
|
||||||
|
print('实例化transcriber')
|
||||||
|
# TODO:后面需要加入逻辑选择
|
||||||
|
_transcriber = None
|
||||||
|
|
||||||
|
def get_transcriber(model_size="base", device="cuda"):
|
||||||
|
global _transcriber
|
||||||
|
if _transcriber is None:
|
||||||
|
print('加载_transcriber')
|
||||||
|
_transcriber = WhisperTranscriber(model_size=model_size, device=device)
|
||||||
|
return _transcriber
|
||||||
@@ -0,0 +1,92 @@
|
|||||||
|
from faster_whisper import WhisperModel
|
||||||
|
|
||||||
|
from app.decorators.timeit import timeit
|
||||||
|
from app.models.transcriber_model import TranscriptSegment, TranscriptResult
|
||||||
|
from app.transcriber.base import Transcriber
|
||||||
|
from app.utils.env_checker import is_cuda_available, is_torch_installed
|
||||||
|
from app.utils.path_helper import get_model_dir
|
||||||
|
|
||||||
|
'''
|
||||||
|
Size of the model to use (tiny, tiny.en, base, base.en, small, small.en, distil-small.en, medium, medium.en, distil-medium.en, large-v1, large-v2, large-v3, large, distil-large-v2, distil-large-v3, large-v3-turbo, or turbo
|
||||||
|
'''
|
||||||
|
|
||||||
|
|
||||||
|
class WhisperTranscriber(Transcriber):
|
||||||
|
# TODO:修改为可配置
|
||||||
|
def __init__(
|
||||||
|
self,
|
||||||
|
model_size: str = "base",
|
||||||
|
device: str = 'cpu',
|
||||||
|
compute_type: str = None,
|
||||||
|
cpu_threads: int = 1,
|
||||||
|
):
|
||||||
|
if device == 'cpu' or device is None:
|
||||||
|
self.device = 'cpu'
|
||||||
|
else:
|
||||||
|
self.device = "cuda" if self.is_cuda() else "cpu"
|
||||||
|
if device == 'cuda' and self.device == 'cpu':
|
||||||
|
print('没有 cuda 使用 cpu进行计算')
|
||||||
|
|
||||||
|
self.compute_type = compute_type or ("float16" if self.device == "cuda" else "int8")
|
||||||
|
|
||||||
|
model_path = get_model_dir("whisper")
|
||||||
|
self.model = WhisperModel(
|
||||||
|
model_size,
|
||||||
|
device=self.device,
|
||||||
|
# compute_type="int8", # 或 "float16"
|
||||||
|
cpu_threads=cpu_threads,
|
||||||
|
download_root=model_path
|
||||||
|
)
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def is_torch_installed() -> bool:
|
||||||
|
try:
|
||||||
|
import torch
|
||||||
|
return True
|
||||||
|
except ImportError:
|
||||||
|
return False
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def is_cuda() -> bool:
|
||||||
|
try:
|
||||||
|
if is_cuda_available():
|
||||||
|
print("✅ CUDA 可用,使用 GPU")
|
||||||
|
return True
|
||||||
|
elif is_torch_installed():
|
||||||
|
print("⚠️ 只装了 torch,但没有 CUDA,用 CPU")
|
||||||
|
return False
|
||||||
|
else:
|
||||||
|
print("❌ 还没有安装 torch,请先安装")
|
||||||
|
return False
|
||||||
|
|
||||||
|
except ImportError:
|
||||||
|
return False
|
||||||
|
|
||||||
|
@timeit
|
||||||
|
def transcript(self, file_path: str) -> TranscriptResult:
|
||||||
|
|
||||||
|
segments_raw, info = self.model.transcribe(file_path)
|
||||||
|
|
||||||
|
segments = []
|
||||||
|
full_text = ""
|
||||||
|
|
||||||
|
for seg in segments_raw:
|
||||||
|
text = seg.text.strip()
|
||||||
|
full_text += text + " "
|
||||||
|
segments.append(TranscriptSegment(
|
||||||
|
start=seg.start,
|
||||||
|
end=seg.end,
|
||||||
|
text=text
|
||||||
|
))
|
||||||
|
|
||||||
|
return TranscriptResult(
|
||||||
|
language=info.language,
|
||||||
|
full_text=full_text.strip(),
|
||||||
|
segments=segments,
|
||||||
|
raw=info
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
print(WhisperTranscriber(cpu_threads=8).transcript(
|
||||||
|
'''D:\\data_backup_from_ssd\\02_个人项目\\11_BiliNote\\backend\\data\\BV1vcZ5YQE9X.mp3'''))
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
def is_cuda_available() -> bool:
|
||||||
|
try:
|
||||||
|
import torch
|
||||||
|
return torch.cuda.is_available()
|
||||||
|
except ImportError:
|
||||||
|
return False
|
||||||
|
def is_torch_installed() -> bool:
|
||||||
|
try:
|
||||||
|
import torch
|
||||||
|
return True
|
||||||
|
except ImportError:
|
||||||
|
return False
|
||||||
@@ -0,0 +1,32 @@
|
|||||||
|
import re
|
||||||
|
|
||||||
|
|
||||||
|
import re
|
||||||
|
|
||||||
|
import re
|
||||||
|
|
||||||
|
def replace_content_markers(markdown: str, video_id: str, platform: str = 'bilibili') -> str:
|
||||||
|
"""
|
||||||
|
替换 *Content-04:16*、Content-04:16 或 Content-[04:16] 为超链接,跳转到对应平台视频的时间位置
|
||||||
|
"""
|
||||||
|
# 匹配三种形式:*Content-04:16*、Content-04:16、Content-[04:16]
|
||||||
|
pattern = r"(?:\*?)Content-(?:\[(\d{2}):(\d{2})\]|(\d{2}):(\d{2}))"
|
||||||
|
|
||||||
|
def replacer(match):
|
||||||
|
mm = match.group(1) or match.group(3)
|
||||||
|
ss = match.group(2) or match.group(4)
|
||||||
|
total_seconds = int(mm) * 60 + int(ss)
|
||||||
|
|
||||||
|
if platform == 'bilibili':
|
||||||
|
url = f"https://www.bilibili.com/video/{video_id}?t={total_seconds}"
|
||||||
|
elif platform == 'youtube':
|
||||||
|
url = f"https://www.youtube.com/watch?v={video_id}&t={total_seconds}s"
|
||||||
|
elif platform == 'douyin':
|
||||||
|
url = f"https://www.douyin.com/video/{video_id}"
|
||||||
|
return f"[原片 @ {mm}:{ss}]({url})"
|
||||||
|
else:
|
||||||
|
return f"({mm}:{ss})"
|
||||||
|
|
||||||
|
return f"[原片 @ {mm}:{ss}]({url})"
|
||||||
|
|
||||||
|
return re.sub(pattern, replacer, markdown)
|
||||||
@@ -0,0 +1,18 @@
|
|||||||
|
import os
|
||||||
|
|
||||||
|
PROJECT_ROOT = os.path.abspath(os.path.join(os.path.dirname(__file__), "../../"))
|
||||||
|
|
||||||
|
def get_data_dir():
|
||||||
|
data_path = os.path.join(PROJECT_ROOT, "data")
|
||||||
|
os.makedirs(data_path, exist_ok=True)
|
||||||
|
return data_path
|
||||||
|
|
||||||
|
def get_model_dir(subdir: str = "whisper") -> str:
|
||||||
|
base = os.path.abspath(os.path.join(os.path.dirname(__file__), "../../models"))
|
||||||
|
path = os.path.join(base, subdir)
|
||||||
|
os.makedirs(path, exist_ok=True)
|
||||||
|
return path
|
||||||
|
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
print(get_data_dir())
|
||||||
@@ -0,0 +1,18 @@
|
|||||||
|
from app.utils.status_code import StatusCode
|
||||||
|
|
||||||
|
class ResponseWrapper:
|
||||||
|
@staticmethod
|
||||||
|
def success(data=None, msg="success", code=StatusCode.SUCCESS):
|
||||||
|
return {
|
||||||
|
"code": int(code),
|
||||||
|
"msg": msg,
|
||||||
|
"data": data
|
||||||
|
}
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def error(msg="error", code=StatusCode.FAIL, data=None):
|
||||||
|
return {
|
||||||
|
"code": int(code),
|
||||||
|
"msg": msg,
|
||||||
|
"data": data
|
||||||
|
}
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
from enum import IntEnum
|
||||||
|
|
||||||
|
class StatusCode(IntEnum):
|
||||||
|
SUCCESS = 0
|
||||||
|
FAIL = 1
|
||||||
|
|
||||||
|
DOWNLOAD_ERROR = 1001
|
||||||
|
TRANSCRIBE_ERROR = 1002
|
||||||
|
GENERATE_ERROR = 1003
|
||||||
|
|
||||||
|
INVALID_URL = 2001
|
||||||
|
PARAM_ERROR = 2002
|
||||||
@@ -0,0 +1,28 @@
|
|||||||
|
import re
|
||||||
|
from typing import Optional
|
||||||
|
|
||||||
|
|
||||||
|
def extract_video_id(url: str, platform: str) -> Optional[str]:
|
||||||
|
"""
|
||||||
|
从视频链接中提取视频 ID
|
||||||
|
|
||||||
|
:param url: 视频链接
|
||||||
|
:param platform: 平台名(bilibili / youtube / douyin)
|
||||||
|
:return: 提取到的视频 ID 或 None
|
||||||
|
"""
|
||||||
|
if platform == "bilibili":
|
||||||
|
# 匹配 BV号(如 BV1vc411b7Wa)
|
||||||
|
match = re.search(r"BV([0-9A-Za-z]+)", url)
|
||||||
|
return f"BV{match.group(1)}" if match else None
|
||||||
|
|
||||||
|
elif platform == "youtube":
|
||||||
|
# 匹配 v=xxxxx 或 youtu.be/xxxxx,ID 长度通常为 11
|
||||||
|
match = re.search(r"(?:v=|youtu\.be/)([0-9A-Za-z_-]{11})", url)
|
||||||
|
return match.group(1) if match else None
|
||||||
|
|
||||||
|
elif platform == "douyin":
|
||||||
|
# 匹配 douyin.com/video/1234567890123456789
|
||||||
|
match = re.search(r"/video/(\d+)", url)
|
||||||
|
return match.group(1) if match else None
|
||||||
|
|
||||||
|
return None
|
||||||
@@ -0,0 +1,26 @@
|
|||||||
|
import subprocess
|
||||||
|
import os
|
||||||
|
import uuid
|
||||||
|
|
||||||
|
|
||||||
|
def generate_screenshot(video_path: str, output_dir: str, timestamp: int, index: int) -> str:
|
||||||
|
"""
|
||||||
|
使用 ffmpeg 生成截图,返回生成图片路径
|
||||||
|
"""
|
||||||
|
os.makedirs(output_dir, exist_ok=True)
|
||||||
|
ids=str(uuid.uuid4())
|
||||||
|
output_path = os.path.join(output_dir, f"screenshot_{str(index)+ids}.jpg")
|
||||||
|
|
||||||
|
command = [
|
||||||
|
"ffmpeg",
|
||||||
|
"-ss", str(timestamp),
|
||||||
|
"-i", video_path,
|
||||||
|
"-frames:v", "1",
|
||||||
|
"-q:v", "2", # 图像质量
|
||||||
|
output_path,
|
||||||
|
"-y" # 覆盖
|
||||||
|
]
|
||||||
|
|
||||||
|
subprocess.run(command, stdout=subprocess.DEVNULL, stderr=subprocess.DEVNULL)
|
||||||
|
return output_path
|
||||||
|
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user