mirror of
https://github.com/NapNeko/NapCatQQ.git
synced 2025-07-19 12:03:37 +00:00
Merge branch 'main' into type-force
This commit is contained in:
手瓜一十雪
@@ -4,12 +4,15 @@
|
||||
"version": "0.0.6",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"dev": "vite --host=0.0.0.0",
|
||||
"build": "tsc && vite build",
|
||||
"lint": "eslint -c eslint.config.mjs ./src/**/**/*.{ts,tsx} --fix",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dnd-kit/core": "^6.3.1",
|
||||
"@dnd-kit/sortable": "^10.0.0",
|
||||
"@dnd-kit/utilities": "^3.2.2",
|
||||
"@heroui/avatar": "2.2.7",
|
||||
"@heroui/breadcrumbs": "2.2.7",
|
||||
"@heroui/button": "2.2.10",
|
||||
@@ -33,6 +36,7 @@
|
||||
"@heroui/spinner": "2.2.7",
|
||||
"@heroui/switch": "2.2.9",
|
||||
"@heroui/system": "2.4.7",
|
||||
"@heroui/table": "^2.2.9",
|
||||
"@heroui/tabs": "2.2.8",
|
||||
"@heroui/theme": "2.4.6",
|
||||
"@heroui/tooltip": "2.2.8",
|
||||
@@ -53,6 +57,7 @@
|
||||
"framer-motion": "^12.0.6",
|
||||
"monaco-editor": "^0.52.2",
|
||||
"motion": "^12.0.6",
|
||||
"path-browserify": "^1.0.1",
|
||||
"qface": "^1.4.1",
|
||||
"qrcode.react": "^4.2.0",
|
||||
"quill": "^2.0.3",
|
||||
@@ -80,6 +85,7 @@
|
||||
"@types/event-source-polyfill": "^1.0.5",
|
||||
"@types/fabric": "^5.3.9",
|
||||
"@types/node": "^22.12.0",
|
||||
"@types/path-browserify": "^1.0.3",
|
||||
"@types/react": "^19.0.8",
|
||||
"@types/react-dom": "^19.0.3",
|
||||
"@types/react-window": "^1.8.8",
|
||||
|
||||
166
napcat.webui/src/components/file_icon.tsx
Normal file
166
napcat.webui/src/components/file_icon.tsx
Normal file
@@ -0,0 +1,166 @@
|
||||
import {
|
||||
FaFile,
|
||||
FaFileAudio,
|
||||
FaFileCode,
|
||||
FaFileCsv,
|
||||
FaFileExcel,
|
||||
FaFileImage,
|
||||
FaFileLines,
|
||||
FaFilePdf,
|
||||
FaFilePowerpoint,
|
||||
FaFileVideo,
|
||||
FaFileWord,
|
||||
FaFileZipper,
|
||||
FaFolderClosed
|
||||
} from 'react-icons/fa6'
|
||||
|
||||
export interface FileIconProps {
|
||||
name?: string
|
||||
isDirectory?: boolean
|
||||
}
|
||||
|
||||
const FileIcon = (props: FileIconProps) => {
|
||||
const { name, isDirectory = false } = props
|
||||
if (isDirectory) {
|
||||
return <FaFolderClosed className="text-yellow-500" />
|
||||
}
|
||||
|
||||
const ext = name?.split('.').pop() || ''
|
||||
if (ext) {
|
||||
switch (ext.toLowerCase()) {
|
||||
case 'jpg':
|
||||
case 'jpeg':
|
||||
case 'png':
|
||||
case 'gif':
|
||||
case 'svg':
|
||||
case 'bmp':
|
||||
case 'ico':
|
||||
case 'webp':
|
||||
case 'tiff':
|
||||
case 'tif':
|
||||
case 'heic':
|
||||
case 'heif':
|
||||
case 'avif':
|
||||
case 'apng':
|
||||
case 'flif':
|
||||
case 'ai':
|
||||
case 'psd':
|
||||
case 'xcf':
|
||||
case 'sketch':
|
||||
case 'fig':
|
||||
case 'xd':
|
||||
case 'svgz':
|
||||
return <FaFileImage className="text-green-500" />
|
||||
case 'pdf':
|
||||
return <FaFilePdf className="text-red-500" />
|
||||
case 'doc':
|
||||
case 'docx':
|
||||
return <FaFileWord className="text-blue-500" />
|
||||
case 'xls':
|
||||
case 'xlsx':
|
||||
return <FaFileExcel className="text-green-500" />
|
||||
case 'csv':
|
||||
return <FaFileCsv className="text-green-500" />
|
||||
case 'ppt':
|
||||
case 'pptx':
|
||||
return <FaFilePowerpoint className="text-red-500" />
|
||||
case 'zip':
|
||||
case 'rar':
|
||||
case '7z':
|
||||
case 'tar':
|
||||
case 'gz':
|
||||
case 'bz2':
|
||||
case 'xz':
|
||||
case 'lz':
|
||||
case 'lzma':
|
||||
case 'zst':
|
||||
case 'zstd':
|
||||
case 'z':
|
||||
case 'taz':
|
||||
case 'tz':
|
||||
case 'tzo':
|
||||
return <FaFileZipper className="text-green-500" />
|
||||
case 'txt':
|
||||
return <FaFileLines className="text-gray-500" />
|
||||
case 'mp3':
|
||||
case 'wav':
|
||||
case 'flac':
|
||||
return <FaFileAudio className="text-green-500" />
|
||||
case 'mp4':
|
||||
case 'avi':
|
||||
case 'mov':
|
||||
case 'wmv':
|
||||
return <FaFileVideo className="text-red-500" />
|
||||
case 'html':
|
||||
case 'css':
|
||||
case 'js':
|
||||
case 'ts':
|
||||
case 'jsx':
|
||||
case 'tsx':
|
||||
case 'json':
|
||||
case 'xml':
|
||||
case 'yaml':
|
||||
case 'yml':
|
||||
case 'md':
|
||||
case 'sh':
|
||||
case 'py':
|
||||
case 'java':
|
||||
case 'c':
|
||||
case 'cpp':
|
||||
case 'cs':
|
||||
case 'go':
|
||||
case 'php':
|
||||
case 'rb':
|
||||
case 'pl':
|
||||
case 'swift':
|
||||
case 'kt':
|
||||
case 'rs':
|
||||
case 'sql':
|
||||
case 'r':
|
||||
case 'scala':
|
||||
case 'groovy':
|
||||
case 'dart':
|
||||
case 'lua':
|
||||
case 'perl':
|
||||
case 'h':
|
||||
case 'm':
|
||||
case 'mm':
|
||||
case 'makefile':
|
||||
case 'cmake':
|
||||
case 'dockerfile':
|
||||
case 'gradle':
|
||||
case 'properties':
|
||||
case 'ini':
|
||||
case 'conf':
|
||||
case 'env':
|
||||
case 'bat':
|
||||
case 'cmd':
|
||||
case 'ps1':
|
||||
case 'psm1':
|
||||
case 'psd1':
|
||||
case 'ps1xml':
|
||||
case 'psc1':
|
||||
case 'pssc':
|
||||
case 'nuspec':
|
||||
case 'resx':
|
||||
case 'resw':
|
||||
case 'csproj':
|
||||
case 'vbproj':
|
||||
case 'vcxproj':
|
||||
case 'fsproj':
|
||||
case 'sln':
|
||||
case 'suo':
|
||||
case 'user':
|
||||
case 'userosscache':
|
||||
case 'sln.docstates':
|
||||
case 'dll':
|
||||
return <FaFileCode className="text-blue-500" />
|
||||
default:
|
||||
return <FaFile className="text-gray-500" />
|
||||
}
|
||||
}
|
||||
|
||||
return <FaFile className="text-gray-500" />
|
||||
}
|
||||
|
||||
export default FileIcon
|
||||
@@ -0,0 +1,64 @@
|
||||
import { Button, ButtonGroup } from '@heroui/button'
|
||||
import { Input } from '@heroui/input'
|
||||
import {
|
||||
Modal,
|
||||
ModalBody,
|
||||
ModalContent,
|
||||
ModalFooter,
|
||||
ModalHeader
|
||||
} from '@heroui/modal'
|
||||
|
||||
interface CreateFileModalProps {
|
||||
isOpen: boolean
|
||||
fileType: 'file' | 'directory'
|
||||
newFileName: string
|
||||
onTypeChange: (type: 'file' | 'directory') => void
|
||||
onNameChange: (e: React.ChangeEvent<HTMLInputElement>) => void
|
||||
onClose: () => void
|
||||
onCreate: () => void
|
||||
}
|
||||
|
||||
export default function CreateFileModal({
|
||||
isOpen,
|
||||
fileType,
|
||||
newFileName,
|
||||
onTypeChange,
|
||||
onNameChange,
|
||||
onClose,
|
||||
onCreate
|
||||
}: CreateFileModalProps) {
|
||||
return (
|
||||
<Modal isOpen={isOpen} onClose={onClose}>
|
||||
<ModalContent>
|
||||
<ModalHeader>新建</ModalHeader>
|
||||
<ModalBody>
|
||||
<div className="flex flex-col gap-4">
|
||||
<ButtonGroup color="danger">
|
||||
<Button
|
||||
variant={fileType === 'file' ? 'solid' : 'flat'}
|
||||
onPress={() => onTypeChange('file')}
|
||||
>
|
||||
文件
|
||||
</Button>
|
||||
<Button
|
||||
variant={fileType === 'directory' ? 'solid' : 'flat'}
|
||||
onPress={() => onTypeChange('directory')}
|
||||
>
|
||||
目录
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
<Input label="名称" value={newFileName} onChange={onNameChange} />
|
||||
</div>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button color="danger" variant="flat" onPress={onClose}>
|
||||
取消
|
||||
</Button>
|
||||
<Button color="danger" onPress={onCreate}>
|
||||
创建
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
94
napcat.webui/src/components/file_manage/file_edit_modal.tsx
Normal file
94
napcat.webui/src/components/file_manage/file_edit_modal.tsx
Normal file
@@ -0,0 +1,94 @@
|
||||
import { Button } from '@heroui/button'
|
||||
import { Code } from '@heroui/code'
|
||||
import {
|
||||
Modal,
|
||||
ModalBody,
|
||||
ModalContent,
|
||||
ModalFooter,
|
||||
ModalHeader
|
||||
} from '@heroui/modal'
|
||||
|
||||
import CodeEditor from '@/components/code_editor'
|
||||
|
||||
interface FileEditModalProps {
|
||||
isOpen: boolean
|
||||
file: { path: string; content: string } | null
|
||||
onClose: () => void
|
||||
onSave: () => void
|
||||
onContentChange: (newContent?: string) => void
|
||||
}
|
||||
|
||||
export default function FileEditModal({
|
||||
isOpen,
|
||||
file,
|
||||
onClose,
|
||||
onSave,
|
||||
onContentChange
|
||||
}: FileEditModalProps) {
|
||||
// 根据文件后缀返回对应语言
|
||||
const getLanguage = (filePath: string) => {
|
||||
if (filePath.endsWith('.js')) return 'javascript'
|
||||
if (filePath.endsWith('.ts')) return 'typescript'
|
||||
if (filePath.endsWith('.tsx')) return 'tsx'
|
||||
if (filePath.endsWith('.jsx')) return 'jsx'
|
||||
if (filePath.endsWith('.vue')) return 'vue'
|
||||
if (filePath.endsWith('.svelte')) return 'svelte'
|
||||
if (filePath.endsWith('.json')) return 'json'
|
||||
if (filePath.endsWith('.html')) return 'html'
|
||||
if (filePath.endsWith('.css')) return 'css'
|
||||
if (filePath.endsWith('.scss')) return 'scss'
|
||||
if (filePath.endsWith('.less')) return 'less'
|
||||
if (filePath.endsWith('.md')) return 'markdown'
|
||||
if (filePath.endsWith('.yaml') || filePath.endsWith('.yml')) return 'yaml'
|
||||
if (filePath.endsWith('.xml')) return 'xml'
|
||||
if (filePath.endsWith('.sql')) return 'sql'
|
||||
if (filePath.endsWith('.sh')) return 'shell'
|
||||
if (filePath.endsWith('.bat')) return 'bat'
|
||||
if (filePath.endsWith('.php')) return 'php'
|
||||
if (filePath.endsWith('.java')) return 'java'
|
||||
if (filePath.endsWith('.c')) return 'c'
|
||||
if (filePath.endsWith('.cpp')) return 'cpp'
|
||||
if (filePath.endsWith('.h')) return 'h'
|
||||
if (filePath.endsWith('.hpp')) return 'hpp'
|
||||
if (filePath.endsWith('.go')) return 'go'
|
||||
if (filePath.endsWith('.py')) return 'python'
|
||||
if (filePath.endsWith('.rb')) return 'ruby'
|
||||
if (filePath.endsWith('.cs')) return 'csharp'
|
||||
if (filePath.endsWith('.swift')) return 'swift'
|
||||
if (filePath.endsWith('.vb')) return 'vb'
|
||||
if (filePath.endsWith('.lua')) return 'lua'
|
||||
if (filePath.endsWith('.pl')) return 'perl'
|
||||
if (filePath.endsWith('.r')) return 'r'
|
||||
return 'plaintext'
|
||||
}
|
||||
|
||||
return (
|
||||
<Modal size="full" isOpen={isOpen} onClose={onClose}>
|
||||
<ModalContent>
|
||||
<ModalHeader className="flex items-center gap-2 bg-content2 bg-opacity-50">
|
||||
<span>编辑文件</span>
|
||||
<Code className="text-xs">{file?.path}</Code>
|
||||
</ModalHeader>
|
||||
<ModalBody className="p-0">
|
||||
<div className="h-full">
|
||||
<CodeEditor
|
||||
height="100%"
|
||||
value={file?.content || ''}
|
||||
onChange={onContentChange}
|
||||
options={{ wordWrap: 'on' }}
|
||||
language={file?.path ? getLanguage(file.path) : 'plaintext'}
|
||||
/>
|
||||
</div>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button color="danger" variant="flat" onPress={onClose}>
|
||||
取消
|
||||
</Button>
|
||||
<Button color="danger" onPress={onSave}>
|
||||
保存
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
159
napcat.webui/src/components/file_manage/file_table.tsx
Normal file
159
napcat.webui/src/components/file_manage/file_table.tsx
Normal file
@@ -0,0 +1,159 @@
|
||||
import { Button, ButtonGroup } from '@heroui/button'
|
||||
import { Spinner } from '@heroui/spinner'
|
||||
import {
|
||||
type Selection,
|
||||
type SortDescriptor,
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableColumn,
|
||||
TableHeader,
|
||||
TableRow
|
||||
} from '@heroui/table'
|
||||
import { Tooltip } from '@heroui/tooltip'
|
||||
import path from 'path-browserify'
|
||||
import { BiRename } from 'react-icons/bi'
|
||||
import { FiCopy, FiMove, FiTrash2 } from 'react-icons/fi'
|
||||
|
||||
import FileIcon from '@/components/file_icon'
|
||||
|
||||
import type { FileInfo } from '@/controllers/file_manager'
|
||||
|
||||
interface FileTableProps {
|
||||
files: FileInfo[]
|
||||
currentPath: string
|
||||
loading: boolean
|
||||
sortDescriptor: SortDescriptor
|
||||
onSortChange: (descriptor: SortDescriptor) => void
|
||||
selectedFiles: Selection
|
||||
onSelectionChange: (selected: Selection) => void
|
||||
onDirectoryClick: (dirPath: string) => void
|
||||
onEdit: (filePath: string) => void
|
||||
onRenameRequest: (name: string) => void
|
||||
onMoveRequest: (name: string) => void
|
||||
onCopyPath: (fileName: string) => void
|
||||
onDelete: (filePath: string) => void
|
||||
}
|
||||
|
||||
export default function FileTable({
|
||||
files,
|
||||
currentPath,
|
||||
loading,
|
||||
sortDescriptor,
|
||||
onSortChange,
|
||||
selectedFiles,
|
||||
onSelectionChange,
|
||||
onDirectoryClick,
|
||||
onEdit,
|
||||
onRenameRequest,
|
||||
onMoveRequest,
|
||||
onCopyPath,
|
||||
onDelete
|
||||
}: FileTableProps) {
|
||||
return (
|
||||
<Table
|
||||
aria-label="文件列表"
|
||||
sortDescriptor={sortDescriptor}
|
||||
onSortChange={onSortChange}
|
||||
onSelectionChange={onSelectionChange}
|
||||
defaultSelectedKeys={[]}
|
||||
selectedKeys={selectedFiles}
|
||||
selectionMode="multiple"
|
||||
>
|
||||
<TableHeader>
|
||||
<TableColumn key="name" allowsSorting>
|
||||
名称
|
||||
</TableColumn>
|
||||
<TableColumn key="type" allowsSorting>
|
||||
类型
|
||||
</TableColumn>
|
||||
<TableColumn key="size" allowsSorting>
|
||||
大小
|
||||
</TableColumn>
|
||||
<TableColumn key="mtime" allowsSorting>
|
||||
修改时间
|
||||
</TableColumn>
|
||||
<TableColumn key="actions">操作</TableColumn>
|
||||
</TableHeader>
|
||||
<TableBody
|
||||
isLoading={loading}
|
||||
loadingContent={
|
||||
<div className="flex justify-center items-center h-full">
|
||||
<Spinner />
|
||||
</div>
|
||||
}
|
||||
items={files}
|
||||
>
|
||||
{(file: FileInfo) => (
|
||||
<TableRow key={file.name}>
|
||||
<TableCell>
|
||||
<Button
|
||||
variant="light"
|
||||
onPress={() =>
|
||||
file.isDirectory
|
||||
? onDirectoryClick(file.name)
|
||||
: onEdit(path.join(currentPath, file.name))
|
||||
}
|
||||
className="text-left justify-start"
|
||||
startContent={
|
||||
<FileIcon name={file.name} isDirectory={file.isDirectory} />
|
||||
}
|
||||
>
|
||||
{file.name}
|
||||
</Button>
|
||||
</TableCell>
|
||||
<TableCell>{file.isDirectory ? '目录' : '文件'}</TableCell>
|
||||
<TableCell>
|
||||
{isNaN(file.size) || file.isDirectory ? '-' : `${file.size} 字节`}
|
||||
</TableCell>
|
||||
<TableCell>{new Date(file.mtime).toLocaleString()}</TableCell>
|
||||
<TableCell>
|
||||
<ButtonGroup size="sm">
|
||||
<Tooltip content="重命名">
|
||||
<Button
|
||||
isIconOnly
|
||||
color="danger"
|
||||
variant="flat"
|
||||
onPress={() => onRenameRequest(file.name)}
|
||||
>
|
||||
<BiRename />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
<Tooltip content="移动">
|
||||
<Button
|
||||
isIconOnly
|
||||
color="danger"
|
||||
variant="flat"
|
||||
onPress={() => onMoveRequest(file.name)}
|
||||
>
|
||||
<FiMove />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
<Tooltip content="复制路径">
|
||||
<Button
|
||||
isIconOnly
|
||||
color="danger"
|
||||
variant="flat"
|
||||
onPress={() => onCopyPath(file.name)}
|
||||
>
|
||||
<FiCopy />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
<Tooltip content="删除">
|
||||
<Button
|
||||
isIconOnly
|
||||
color="danger"
|
||||
variant="flat"
|
||||
onPress={() => onDelete(path.join(currentPath, file.name))}
|
||||
>
|
||||
<FiTrash2 />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
</ButtonGroup>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
)}
|
||||
</TableBody>
|
||||
</Table>
|
||||
)
|
||||
}
|
||||
168
napcat.webui/src/components/file_manage/move_modal.tsx
Normal file
168
napcat.webui/src/components/file_manage/move_modal.tsx
Normal file
@@ -0,0 +1,168 @@
|
||||
import { Button } from '@heroui/button'
|
||||
import {
|
||||
Modal,
|
||||
ModalBody,
|
||||
ModalContent,
|
||||
ModalFooter,
|
||||
ModalHeader
|
||||
} from '@heroui/modal'
|
||||
import { Spinner } from '@heroui/spinner'
|
||||
import clsx from 'clsx'
|
||||
import path from 'path-browserify'
|
||||
import { useState } from 'react'
|
||||
import { IoAdd, IoRemove } from 'react-icons/io5'
|
||||
|
||||
import FileManager from '@/controllers/file_manager'
|
||||
|
||||
interface MoveModalProps {
|
||||
isOpen: boolean
|
||||
moveTargetPath: string
|
||||
selectionInfo: string
|
||||
onClose: () => void
|
||||
onMove: () => void
|
||||
onSelect: (dir: string) => void // 新增回调
|
||||
}
|
||||
|
||||
// 将 DirectoryTree 改为递归组件
|
||||
// 新增 selectedPath 属性，用于标识当前选中的目录
|
||||
function DirectoryTree({
|
||||
basePath,
|
||||
onSelect,
|
||||
selectedPath
|
||||
}: {
|
||||
basePath: string
|
||||
onSelect: (dir: string) => void
|
||||
selectedPath?: string
|
||||
}) {
|
||||
const [dirs, setDirs] = useState<string[]>([])
|
||||
const [expanded, setExpanded] = useState(false)
|
||||
// 新增loading状态
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
const fetchDirectories = async () => {
|
||||
try {
|
||||
// 直接使用 basePath 调用接口，移除 process.platform 判断
|
||||
const list = await FileManager.listDirectories(basePath)
|
||||
setDirs(list.map((item) => item.name))
|
||||
} catch (error) {
|
||||
// ...error handling...
|
||||
}
|
||||
}
|
||||
|
||||
const handleToggle = async () => {
|
||||
if (!expanded) {
|
||||
setExpanded(true)
|
||||
setLoading(true)
|
||||
await fetchDirectories()
|
||||
setLoading(false)
|
||||
} else {
|
||||
setExpanded(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleClick = () => {
|
||||
onSelect(basePath)
|
||||
handleToggle()
|
||||
}
|
||||
|
||||
// 计算显示的名称
|
||||
const getDisplayName = () => {
|
||||
if (basePath === '/') return '/'
|
||||
if (/^[A-Z]:$/i.test(basePath)) return basePath
|
||||
return path.basename(basePath)
|
||||
}
|
||||
|
||||
// 更新 Button 的 variant 逻辑
|
||||
const isSeleted = selectedPath === basePath
|
||||
const variant = isSeleted
|
||||
? 'solid'
|
||||
: selectedPath && path.dirname(selectedPath) === basePath
|
||||
? 'flat'
|
||||
: 'light'
|
||||
|
||||
return (
|
||||
<div className="ml-4">
|
||||
<Button
|
||||
onPress={handleClick}
|
||||
className="py-1 px-2 text-left justify-start min-w-0 min-h-0 h-auto text-sm rounded-md"
|
||||
size="sm"
|
||||
color="danger"
|
||||
variant={variant}
|
||||
startContent={
|
||||
<div
|
||||
className={clsx(
|
||||
'rounded-md',
|
||||
isSeleted ? 'bg-danger-600' : 'bg-danger-50'
|
||||
)}
|
||||
>
|
||||
{expanded ? <IoRemove /> : <IoAdd />}
|
||||
</div>
|
||||
}
|
||||
>
|
||||
{getDisplayName()}
|
||||
</Button>
|
||||
{expanded && (
|
||||
<div>
|
||||
{loading ? (
|
||||
<div className="flex py-1 px-8">
|
||||
<Spinner size="sm" color="danger" />
|
||||
</div>
|
||||
) : (
|
||||
dirs.map((dirName) => {
|
||||
const childPath =
|
||||
basePath === '/' && /^[A-Z]:$/i.test(dirName)
|
||||
? dirName
|
||||
: path.join(basePath, dirName)
|
||||
return (
|
||||
<DirectoryTree
|
||||
key={childPath}
|
||||
basePath={childPath}
|
||||
onSelect={onSelect}
|
||||
selectedPath={selectedPath}
|
||||
/>
|
||||
)
|
||||
})
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default function MoveModal({
|
||||
isOpen,
|
||||
moveTargetPath,
|
||||
selectionInfo,
|
||||
onClose,
|
||||
onMove,
|
||||
onSelect
|
||||
}: MoveModalProps) {
|
||||
return (
|
||||
<Modal isOpen={isOpen} onClose={onClose}>
|
||||
<ModalContent>
|
||||
<ModalHeader>选择目标目录</ModalHeader>
|
||||
<ModalBody>
|
||||
<div className="rounded-md p-2 border border-default-300 overflow-auto max-h-60">
|
||||
<DirectoryTree
|
||||
basePath="/"
|
||||
onSelect={onSelect}
|
||||
selectedPath={moveTargetPath}
|
||||
/>
|
||||
</div>
|
||||
<p className="text-sm text-default-500 mt-2">
|
||||
当前选择：{moveTargetPath || '未选择'}
|
||||
</p>
|
||||
<p className="text-sm text-default-500">移动项：{selectionInfo}</p>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button color="danger" variant="flat" onPress={onClose}>
|
||||
取消
|
||||
</Button>
|
||||
<Button color="danger" onPress={onMove}>
|
||||
确定
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
44
napcat.webui/src/components/file_manage/rename_modal.tsx
Normal file
44
napcat.webui/src/components/file_manage/rename_modal.tsx
Normal file
@@ -0,0 +1,44 @@
|
||||
import { Button } from '@heroui/button'
|
||||
import { Input } from '@heroui/input'
|
||||
import {
|
||||
Modal,
|
||||
ModalBody,
|
||||
ModalContent,
|
||||
ModalFooter,
|
||||
ModalHeader
|
||||
} from '@heroui/modal'
|
||||
|
||||
interface RenameModalProps {
|
||||
isOpen: boolean
|
||||
newFileName: string
|
||||
onNameChange: (e: React.ChangeEvent<HTMLInputElement>) => void
|
||||
onClose: () => void
|
||||
onRename: () => void
|
||||
}
|
||||
|
||||
export default function RenameModal({
|
||||
isOpen,
|
||||
newFileName,
|
||||
onNameChange,
|
||||
onClose,
|
||||
onRename
|
||||
}: RenameModalProps) {
|
||||
return (
|
||||
<Modal isOpen={isOpen} onClose={onClose}>
|
||||
<ModalContent>
|
||||
<ModalHeader>重命名</ModalHeader>
|
||||
<ModalBody>
|
||||
<Input label="新名称" value={newFileName} onChange={onNameChange} />
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button color="danger" variant="flat" onPress={onClose}>
|
||||
取消
|
||||
</Button>
|
||||
<Button color="danger" onPress={onRename}>
|
||||
确定
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
@@ -1152,7 +1152,7 @@ export const WebUIIcon = (props: IconSvgProps) => (
|
||||
begin="0ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1197,7 +1197,7 @@ export const WebUIIcon = (props: IconSvgProps) => (
|
||||
begin="800ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1247,7 +1247,7 @@ export const WebUIIcon = (props: IconSvgProps) => (
|
||||
begin="1600ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1297,7 +1297,7 @@ export const WebUIIcon = (props: IconSvgProps) => (
|
||||
begin="2400ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1344,7 +1344,7 @@ export const WebUIIcon = (props: IconSvgProps) => (
|
||||
begin="3200ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1399,7 +1399,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="0ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1446,7 +1446,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="600ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1496,7 +1496,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="1200ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1543,7 +1543,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="1800ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1590,7 +1590,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="2400ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1637,7 +1637,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="3000ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1684,7 +1684,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="3600ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1731,7 +1731,7 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
begin="4200ms"
|
||||
></animate>
|
||||
<animate
|
||||
attributeName="fill-opacity"
|
||||
attributeName="fillOpacity"
|
||||
to="1"
|
||||
dur="800ms"
|
||||
calcMode="linear"
|
||||
@@ -1744,3 +1744,224 @@ export const BietiaopIcon = (props: IconSvgProps) => (
|
||||
</svg>
|
||||
</>
|
||||
)
|
||||
|
||||
export const FileIcon = (props: IconSvgProps) => (
|
||||
<svg
|
||||
version="1.1"
|
||||
id="_x36_"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlnsXlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 0 512 512"
|
||||
xmlSpace="preserve"
|
||||
{...props}
|
||||
>
|
||||
<g id="SVGRepo_bgCarrier" strokeWidth="0"></g>
|
||||
<g
|
||||
id="SVGRepo_tracerCarrier"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
></g>
|
||||
<g id="SVGRepo_iconCarrier">
|
||||
<g>
|
||||
<path
|
||||
style={{ fill: '#D4B476' }}
|
||||
d="M441.853,393.794H70.147C31.566,393.794,0,362.228,0,323.647V106.969 c0-38.581,31.566-70.147,70.147-70.147h371.706c38.581,0,70.147,31.566,70.147,70.147v216.678 C512,362.228,480.434,393.794,441.853,393.794z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#D4B476' }}
|
||||
d="M199.884,249.574H70.147C31.566,249.574,0,218.008,0,179.427V70.147C0,31.566,31.566,0,70.147,0 h129.737c38.581,0,70.147,31.566,70.147,70.147v109.28C270.031,218.008,238.465,249.574,199.884,249.574z"
|
||||
></path>
|
||||
<polygon
|
||||
style={{ fill: '#F0EFEF' }}
|
||||
points="485.439,329.388 87.357,347.774 78.653,130.095 476.734,111.709 "
|
||||
></polygon>
|
||||
<defs>
|
||||
<filter
|
||||
id="Adobe_OpacityMaskFilter"
|
||||
filterUnits="userSpaceOnUse"
|
||||
x="34.381"
|
||||
y="60.216"
|
||||
width="416.68"
|
||||
height="259.557"
|
||||
>
|
||||
<feFlood
|
||||
style={{
|
||||
floodColor: 'white',
|
||||
floodOpacity: 1
|
||||
}}
|
||||
result="back"
|
||||
></feFlood>
|
||||
<feBlend in="SourceGraphic" in2="back" mode="normal"></feBlend>
|
||||
</filter>
|
||||
</defs>
|
||||
<mask
|
||||
maskUnits="userSpaceOnUse"
|
||||
x="34.381"
|
||||
y="60.216"
|
||||
width="416.68"
|
||||
height="259.557"
|
||||
id="SVGID_1_"
|
||||
>
|
||||
<g style={{ filter: 'url(#Adobe_OpacityMaskFilter)' }}>
|
||||
<defs>
|
||||
<filter
|
||||
id="Adobe_OpacityMaskFilter_1_"
|
||||
filterUnits="userSpaceOnUse"
|
||||
x="34.381"
|
||||
y="60.216"
|
||||
width="416.68"
|
||||
height="259.557"
|
||||
>
|
||||
<feFlood
|
||||
style={{ floodColor: 'white', floodOpacity: 1 }}
|
||||
result="back"
|
||||
></feFlood>
|
||||
<feBlend in="SourceGraphic" in2="back" mode="normal"></feBlend>
|
||||
</filter>
|
||||
</defs>
|
||||
<mask
|
||||
maskUnits="userSpaceOnUse"
|
||||
x="34.381"
|
||||
y="60.216"
|
||||
width="416.68"
|
||||
height="259.557"
|
||||
id="SVGID_1_"
|
||||
>
|
||||
<g style={{ filter: 'url(#Adobe_OpacityMaskFilter_1_)' }}> </g>
|
||||
</mask>
|
||||
<linearGradient
|
||||
id="SVGID_2_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="34.3814"
|
||||
y1="189.9944"
|
||||
x2="451.061"
|
||||
y2="189.9944"
|
||||
>
|
||||
<stop offset="0.57" style={{ stopColor: '#F6F6F6' }}></stop>
|
||||
<stop offset="0.6039" style={{ stopColor: '#F6F6F6' }}></stop>
|
||||
</linearGradient>
|
||||
<polygon
|
||||
style={{ mask: 'url(#SVGID_1_)', fill: 'url(#SVGID_2_)' }}
|
||||
points="451.061,277.073 54.598,319.773 34.381,102.916 430.845,60.216 "
|
||||
></polygon>
|
||||
</g>
|
||||
</mask>
|
||||
<linearGradient
|
||||
id="SVGID_3_"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
x1="34.3814"
|
||||
y1="189.9944"
|
||||
x2="451.061"
|
||||
y2="189.9944"
|
||||
>
|
||||
<stop offset="0.57" style={{ stopColor: '#FFFFFF' }}></stop>
|
||||
<stop offset="0.6039" style={{ stopColor: '#F0F0F0' }}></stop>
|
||||
</linearGradient>
|
||||
<polygon
|
||||
style={{ fill: 'url(#SVGID_3_)' }}
|
||||
points="451.061,277.073 54.598,319.773 34.381,102.916 430.845,60.216 "
|
||||
></polygon>
|
||||
<path
|
||||
style={{ fill: '#69A092' }}
|
||||
d="M441.853,417.32H70.147C31.566,417.32,0,385.754,0,347.173V168.515h512v178.658 C512,385.754,480.434,417.32,441.853,417.32z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#D4B476' }}
|
||||
d="M441.853,429.594H70.147C31.566,429.594,0,398.028,0,359.447V189.995h512v169.453 C512,398.028,480.434,429.594,441.853,429.594z"
|
||||
></path>
|
||||
<g>
|
||||
<g>
|
||||
<path
|
||||
style={{ fill: '#CBBC89' }}
|
||||
d="M41.051,330.321h28.918h7.581c0.686,0,1.357,0,2.012,0c0.655,0,1.171,0.126,1.545,0.375 c0.499,0.312,0.795,0.764,0.889,1.357c0.094,0.594,0.141,1.296,0.141,2.106c0,0.312,0.014,0.608,0.047,0.888 c0.031,0.281-0.016,0.547-0.14,0.796c-0.25,0.998-0.796,1.543-1.638,1.638c-0.843,0.094-1.888,0.14-3.136,0.14h-9.733H53.778 c-0.998,0-2.058-0.015-3.182-0.047c-1.122-0.03-1.965,0.173-2.526,0.608c-0.563,0.375-0.858,1.03-0.89,1.965 c-0.032,0.937-0.047,1.873-0.047,2.808v9.265c0,0.5-0.015,1.123-0.046,1.872c-0.033,0.749,0.014,1.373,0.139,1.871v0.748 c0.125,0.375,0.235,0.735,0.328,1.077c0.093,0.344,0.295,0.608,0.608,0.796c0.562,0.374,1.436,0.547,2.621,0.514 c1.184-0.03,2.214-0.047,3.088-0.047h16.845c0.561,0,1.171-0.014,1.825-0.046c0.655-0.031,1.31-0.031,1.965,0 c0.655,0.032,1.248,0.109,1.779,0.234c0.529,0.126,0.889,0.344,1.076,0.655c0.311,0.375,0.467,0.843,0.467,1.404 c0,0.56,0,1.186,0,1.871c0,0.375,0,0.719,0,1.03c0,0.313-0.062,0.594-0.186,0.842c-0.25,0.625-0.595,0.969-1.03,1.03 c-0.25,0.125-0.485,0.186-0.702,0.186c-0.219,0-0.483,0.033-0.796,0.094c-0.25,0.063-0.514,0.079-0.796,0.047 c-0.281-0.03-0.546-0.047-0.794-0.047h-3.277H54.433c-0.999,0-2.168-0.014-3.51-0.047c-1.342-0.03-2.292,0.172-2.853,0.609 c-0.314,0.25-0.547,0.64-0.702,1.169c-0.156,0.531-0.25,1.14-0.281,1.825c-0.033,0.687-0.033,1.389,0,2.106 c0.03,0.717,0.046,1.357,0.046,1.918v16.096c0,1.062,0.032,2.217,0.094,3.463c0.062,1.249-0.156,2.185-0.655,2.807 c-0.186,0.25-0.469,0.391-0.842,0.422c-0.374,0.032-0.749,0.109-1.123,0.234h-1.779c-0.875,0-1.684-0.03-2.433-0.093 c-0.749-0.062-1.279-0.375-1.59-0.937c-0.25-0.374-0.375-0.888-0.375-1.543c0-0.656,0-1.326,0-2.013v-7.488v-39.119v-10.107 c0-0.686-0.016-1.45-0.047-2.292c-0.032-0.842,0.107-1.512,0.422-2.012c0.249-0.374,0.715-0.685,1.404-0.935 c0.124-0.062,0.264-0.077,0.42-0.047C40.785,330.4,40.925,330.383,41.051,330.321z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#CBBC89' }}
|
||||
d="M96.895,330.508c0.436,0,0.935-0.014,1.496-0.046c0.563-0.032,1.108-0.032,1.639,0 c0.529,0.032,1.013,0.109,1.45,0.234c0.437,0.125,0.749,0.312,0.937,0.561c0.374,0.438,0.576,1.046,0.608,1.825 c0.03,0.78,0.047,1.576,0.047,2.386v9.079v36.124v10.949c0,0.811,0,1.669,0,2.574c0,0.905-0.156,1.606-0.468,2.105 c-0.25,0.314-0.547,0.5-0.889,0.563c-0.344,0.062-0.765,0.156-1.264,0.28h-1.777c-0.874,0-1.684-0.034-2.433-0.094 c-0.749-0.061-1.28-0.374-1.592-0.935c-0.25-0.374-0.375-0.89-0.375-1.545c0-0.655,0-1.325,0-2.012v-7.487V345.95v-10.107 c0-0.686-0.015-1.451-0.045-2.292c-0.034-0.843,0.108-1.514,0.42-2.013c0.249-0.436,0.748-0.748,1.497-0.936 c0.125-0.061,0.25-0.077,0.375-0.047C96.645,330.587,96.769,330.571,96.895,330.508z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#CBBC89' }}
|
||||
d="M126.093,330.321c0.436,0,0.935-0.015,1.498-0.047c0.561-0.03,1.107-0.03,1.638,0 c0.529,0.032,1.012,0.109,1.451,0.234c0.436,0.125,0.748,0.313,0.936,0.562c0.374,0.5,0.56,1.155,0.56,1.965 c0,0.811,0,1.654,0,2.528v9.826v30.042v8.609c0,0.687,0,1.436,0,2.245c0,0.813,0.094,1.468,0.281,1.967 c0.188,0.436,0.529,0.811,1.03,1.122c0.313,0.125,0.717,0.203,1.217,0.235c0.499,0.032,0.998,0.046,1.498,0.046h4.772h16.845 h5.24c0.436,0,0.89-0.014,1.359-0.046c0.467-0.032,0.888,0.016,1.263,0.139c0.81,0.25,1.34,0.594,1.591,1.03 c0.062,0.188,0.124,0.5,0.188,0.937c0.061,0.436,0.107,0.889,0.139,1.357c0.03,0.467,0.015,0.935-0.047,1.402 c-0.062,0.469-0.126,0.829-0.187,1.077c-0.126,0.437-0.406,0.782-0.843,1.029c-0.313,0.25-0.765,0.375-1.357,0.375 c-0.593,0-1.169,0-1.731,0h-6.177H133.58h-6.083c-0.874,0-1.623-0.047-2.246-0.139c-0.624-0.094-1.092-0.39-1.404-0.89 c-0.25-0.374-0.373-0.857-0.373-1.451c0-0.591,0-1.168,0-1.729v-6.74v-25.549v-20.308v-5.802c0-0.561,0.014-1.122,0.045-1.684 c0.032-0.561,0.141-0.998,0.328-1.31c0.249-0.374,0.717-0.685,1.404-0.935c0.124-0.062,0.265-0.077,0.422-0.047 C125.827,330.4,125.968,330.383,126.093,330.321z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#CBBC89' }}
|
||||
d="M187.883,330.321h30.602h8.049c0.686,0,1.372-0.015,2.059-0.047 c0.685-0.03,1.248,0.109,1.684,0.422c0.188,0.125,0.343,0.281,0.468,0.467c0.124,0.188,0.249,0.375,0.374,0.563 c0.125,0.436,0.187,1.138,0.187,2.105c0,0.967-0.062,1.701-0.187,2.199c-0.25,0.874-0.78,1.357-1.592,1.451 c-0.811,0.094-1.777,0.14-2.9,0.14h-9.359h-15.722c-0.998,0-2.169-0.015-3.51-0.047c-1.343-0.03-2.325,0.139-2.949,0.514 c-0.624,0.374-0.951,1.03-0.982,1.966c-0.032,0.936-0.048,1.904-0.048,2.901v9.546c0,0.688-0.015,1.498-0.045,2.433 c-0.034,0.937,0.014,1.686,0.139,2.246c0.188,0.749,0.562,1.249,1.123,1.498c0.249,0.125,0.686,0.25,1.31,0.373h0.935 c0.249,0.063,0.515,0.08,0.796,0.047c0.281-0.03,0.577-0.047,0.89-0.047h3.181h18.343c0.561,0,1.184-0.014,1.872-0.046 c0.685-0.031,1.387-0.031,2.104,0c0.717,0.032,1.372,0.093,1.967,0.187c0.591,0.094,1.044,0.233,1.357,0.421 c0.186,0.126,0.341,0.407,0.467,0.842c0.125,0.438,0.218,0.905,0.282,1.404c0.061,0.5,0.077,1.016,0.045,1.545 c-0.031,0.531-0.109,0.983-0.233,1.357c-0.126,0.561-0.406,0.967-0.842,1.217c-0.127,0.126-0.297,0.203-0.515,0.235 c-0.22,0.032-0.422,0.079-0.608,0.139h-0.563c-0.312,0.063-0.623,0.079-0.935,0.047c-0.313-0.03-0.624-0.047-0.935-0.047h-3.463 h-19.747c-0.747,0-1.482-0.014-2.199-0.047c-0.719-0.03-1.39,0-2.012,0.094c-0.624,0.094-1.171,0.267-1.639,0.515 c-0.467,0.25-0.794,0.687-0.982,1.31c-0.126,0.375-0.173,0.811-0.139,1.31c0.03,0.5,0.045,0.999,0.045,1.498v5.239v8.892 c0,0.873,0.032,1.669,0.094,2.386c0.062,0.718,0.312,1.233,0.749,1.544c0.435,0.313,0.935,0.483,1.497,0.515 c0.561,0.032,1.185,0.046,1.871,0.046h5.99h17.314h5.334c0.499,0,0.998-0.014,1.497-0.046c0.498-0.032,0.936,0.016,1.31,0.139 c0.749,0.25,1.248,0.594,1.498,1.03c0.123,0.188,0.217,0.5,0.281,0.937c0.061,0.436,0.108,0.889,0.14,1.357 c0.03,0.467,0.015,0.935-0.047,1.402c-0.062,0.469-0.126,0.829-0.187,1.077c-0.25,0.5-0.531,0.842-0.842,1.029 c-0.375,0.25-0.858,0.375-1.45,0.375c-0.594,0-1.171,0-1.731,0h-6.552h-24.894h-6.551c-0.874,0-1.623-0.047-2.245-0.139 c-0.624-0.094-1.093-0.39-1.404-0.89c-0.25-0.374-0.374-0.857-0.374-1.451c0-0.591,0-1.168,0-1.729v-6.551v-25.082v-20.964 v-5.802c0-0.561,0-1.122,0-1.684c0-0.561,0.124-0.998,0.374-1.31c0.249-0.435,0.716-0.749,1.404-0.935 c0.125-0.062,0.248-0.077,0.375-0.047C187.632,330.4,187.756,330.383,187.883,330.321z"
|
||||
></path>
|
||||
</g>
|
||||
<g>
|
||||
<path
|
||||
style={{ fill: '#98806E' }}
|
||||
d="M41.051,330.321h28.918h7.581c0.686,0,1.357,0,2.012,0c0.655,0,1.171,0.126,1.545,0.375 c0.499,0.312,0.795,0.764,0.889,1.357c0.094,0.594,0.141,1.296,0.141,2.106c0,0.312,0.014,0.608,0.047,0.888 c0.031,0.281-0.016,0.547-0.14,0.796c-0.25,0.998-0.796,1.543-1.638,1.638c-0.843,0.094-1.888,0.14-3.136,0.14h-9.733H53.778 c-0.998,0-2.058-0.015-3.182-0.047c-1.122-0.03-1.965,0.173-2.526,0.608c-0.563,0.375-0.858,1.03-0.89,1.965 c-0.032,0.937-0.047,1.873-0.047,2.808v9.265c0,0.5-0.015,1.123-0.046,1.872c-0.033,0.749,0.014,1.373,0.139,1.871v0.748 c0.125,0.375,0.235,0.735,0.328,1.077c0.093,0.344,0.295,0.608,0.608,0.796c0.562,0.374,1.436,0.547,2.621,0.514 c1.184-0.03,2.214-0.047,3.088-0.047h16.845c0.561,0,1.171-0.014,1.825-0.046c0.655-0.031,1.31-0.031,1.965,0 c0.655,0.032,1.248,0.109,1.779,0.234c0.529,0.126,0.889,0.344,1.076,0.655c0.311,0.375,0.467,0.843,0.467,1.404 c0,0.56,0,1.186,0,1.871c0,0.375,0,0.719,0,1.03c0,0.313-0.062,0.594-0.186,0.842c-0.25,0.625-0.595,0.969-1.03,1.03 c-0.25,0.125-0.485,0.186-0.702,0.186c-0.219,0-0.483,0.033-0.796,0.094c-0.25,0.063-0.514,0.079-0.796,0.047 c-0.281-0.03-0.546-0.047-0.794-0.047h-3.277H54.433c-0.999,0-2.168-0.014-3.51-0.047c-1.342-0.03-2.292,0.172-2.853,0.609 c-0.314,0.25-0.547,0.64-0.702,1.169c-0.156,0.531-0.25,1.14-0.281,1.825c-0.033,0.687-0.033,1.389,0,2.106 c0.03,0.717,0.046,1.357,0.046,1.918v16.096c0,1.062,0.032,2.217,0.094,3.463c0.062,1.249-0.156,2.185-0.655,2.807 c-0.186,0.25-0.469,0.391-0.842,0.422c-0.374,0.032-0.749,0.109-1.123,0.234h-1.779c-0.875,0-1.684-0.03-2.433-0.093 c-0.749-0.062-1.279-0.375-1.59-0.937c-0.25-0.374-0.375-0.888-0.375-1.543c0-0.656,0-1.326,0-2.013v-7.488v-39.119v-10.107 c0-0.686-0.016-1.45-0.047-2.292c-0.032-0.842,0.107-1.512,0.422-2.012c0.249-0.374,0.715-0.685,1.404-0.935 c0.124-0.062,0.264-0.077,0.42-0.047C40.785,330.4,40.925,330.383,41.051,330.321z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#98806E' }}
|
||||
d="M96.895,330.508c0.436,0,0.935-0.014,1.496-0.046c0.563-0.032,1.108-0.032,1.639,0 c0.529,0.032,1.013,0.109,1.45,0.234c0.437,0.125,0.749,0.312,0.937,0.561c0.374,0.438,0.576,1.046,0.608,1.825 c0.03,0.78,0.047,1.576,0.047,2.386v9.079v36.124v10.949c0,0.811,0,1.669,0,2.574c0,0.905-0.156,1.606-0.468,2.105 c-0.25,0.314-0.547,0.5-0.889,0.563c-0.344,0.062-0.765,0.156-1.264,0.28h-1.777c-0.874,0-1.684-0.034-2.433-0.094 c-0.749-0.061-1.28-0.374-1.592-0.935c-0.25-0.374-0.375-0.89-0.375-1.545c0-0.655,0-1.325,0-2.012v-7.487V345.95v-10.107 c0-0.686-0.015-1.451-0.045-2.292c-0.034-0.843,0.108-1.514,0.42-2.013c0.249-0.436,0.748-0.748,1.497-0.936 c0.125-0.061,0.25-0.077,0.375-0.047C96.645,330.587,96.769,330.571,96.895,330.508z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#98806E' }}
|
||||
d="M126.093,330.321c0.436,0,0.935-0.015,1.498-0.047c0.561-0.03,1.107-0.03,1.638,0 c0.529,0.032,1.012,0.109,1.451,0.234c0.436,0.125,0.748,0.313,0.936,0.562c0.374,0.5,0.56,1.155,0.56,1.965 c0,0.811,0,1.654,0,2.528v9.826v30.042v8.609c0,0.687,0,1.436,0,2.245c0,0.813,0.094,1.468,0.281,1.967 c0.188,0.436,0.529,0.811,1.03,1.122c0.313,0.125,0.717,0.203,1.217,0.235c0.499,0.032,0.998,0.046,1.498,0.046h4.772h16.845 h5.24c0.436,0,0.89-0.014,1.359-0.046c0.467-0.032,0.888,0.016,1.263,0.139c0.81,0.25,1.34,0.594,1.591,1.03 c0.062,0.188,0.124,0.5,0.188,0.937c0.061,0.436,0.107,0.889,0.139,1.357c0.03,0.467,0.015,0.935-0.047,1.402 c-0.062,0.469-0.126,0.829-0.187,1.077c-0.126,0.437-0.406,0.782-0.843,1.029c-0.313,0.25-0.765,0.375-1.357,0.375 c-0.593,0-1.169,0-1.731,0h-6.177H133.58h-6.083c-0.874,0-1.623-0.047-2.246-0.139c-0.624-0.094-1.092-0.39-1.404-0.89 c-0.25-0.374-0.373-0.857-0.373-1.451c0-0.591,0-1.168,0-1.729v-6.74v-25.549v-20.308v-5.802c0-0.561,0.014-1.122,0.045-1.684 c0.032-0.561,0.141-0.998,0.328-1.31c0.249-0.374,0.717-0.685,1.404-0.935c0.124-0.062,0.265-0.077,0.422-0.047 C125.827,330.4,125.968,330.383,126.093,330.321z"
|
||||
></path>
|
||||
<path
|
||||
style={{ fill: '#98806E' }}
|
||||
d="M187.883,330.321h30.602h8.049c0.686,0,1.372-0.015,2.059-0.047 c0.685-0.03,1.248,0.109,1.684,0.422c0.188,0.125,0.343,0.281,0.468,0.467c0.124,0.188,0.249,0.375,0.374,0.563 c0.125,0.436,0.187,1.138,0.187,2.105c0,0.967-0.062,1.701-0.187,2.199c-0.25,0.874-0.78,1.357-1.592,1.451 c-0.811,0.094-1.777,0.14-2.9,0.14h-9.359h-15.722c-0.998,0-2.169-0.015-3.51-0.047c-1.343-0.03-2.325,0.139-2.949,0.514 c-0.624,0.374-0.951,1.03-0.982,1.966c-0.032,0.936-0.048,1.904-0.048,2.901v9.546c0,0.688-0.015,1.498-0.045,2.433 c-0.034,0.937,0.014,1.686,0.139,2.246c0.188,0.749,0.562,1.249,1.123,1.498c0.249,0.125,0.686,0.25,1.31,0.373h0.935 c0.249,0.063,0.515,0.08,0.796,0.047c0.281-0.03,0.577-0.047,0.89-0.047h3.181h18.343c0.561,0,1.184-0.014,1.872-0.046 c0.685-0.031,1.387-0.031,2.104,0c0.717,0.032,1.372,0.093,1.967,0.187c0.591,0.094,1.044,0.233,1.357,0.421 c0.186,0.126,0.341,0.407,0.467,0.842c0.125,0.438,0.218,0.905,0.282,1.404c0.061,0.5,0.077,1.016,0.045,1.545 c-0.031,0.531-0.109,0.983-0.233,1.357c-0.126,0.561-0.406,0.967-0.842,1.217c-0.127,0.126-0.297,0.203-0.515,0.235 c-0.22,0.032-0.422,0.079-0.608,0.139h-0.563c-0.312,0.063-0.623,0.079-0.935,0.047c-0.313-0.03-0.624-0.047-0.935-0.047h-3.463 h-19.747c-0.747,0-1.482-0.014-2.199-0.047c-0.719-0.03-1.39,0-2.012,0.094c-0.624,0.094-1.171,0.267-1.639,0.515 c-0.467,0.25-0.794,0.687-0.982,1.31c-0.126,0.375-0.173,0.811-0.139,1.31c0.03,0.5,0.045,0.999,0.045,1.498v5.239v8.892 c0,0.873,0.032,1.669,0.094,2.386c0.062,0.718,0.312,1.233,0.749,1.544c0.435,0.313,0.935,0.483,1.497,0.515 c0.561,0.032,1.185,0.046,1.871,0.046h5.99h17.314h5.334c0.499,0,0.998-0.014,1.497-0.046c0.498-0.032,0.936,0.016,1.31,0.139 c0.749,0.25,1.248,0.594,1.498,1.03c0.123,0.188,0.217,0.5,0.281,0.937c0.061,0.436,0.108,0.889,0.14,1.357 c0.03,0.467,0.015,0.935-0.047,1.402c-0.062,0.469-0.126,0.829-0.187,1.077c-0.25,0.5-0.531,0.842-0.842,1.029 c-0.375,0.25-0.858,0.375-1.45,0.375c-0.594,0-1.171,0-1.731,0h-6.552h-24.894h-6.551c-0.874,0-1.623-0.047-2.245-0.139 c-0.624-0.094-1.093-0.39-1.404-0.89c-0.25-0.374-0.374-0.857-0.374-1.451c0-0.591,0-1.168,0-1.729v-6.551v-25.082v-20.964 v-5.802c0-0.561,0-1.122,0-1.684c0-0.561,0.124-0.998,0.374-1.31c0.249-0.435,0.716-0.749,1.404-0.935 c0.125-0.062,0.248-0.077,0.375-0.047C187.632,330.4,187.756,330.383,187.883,330.321z"
|
||||
></path>
|
||||
</g>
|
||||
</g>
|
||||
<polygon
|
||||
style={{ fill: '#BBAF98' }}
|
||||
points="276.167,208.741 0,302.069 0,186.053 512,186.053 512,302.069 "
|
||||
></polygon>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
)
|
||||
|
||||
export const LogIcon = (props: IconSvgProps) => (
|
||||
<svg
|
||||
viewBox="0 0 48 48"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<g id="SVGRepo_bgCarrier" strokeWidth="0"></g>
|
||||
<g
|
||||
id="SVGRepo_tracerCarrier"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
></g>
|
||||
<g id="SVGRepo_iconCarrier">
|
||||
<rect width="48" height="48" fill="white" fillOpacity="0.01"></rect>
|
||||
<rect
|
||||
x="13"
|
||||
y="10"
|
||||
width="28"
|
||||
height="34"
|
||||
fill="#2F88FF"
|
||||
stroke="#000000"
|
||||
strokeWidth="4"
|
||||
strokeLinejoin="round"
|
||||
></rect>
|
||||
<path
|
||||
d="M35 10V4H8C7.44772 4 7 4.44772 7 5V38H13"
|
||||
stroke="#000000"
|
||||
strokeWidth="4"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
></path>
|
||||
<path
|
||||
d="M21 22H33"
|
||||
stroke="white"
|
||||
strokeWidth="4"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
></path>
|
||||
<path
|
||||
d="M21 30H33"
|
||||
stroke="white"
|
||||
strokeWidth="4"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
></path>
|
||||
</g>
|
||||
</svg>
|
||||
)
|
||||
|
||||
89
napcat.webui/src/components/tabs/index.tsx
Normal file
89
napcat.webui/src/components/tabs/index.tsx
Normal file
@@ -0,0 +1,89 @@
|
||||
import clsx from 'clsx'
|
||||
import { type ReactNode, createContext, forwardRef, useContext } from 'react'
|
||||
|
||||
export interface TabsContextValue {
|
||||
activeKey: string
|
||||
onChange: (key: string) => void
|
||||
}
|
||||
|
||||
const TabsContext = createContext<TabsContextValue>({
|
||||
activeKey: '',
|
||||
onChange: () => {}
|
||||
})
|
||||
|
||||
export interface TabsProps {
|
||||
activeKey: string
|
||||
onChange: (key: string) => void
|
||||
children: ReactNode
|
||||
className?: string
|
||||
}
|
||||
|
||||
export function Tabs({ activeKey, onChange, children, className }: TabsProps) {
|
||||
return (
|
||||
<TabsContext.Provider value={{ activeKey, onChange }}>
|
||||
<div className={clsx('flex flex-col gap-2', className)}>{children}</div>
|
||||
</TabsContext.Provider>
|
||||
)
|
||||
}
|
||||
|
||||
export interface TabListProps {
|
||||
children: ReactNode
|
||||
className?: string
|
||||
}
|
||||
|
||||
export function TabList({ children, className }: TabListProps) {
|
||||
return (
|
||||
<div className={clsx('flex items-center gap-1', className)}>{children}</div>
|
||||
)
|
||||
}
|
||||
|
||||
export interface TabProps extends React.ButtonHTMLAttributes<HTMLDivElement> {
|
||||
value: string
|
||||
className?: string
|
||||
children: ReactNode
|
||||
isSelected?: boolean
|
||||
}
|
||||
|
||||
export const Tab = forwardRef<HTMLDivElement, TabProps>(
|
||||
({ className, isSelected, value, ...props }, ref) => {
|
||||
const { onChange } = useContext(TabsContext)
|
||||
|
||||
const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {
|
||||
onChange(value)
|
||||
props.onClick?.(e)
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
ref={ref}
|
||||
role="tab"
|
||||
aria-selected={isSelected}
|
||||
onClick={handleClick}
|
||||
className={clsx(
|
||||
'px-2 py-1 flex items-center gap-1 text-sm font-medium border-b-2 transition-colors',
|
||||
isSelected
|
||||
? 'border-danger text-danger'
|
||||
: 'border-transparent hover:border-default',
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
)
|
||||
|
||||
Tab.displayName = 'Tab'
|
||||
|
||||
export interface TabPanelProps {
|
||||
value: string
|
||||
children: ReactNode
|
||||
className?: string
|
||||
}
|
||||
|
||||
export function TabPanel({ value, children, className }: TabPanelProps) {
|
||||
const { activeKey } = useContext(TabsContext)
|
||||
|
||||
if (value !== activeKey) return null
|
||||
|
||||
return <div className={clsx('flex-1', className)}>{children}</div>
|
||||
}
|
||||
38
napcat.webui/src/components/tabs/sortable_tab.tsx
Normal file
38
napcat.webui/src/components/tabs/sortable_tab.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
import { useSortable } from '@dnd-kit/sortable'
|
||||
import { CSS } from '@dnd-kit/utilities'
|
||||
|
||||
import { Tab } from '@/components/tabs'
|
||||
import type { TabProps } from '@/components/tabs'
|
||||
|
||||
interface SortableTabProps extends TabProps {
|
||||
id: string
|
||||
}
|
||||
|
||||
export function SortableTab({ id, ...props }: SortableTabProps) {
|
||||
const {
|
||||
attributes,
|
||||
listeners,
|
||||
setNodeRef,
|
||||
transform,
|
||||
transition,
|
||||
isDragging
|
||||
} = useSortable({ id })
|
||||
|
||||
const style = {
|
||||
transform: CSS.Transform.toString(transform),
|
||||
transition,
|
||||
zIndex: isDragging ? 1 : 0,
|
||||
position: 'relative' as const,
|
||||
touchAction: 'none'
|
||||
}
|
||||
|
||||
return (
|
||||
<Tab
|
||||
ref={setNodeRef}
|
||||
style={style}
|
||||
{...attributes}
|
||||
{...listeners}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
}
|
||||
38
napcat.webui/src/components/terminal/terminal-instance.tsx
Normal file
38
napcat.webui/src/components/terminal/terminal-instance.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
import { useEffect, useRef } from 'react'
|
||||
|
||||
import TerminalManager from '@/controllers/terminal_manager'
|
||||
|
||||
import XTerm, { XTermRef } from '../xterm'
|
||||
|
||||
interface TerminalInstanceProps {
|
||||
id: string
|
||||
}
|
||||
|
||||
export function TerminalInstance({ id }: TerminalInstanceProps) {
|
||||
const termRef = useRef<XTermRef>(null)
|
||||
|
||||
useEffect(() => {
|
||||
const handleData = (data: string) => {
|
||||
try {
|
||||
const parsed = JSON.parse(data)
|
||||
if (parsed.data) {
|
||||
termRef.current?.write(parsed.data)
|
||||
}
|
||||
} catch (e) {
|
||||
termRef.current?.write(data)
|
||||
}
|
||||
}
|
||||
|
||||
TerminalManager.connectTerminal(id, handleData)
|
||||
|
||||
return () => {
|
||||
TerminalManager.disconnectTerminal(id, handleData)
|
||||
}
|
||||
}, [id])
|
||||
|
||||
const handleInput = (data: string) => {
|
||||
TerminalManager.sendInput(id, data)
|
||||
}
|
||||
|
||||
return <XTerm ref={termRef} onInput={handleInput} className="w-full h-full" />
|
||||
}
|
||||
12
napcat.webui/src/components/under_construction.tsx
Normal file
12
napcat.webui/src/components/under_construction.tsx
Normal file
@@ -0,0 +1,12 @@
|
||||
export default function UnderConstruction() {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center h-full pt-4">
|
||||
<div className="flex flex-col items-center justify-center space-y-4">
|
||||
<div className="text-6xl font-bold text-gray-500">🚧</div>
|
||||
<div className="text-2xl font-bold text-gray-500">
|
||||
Under Construction
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -22,132 +22,146 @@ export type XTermRef = {
|
||||
clear: () => void
|
||||
}
|
||||
|
||||
const XTerm = forwardRef<XTermRef, React.HTMLAttributes<HTMLDivElement>>(
|
||||
(props, ref) => {
|
||||
const domRef = useRef<HTMLDivElement>(null)
|
||||
const terminalRef = useRef<Terminal | null>(null)
|
||||
const { className, ...rest } = props
|
||||
const { theme } = useTheme()
|
||||
useEffect(() => {
|
||||
if (!domRef.current) {
|
||||
return
|
||||
}
|
||||
const terminal = new Terminal({
|
||||
allowTransparency: true,
|
||||
fontFamily: '"Fira Code", "Harmony", "Noto Serif SC", monospace',
|
||||
cursorInactiveStyle: 'outline',
|
||||
drawBoldTextInBrightColors: false,
|
||||
letterSpacing: 0,
|
||||
lineHeight: 1.0
|
||||
export interface XTermProps
|
||||
extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onInput'> {
|
||||
onInput?: (data: string) => void
|
||||
onKey?: (key: string, event: KeyboardEvent) => void
|
||||
}
|
||||
|
||||
const XTerm = forwardRef<XTermRef, XTermProps>((props, ref) => {
|
||||
const domRef = useRef<HTMLDivElement>(null)
|
||||
const terminalRef = useRef<Terminal | null>(null)
|
||||
const { className, onInput, onKey, ...rest } = props
|
||||
const { theme } = useTheme()
|
||||
useEffect(() => {
|
||||
if (!domRef.current) {
|
||||
return
|
||||
}
|
||||
const terminal = new Terminal({
|
||||
allowTransparency: true,
|
||||
fontFamily: '"Fira Code", "Harmony", "Noto Serif SC", monospace',
|
||||
cursorInactiveStyle: 'outline',
|
||||
drawBoldTextInBrightColors: false
|
||||
})
|
||||
terminalRef.current = terminal
|
||||
const fitAddon = new FitAddon()
|
||||
terminal.loadAddon(
|
||||
new WebLinksAddon((event, uri) => {
|
||||
if (event.ctrlKey) {
|
||||
window.open(uri, '_blank')
|
||||
}
|
||||
})
|
||||
terminalRef.current = terminal
|
||||
const fitAddon = new FitAddon()
|
||||
terminal.loadAddon(
|
||||
new WebLinksAddon((event, uri) => {
|
||||
if (event.ctrlKey) {
|
||||
window.open(uri, '_blank')
|
||||
}
|
||||
)
|
||||
terminal.loadAddon(fitAddon)
|
||||
terminal.loadAddon(new WebglAddon())
|
||||
terminal.open(domRef.current)
|
||||
|
||||
terminal.writeln(
|
||||
gradientText(
|
||||
'Welcome to NapCat WebUI',
|
||||
[255, 0, 0],
|
||||
[0, 255, 0],
|
||||
true,
|
||||
true,
|
||||
true
|
||||
)
|
||||
)
|
||||
|
||||
terminal.onData((data) => {
|
||||
if (onInput) {
|
||||
onInput(data)
|
||||
}
|
||||
})
|
||||
|
||||
terminal.onKey((event) => {
|
||||
if (onKey) {
|
||||
onKey(event.key, event.domEvent)
|
||||
}
|
||||
})
|
||||
|
||||
const resizeObserver = new ResizeObserver(() => {
|
||||
fitAddon.fit()
|
||||
})
|
||||
|
||||
// 字体加载完成后重新调整终端大小
|
||||
document.fonts.ready.then(() => {
|
||||
fitAddon.fit()
|
||||
|
||||
resizeObserver.observe(domRef.current!)
|
||||
})
|
||||
|
||||
return () => {
|
||||
resizeObserver.disconnect()
|
||||
setTimeout(() => {
|
||||
terminal.dispose()
|
||||
}, 0)
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (terminalRef.current) {
|
||||
terminalRef.current.options.theme = {
|
||||
background: theme === 'dark' ? '#00000000' : '#ffffff00',
|
||||
foreground: theme === 'dark' ? '#fff' : '#000',
|
||||
selectionBackground:
|
||||
theme === 'dark'
|
||||
? 'rgba(179, 0, 0, 0.3)'
|
||||
: 'rgba(255, 167, 167, 0.3)',
|
||||
cursor: theme === 'dark' ? '#fff' : '#000',
|
||||
cursorAccent: theme === 'dark' ? '#000' : '#fff',
|
||||
black: theme === 'dark' ? '#fff' : '#000'
|
||||
}
|
||||
terminalRef.current.options.fontWeight =
|
||||
theme === 'dark' ? 'normal' : '600'
|
||||
terminalRef.current.options.fontWeightBold =
|
||||
theme === 'dark' ? 'bold' : '900'
|
||||
}
|
||||
}, [theme])
|
||||
|
||||
useImperativeHandle(
|
||||
ref,
|
||||
() => ({
|
||||
write: (...args) => {
|
||||
return terminalRef.current?.write(...args)
|
||||
},
|
||||
writeAsync: async (data) => {
|
||||
return new Promise((resolve) => {
|
||||
terminalRef.current?.write(data, resolve)
|
||||
})
|
||||
)
|
||||
terminal.loadAddon(fitAddon)
|
||||
terminal.loadAddon(new WebglAddon())
|
||||
terminal.open(domRef.current)
|
||||
|
||||
terminal.writeln(
|
||||
gradientText(
|
||||
'Welcome to NapCat WebUI',
|
||||
[255, 0, 0],
|
||||
[0, 255, 0],
|
||||
true,
|
||||
true,
|
||||
true
|
||||
)
|
||||
)
|
||||
|
||||
const resizeObserver = new ResizeObserver(() => {
|
||||
fitAddon.fit()
|
||||
})
|
||||
|
||||
// 字体加载完成后重新调整终端大小
|
||||
document.fonts.ready.then(() => {
|
||||
fitAddon.fit()
|
||||
|
||||
resizeObserver.observe(domRef.current!)
|
||||
})
|
||||
|
||||
return () => {
|
||||
resizeObserver.disconnect()
|
||||
setTimeout(() => {
|
||||
terminal.dispose()
|
||||
}, 0)
|
||||
},
|
||||
writeln: (...args) => {
|
||||
return terminalRef.current?.writeln(...args)
|
||||
},
|
||||
writelnAsync: async (data) => {
|
||||
return new Promise((resolve) => {
|
||||
terminalRef.current?.writeln(data, resolve)
|
||||
})
|
||||
},
|
||||
clear: () => {
|
||||
terminalRef.current?.clear()
|
||||
}
|
||||
}, [])
|
||||
}),
|
||||
[]
|
||||
)
|
||||
|
||||
useEffect(() => {
|
||||
if (terminalRef.current) {
|
||||
terminalRef.current.options.theme = {
|
||||
background: theme === 'dark' ? '#00000000' : '#ffffff00',
|
||||
foreground: theme === 'dark' ? '#fff' : '#000',
|
||||
selectionBackground:
|
||||
theme === 'dark'
|
||||
? 'rgba(179, 0, 0, 0.3)'
|
||||
: 'rgba(255, 167, 167, 0.3)',
|
||||
cursor: theme === 'dark' ? '#fff' : '#000',
|
||||
cursorAccent: theme === 'dark' ? '#000' : '#fff',
|
||||
black: theme === 'dark' ? '#fff' : '#000'
|
||||
}
|
||||
terminalRef.current.options.fontWeight =
|
||||
theme === 'dark' ? 'normal' : '600'
|
||||
terminalRef.current.options.fontWeightBold =
|
||||
theme === 'dark' ? 'bold' : '900'
|
||||
}
|
||||
}, [theme])
|
||||
|
||||
useImperativeHandle(
|
||||
ref,
|
||||
() => ({
|
||||
write: (...args) => {
|
||||
return terminalRef.current?.write(...args)
|
||||
},
|
||||
writeAsync: async (data) => {
|
||||
return new Promise((resolve) => {
|
||||
terminalRef.current?.write(data, resolve)
|
||||
})
|
||||
},
|
||||
writeln: (...args) => {
|
||||
return terminalRef.current?.writeln(...args)
|
||||
},
|
||||
writelnAsync: async (data) => {
|
||||
return new Promise((resolve) => {
|
||||
terminalRef.current?.writeln(data, resolve)
|
||||
})
|
||||
},
|
||||
clear: () => {
|
||||
terminalRef.current?.clear()
|
||||
}
|
||||
}),
|
||||
[]
|
||||
)
|
||||
|
||||
return (
|
||||
return (
|
||||
<div
|
||||
className={clsx(
|
||||
'p-2 rounded-md shadow-sm border border-default-200 w-full h-full overflow-hidden bg-opacity-50 backdrop-blur-sm',
|
||||
theme === 'dark' ? 'bg-black' : 'bg-white',
|
||||
className
|
||||
)}
|
||||
{...rest}
|
||||
>
|
||||
<div
|
||||
className={clsx(
|
||||
'p-2 rounded-md shadow-sm border border-default-200 w-full h-full overflow-hidden bg-opacity-50 backdrop-blur-sm',
|
||||
theme === 'dark' ? 'bg-black' : 'bg-white',
|
||||
className
|
||||
)}
|
||||
{...rest}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
width: '100%',
|
||||
height: '100%'
|
||||
}}
|
||||
ref={domRef}
|
||||
></div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
)
|
||||
style={{
|
||||
width: '100%',
|
||||
height: '100%'
|
||||
}}
|
||||
ref={domRef}
|
||||
></div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
export default XTerm
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
import {
|
||||
BugIcon2,
|
||||
FileIcon,
|
||||
InfoIcon,
|
||||
LogIcon,
|
||||
RouteIcon,
|
||||
SettingsIcon,
|
||||
SignalTowerIcon,
|
||||
@@ -49,10 +51,10 @@ export const siteConfig = {
|
||||
href: '/config'
|
||||
},
|
||||
{
|
||||
label: '系统日志',
|
||||
label: 'NapCat日志',
|
||||
icon: (
|
||||
<div className="w-5 h-5">
|
||||
<TerminalIcon />
|
||||
<LogIcon />
|
||||
</div>
|
||||
),
|
||||
href: '/logs'
|
||||
@@ -75,6 +77,24 @@ export const siteConfig = {
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: '文件管理',
|
||||
icon: (
|
||||
<div className="w-5 h-5">
|
||||
<FileIcon />
|
||||
</div>
|
||||
),
|
||||
href: '/file_manager'
|
||||
},
|
||||
{
|
||||
label: '系统终端',
|
||||
icon: (
|
||||
<div className="w-5 h-5">
|
||||
<TerminalIcon />
|
||||
</div>
|
||||
),
|
||||
href: '/terminal'
|
||||
},
|
||||
{
|
||||
label: '关于我们',
|
||||
icon: (
|
||||
|
||||
98
napcat.webui/src/controllers/file_manager.ts
Normal file
98
napcat.webui/src/controllers/file_manager.ts
Normal file
@@ -0,0 +1,98 @@
|
||||
import { serverRequest } from '@/utils/request'
|
||||
|
||||
export interface FileInfo {
|
||||
name: string
|
||||
isDirectory: boolean
|
||||
size: number
|
||||
mtime: Date
|
||||
}
|
||||
|
||||
export default class FileManager {
|
||||
public static async listFiles(path: string = '/') {
|
||||
const { data } = await serverRequest.get<ServerResponse<FileInfo[]>>(
|
||||
`/File/list?path=${encodeURIComponent(path)}`
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
// 新增：按目录获取
|
||||
public static async listDirectories(path: string = '/') {
|
||||
const { data } = await serverRequest.get<ServerResponse<FileInfo[]>>(
|
||||
`/File/list?path=${encodeURIComponent(path)}&onlyDirectory=true`
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async createDirectory(path: string): Promise<boolean> {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/mkdir',
|
||||
{ path }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async delete(path: string) {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/delete',
|
||||
{ path }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async readFile(path: string) {
|
||||
const { data } = await serverRequest.get<ServerResponse<string>>(
|
||||
`/File/read?path=${encodeURIComponent(path)}`
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async writeFile(path: string, content: string) {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/write',
|
||||
{ path, content }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async createFile(path: string): Promise<boolean> {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/create',
|
||||
{ path }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async batchDelete(paths: string[]) {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/batchDelete',
|
||||
{ paths }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async rename(oldPath: string, newPath: string) {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/rename',
|
||||
{ oldPath, newPath }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async move(sourcePath: string, targetPath: string) {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/move',
|
||||
{ sourcePath, targetPath }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
public static async batchMove(
|
||||
items: { sourcePath: string; targetPath: string }[]
|
||||
) {
|
||||
const { data } = await serverRequest.post<ServerResponse<boolean>>(
|
||||
'/File/batchMove',
|
||||
{ items }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
}
|
||||
118
napcat.webui/src/controllers/terminal_manager.ts
Normal file
118
napcat.webui/src/controllers/terminal_manager.ts
Normal file
@@ -0,0 +1,118 @@
|
||||
import { serverRequest } from '@/utils/request'
|
||||
|
||||
type TerminalCallback = (data: string) => void
|
||||
|
||||
interface TerminalConnection {
|
||||
ws: WebSocket
|
||||
callbacks: Set<TerminalCallback>
|
||||
isConnected: boolean
|
||||
buffer: string[] // 添加缓存数组
|
||||
}
|
||||
|
||||
export interface TerminalSession {
|
||||
id: string
|
||||
}
|
||||
|
||||
export interface TerminalInfo {
|
||||
id: string
|
||||
}
|
||||
|
||||
class TerminalManager {
|
||||
private connections: Map<string, TerminalConnection> = new Map()
|
||||
private readonly MAX_BUFFER_SIZE = 1000 // 限制缓存大小
|
||||
|
||||
async createTerminal(cols: number, rows: number): Promise<TerminalSession> {
|
||||
const { data } = await serverRequest.post<ServerResponse<TerminalSession>>(
|
||||
'/Log/terminal/create',
|
||||
{ cols, rows }
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
async closeTerminal(id: string): Promise<void> {
|
||||
await serverRequest.post(`/Log/terminal/${id}/close`)
|
||||
}
|
||||
|
||||
async getTerminalList(): Promise<TerminalInfo[]> {
|
||||
const { data } =
|
||||
await serverRequest.get<ServerResponse<TerminalInfo[]>>(
|
||||
'/Log/terminal/list'
|
||||
)
|
||||
return data.data
|
||||
}
|
||||
|
||||
connectTerminal(id: string, callback: TerminalCallback): WebSocket {
|
||||
let conn = this.connections.get(id)
|
||||
|
||||
if (!conn) {
|
||||
const url = new URL(window.location.href)
|
||||
url.protocol = url.protocol.replace('http', 'ws')
|
||||
url.pathname = `/api/ws/terminal`
|
||||
url.searchParams.set('id', id)
|
||||
const token = JSON.parse(localStorage.getItem('token') || '')
|
||||
if (!token) {
|
||||
throw new Error('No token found')
|
||||
}
|
||||
url.searchParams.set('token', token)
|
||||
const ws = new WebSocket(url.toString())
|
||||
conn = {
|
||||
ws,
|
||||
callbacks: new Set([callback]),
|
||||
isConnected: false,
|
||||
buffer: [] // 初始化缓存
|
||||
}
|
||||
|
||||
ws.onmessage = (event) => {
|
||||
const data = event.data
|
||||
// 保存到缓存
|
||||
conn?.buffer.push(data)
|
||||
if ((conn?.buffer.length ?? 0) > this.MAX_BUFFER_SIZE) {
|
||||
conn?.buffer.shift()
|
||||
}
|
||||
conn?.callbacks.forEach((cb) => cb(data))
|
||||
}
|
||||
|
||||
ws.onopen = () => {
|
||||
if (conn) conn.isConnected = true
|
||||
}
|
||||
|
||||
ws.onclose = () => {
|
||||
if (conn) conn.isConnected = false
|
||||
}
|
||||
|
||||
this.connections.set(id, conn)
|
||||
} else {
|
||||
conn.callbacks.add(callback)
|
||||
// 恢复历史内容
|
||||
conn.buffer.forEach((data) => callback(data))
|
||||
}
|
||||
|
||||
return conn.ws
|
||||
}
|
||||
|
||||
disconnectTerminal(id: string, callback: TerminalCallback) {
|
||||
const conn = this.connections.get(id)
|
||||
if (!conn) return
|
||||
|
||||
conn.callbacks.delete(callback)
|
||||
}
|
||||
|
||||
removeTerminal(id: string) {
|
||||
const conn = this.connections.get(id)
|
||||
if (conn?.ws.readyState === WebSocket.OPEN) {
|
||||
conn.ws.close()
|
||||
}
|
||||
this.connections.delete(id)
|
||||
}
|
||||
|
||||
sendInput(id: string, data: string) {
|
||||
const conn = this.connections.get(id)
|
||||
if (conn?.ws.readyState === WebSocket.OPEN) {
|
||||
conn.ws.send(JSON.stringify({ type: 'input', data }))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const terminalManager = new TerminalManager()
|
||||
|
||||
export default terminalManager
|
||||
@@ -9,6 +9,14 @@ export interface Log {
|
||||
message: string
|
||||
}
|
||||
|
||||
export interface TerminalSession {
|
||||
id: string
|
||||
}
|
||||
|
||||
export interface TerminalInfo {
|
||||
id: string
|
||||
}
|
||||
|
||||
export default class WebUIManager {
|
||||
public static async checkWebUiLogined() {
|
||||
const { data } =
|
||||
|
||||
433
napcat.webui/src/pages/dashboard/file_manager.tsx
Normal file
433
napcat.webui/src/pages/dashboard/file_manager.tsx
Normal file
@@ -0,0 +1,433 @@
|
||||
import { BreadcrumbItem, Breadcrumbs } from '@heroui/breadcrumbs'
|
||||
import { Button } from '@heroui/button'
|
||||
import { Input } from '@heroui/input'
|
||||
import type { Selection, SortDescriptor } from '@react-types/shared'
|
||||
import path from 'path-browserify'
|
||||
import { useEffect, useState } from 'react'
|
||||
import toast from 'react-hot-toast'
|
||||
import { FiMove, FiPlus } from 'react-icons/fi'
|
||||
import { MdRefresh } from 'react-icons/md'
|
||||
import { TbTrash } from 'react-icons/tb'
|
||||
import { TiArrowBack } from 'react-icons/ti'
|
||||
import { useLocation, useNavigate } from 'react-router-dom'
|
||||
|
||||
import CreateFileModal from '@/components/file_manage/create_file_modal'
|
||||
import FileEditModal from '@/components/file_manage/file_edit_modal'
|
||||
import FileTable from '@/components/file_manage/file_table'
|
||||
import MoveModal from '@/components/file_manage/move_modal'
|
||||
import RenameModal from '@/components/file_manage/rename_modal'
|
||||
|
||||
import useDialog from '@/hooks/use-dialog'
|
||||
|
||||
import FileManager, { FileInfo } from '@/controllers/file_manager'
|
||||
|
||||
export default function FileManagerPage() {
|
||||
const [files, setFiles] = useState<FileInfo[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [sortDescriptor, setSortDescriptor] = useState<SortDescriptor>({
|
||||
column: 'name',
|
||||
direction: 'ascending'
|
||||
})
|
||||
const dialog = useDialog()
|
||||
const location = useLocation()
|
||||
const navigate = useNavigate()
|
||||
// 修改 currentPath 初始化逻辑，去掉可能的前导斜杠
|
||||
let currentPath = decodeURIComponent(location.hash.slice(1) || '/')
|
||||
if (/^\/[A-Z]:$/i.test(currentPath)) {
|
||||
currentPath = currentPath.slice(1)
|
||||
}
|
||||
const [editingFile, setEditingFile] = useState<{
|
||||
path: string
|
||||
content: string
|
||||
} | null>(null)
|
||||
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false)
|
||||
const [newFileName, setNewFileName] = useState('')
|
||||
const [fileType, setFileType] = useState<'file' | 'directory'>('file')
|
||||
const [selectedFiles, setSelectedFiles] = useState<Selection>(new Set())
|
||||
const [isRenameModalOpen, setIsRenameModalOpen] = useState(false)
|
||||
const [isMoveModalOpen, setIsMoveModalOpen] = useState(false)
|
||||
const [renamingFile, setRenamingFile] = useState<string>('')
|
||||
const [moveTargetPath, setMoveTargetPath] = useState('')
|
||||
const [jumpPath, setJumpPath] = useState('')
|
||||
|
||||
const sortFiles = (files: FileInfo[], descriptor: typeof sortDescriptor) => {
|
||||
return [...files].sort((a, b) => {
|
||||
if (a.isDirectory !== b.isDirectory) return a.isDirectory ? -1 : 1
|
||||
const direction = descriptor.direction === 'ascending' ? 1 : -1
|
||||
switch (descriptor.column) {
|
||||
case 'name':
|
||||
return direction * a.name.localeCompare(b.name)
|
||||
case 'type': {
|
||||
const aType = a.isDirectory ? '目录' : '文件'
|
||||
const bType = a.isDirectory ? '目录' : '文件'
|
||||
return direction * aType.localeCompare(bType)
|
||||
}
|
||||
case 'size':
|
||||
return direction * ((a.size || 0) - (b.size || 0))
|
||||
case 'mtime':
|
||||
return (
|
||||
direction *
|
||||
(new Date(a.mtime).getTime() - new Date(b.mtime).getTime())
|
||||
)
|
||||
default:
|
||||
return 0
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const loadFiles = async () => {
|
||||
setLoading(true)
|
||||
try {
|
||||
const fileList = await FileManager.listFiles(currentPath)
|
||||
setFiles(sortFiles(fileList, sortDescriptor))
|
||||
} catch (error) {
|
||||
toast.error('加载文件列表失败')
|
||||
setFiles([])
|
||||
}
|
||||
setLoading(false)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
loadFiles()
|
||||
}, [currentPath])
|
||||
|
||||
const handleSortChange = (descriptor: typeof sortDescriptor) => {
|
||||
setSortDescriptor(descriptor)
|
||||
setFiles((prev) => sortFiles(prev, descriptor))
|
||||
}
|
||||
|
||||
const handleDirectoryClick = (dirPath: string) => {
|
||||
if (dirPath === '..') {
|
||||
if (/^[A-Z]:$/i.test(currentPath)) {
|
||||
navigate('/file_manager#/')
|
||||
return
|
||||
}
|
||||
const parentPath = path.dirname(currentPath)
|
||||
navigate(
|
||||
`/file_manager#${encodeURIComponent(parentPath === currentPath ? '/' : parentPath)}`
|
||||
)
|
||||
return
|
||||
}
|
||||
navigate(
|
||||
`/file_manager#${encodeURIComponent(path.join(currentPath, dirPath))}`
|
||||
)
|
||||
}
|
||||
|
||||
const handleEdit = async (filePath: string) => {
|
||||
try {
|
||||
const content = await FileManager.readFile(filePath)
|
||||
setEditingFile({ path: filePath, content })
|
||||
} catch (error) {
|
||||
toast.error('打开文件失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleSave = async () => {
|
||||
if (!editingFile) return
|
||||
try {
|
||||
await FileManager.writeFile(editingFile.path, editingFile.content)
|
||||
toast.success('保存成功')
|
||||
setEditingFile(null)
|
||||
loadFiles()
|
||||
} catch (error) {
|
||||
toast.error('保存失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleDelete = async (filePath: string) => {
|
||||
dialog.confirm({
|
||||
title: '删除文件',
|
||||
content: <div>确定要删除文件 {filePath} 吗？</div>,
|
||||
onConfirm: async () => {
|
||||
try {
|
||||
await FileManager.delete(filePath)
|
||||
toast.success('删除成功')
|
||||
loadFiles()
|
||||
} catch (error) {
|
||||
toast.error('删除失败')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const handleCreate = async () => {
|
||||
if (!newFileName) return
|
||||
const newPath = path.join(currentPath, newFileName)
|
||||
try {
|
||||
if (fileType === 'directory') {
|
||||
if (!(await FileManager.createDirectory(newPath))) {
|
||||
toast.error('目录已存在')
|
||||
return
|
||||
}
|
||||
} else {
|
||||
if (!(await FileManager.createFile(newPath))) {
|
||||
toast.error('文件已存在')
|
||||
return
|
||||
}
|
||||
}
|
||||
toast.success('创建成功')
|
||||
setIsCreateModalOpen(false)
|
||||
setNewFileName('')
|
||||
loadFiles()
|
||||
} catch (error) {
|
||||
toast.error((error as Error)?.message || '创建失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleBatchDelete = async () => {
|
||||
const selectedArray =
|
||||
selectedFiles instanceof Set
|
||||
? Array.from(selectedFiles)
|
||||
: files.map((f) => f.name)
|
||||
if (selectedArray.length === 0) return
|
||||
dialog.confirm({
|
||||
title: '批量删除',
|
||||
content: <div>确定要删除选中的 {selectedArray.length} 个项目吗？</div>,
|
||||
onConfirm: async () => {
|
||||
try {
|
||||
const paths = selectedArray.map((key) =>
|
||||
path.join(currentPath, key.toString())
|
||||
)
|
||||
await FileManager.batchDelete(paths)
|
||||
toast.success('批量删除成功')
|
||||
setSelectedFiles(new Set())
|
||||
loadFiles()
|
||||
} catch (error) {
|
||||
toast.error('批量删除失败')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const handleRename = async () => {
|
||||
if (!renamingFile || !newFileName) return
|
||||
try {
|
||||
await FileManager.rename(
|
||||
path.join(currentPath, renamingFile),
|
||||
path.join(currentPath, newFileName)
|
||||
)
|
||||
toast.success('重命名成功')
|
||||
setIsRenameModalOpen(false)
|
||||
setRenamingFile('')
|
||||
setNewFileName('')
|
||||
loadFiles()
|
||||
} catch (error) {
|
||||
toast.error('重命名失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleMove = async (sourceName: string) => {
|
||||
if (!moveTargetPath) return
|
||||
try {
|
||||
await FileManager.move(
|
||||
path.join(currentPath, sourceName),
|
||||
path.join(moveTargetPath, sourceName)
|
||||
)
|
||||
toast.success('移动成功')
|
||||
setIsMoveModalOpen(false)
|
||||
setMoveTargetPath('')
|
||||
loadFiles()
|
||||
} catch (error) {
|
||||
toast.error('移动失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleBatchMove = async () => {
|
||||
if (!moveTargetPath) return
|
||||
const selectedArray =
|
||||
selectedFiles instanceof Set
|
||||
? Array.from(selectedFiles)
|
||||
: files.map((f) => f.name)
|
||||
if (selectedArray.length === 0) return
|
||||
try {
|
||||
const items = selectedArray.map((name) => ({
|
||||
sourcePath: path.join(currentPath, name.toString()),
|
||||
targetPath: path.join(moveTargetPath, name.toString())
|
||||
}))
|
||||
await FileManager.batchMove(items)
|
||||
toast.success('批量移动成功')
|
||||
setIsMoveModalOpen(false)
|
||||
setMoveTargetPath('')
|
||||
setSelectedFiles(new Set())
|
||||
loadFiles()
|
||||
} catch (error) {
|
||||
toast.error('批量移动失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleCopyPath = (fileName: string) => {
|
||||
navigator.clipboard.writeText(path.join(currentPath, fileName))
|
||||
toast.success('路径已复制')
|
||||
}
|
||||
|
||||
const handleMoveClick = (fileName: string) => {
|
||||
setRenamingFile(fileName)
|
||||
setMoveTargetPath('')
|
||||
setIsMoveModalOpen(true)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="p-4">
|
||||
<div className="mb-4 flex items-center gap-4 sticky top-14 z-10 bg-content1 py-1">
|
||||
<Button
|
||||
color="danger"
|
||||
size="sm"
|
||||
isIconOnly
|
||||
variant="flat"
|
||||
onPress={() => handleDirectoryClick('..')}
|
||||
className="text-lg"
|
||||
>
|
||||
<TiArrowBack />
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
color="danger"
|
||||
size="sm"
|
||||
isIconOnly
|
||||
variant="flat"
|
||||
onPress={() => setIsCreateModalOpen(true)}
|
||||
className="text-lg"
|
||||
>
|
||||
<FiPlus />
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
color="danger"
|
||||
isLoading={loading}
|
||||
size="sm"
|
||||
isIconOnly
|
||||
variant="flat"
|
||||
onPress={loadFiles}
|
||||
className="text-lg"
|
||||
>
|
||||
<MdRefresh />
|
||||
</Button>
|
||||
{((selectedFiles instanceof Set && selectedFiles.size > 0) ||
|
||||
selectedFiles === 'all') && (
|
||||
<>
|
||||
<Button
|
||||
color="danger"
|
||||
size="sm"
|
||||
variant="flat"
|
||||
onPress={handleBatchDelete}
|
||||
className="text-sm"
|
||||
startContent={<TbTrash className="text-lg" />}
|
||||
>
|
||||
(
|
||||
{selectedFiles instanceof Set ? selectedFiles.size : files.length}
|
||||
)
|
||||
</Button>
|
||||
<Button
|
||||
color="danger"
|
||||
size="sm"
|
||||
variant="flat"
|
||||
onPress={() => {
|
||||
setMoveTargetPath('')
|
||||
setIsMoveModalOpen(true)
|
||||
}}
|
||||
className="text-sm"
|
||||
startContent={<FiMove className="text-lg" />}
|
||||
>
|
||||
(
|
||||
{selectedFiles instanceof Set ? selectedFiles.size : files.length}
|
||||
)
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
<Breadcrumbs className="flex-1 shadow-small px-2 py-2 rounded-lg">
|
||||
{currentPath.split('/').map((part, index, parts) => (
|
||||
<BreadcrumbItem
|
||||
key={part}
|
||||
isCurrent={index === parts.length - 1}
|
||||
onPress={() => {
|
||||
const newPath = parts.slice(0, index + 1).join('/')
|
||||
navigate(`/file_manager#${encodeURIComponent(newPath)}`)
|
||||
}}
|
||||
>
|
||||
{part}
|
||||
</BreadcrumbItem>
|
||||
))}
|
||||
</Breadcrumbs>
|
||||
<Input
|
||||
type="text"
|
||||
placeholder="输入跳转路径"
|
||||
value={jumpPath}
|
||||
onChange={(e) => setJumpPath(e.target.value)}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' && jumpPath.trim() !== '') {
|
||||
navigate(`/file_manager#${encodeURIComponent(jumpPath.trim())}`)
|
||||
}
|
||||
}}
|
||||
className="ml-auto w-64"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<FileTable
|
||||
files={files}
|
||||
currentPath={currentPath}
|
||||
loading={loading}
|
||||
sortDescriptor={sortDescriptor}
|
||||
onSortChange={handleSortChange}
|
||||
selectedFiles={selectedFiles}
|
||||
onSelectionChange={setSelectedFiles}
|
||||
onDirectoryClick={handleDirectoryClick}
|
||||
onEdit={handleEdit}
|
||||
onRenameRequest={(name) => {
|
||||
setRenamingFile(name)
|
||||
setNewFileName(name)
|
||||
setIsRenameModalOpen(true)
|
||||
}}
|
||||
onMoveRequest={handleMoveClick}
|
||||
onCopyPath={handleCopyPath}
|
||||
onDelete={handleDelete}
|
||||
/>
|
||||
|
||||
<FileEditModal
|
||||
isOpen={!!editingFile}
|
||||
file={editingFile}
|
||||
onClose={() => setEditingFile(null)}
|
||||
onSave={handleSave}
|
||||
onContentChange={(newContent) =>
|
||||
setEditingFile((prev) =>
|
||||
prev ? { ...prev, content: newContent ?? '' } : null
|
||||
)
|
||||
}
|
||||
/>
|
||||
|
||||
<CreateFileModal
|
||||
isOpen={isCreateModalOpen}
|
||||
fileType={fileType}
|
||||
newFileName={newFileName}
|
||||
onTypeChange={setFileType}
|
||||
onNameChange={(e) => setNewFileName(e.target.value)}
|
||||
onClose={() => setIsCreateModalOpen(false)}
|
||||
onCreate={handleCreate}
|
||||
/>
|
||||
|
||||
<RenameModal
|
||||
isOpen={isRenameModalOpen}
|
||||
newFileName={newFileName}
|
||||
onNameChange={(e) => setNewFileName(e.target.value)}
|
||||
onClose={() => setIsRenameModalOpen(false)}
|
||||
onRename={handleRename}
|
||||
/>
|
||||
|
||||
<MoveModal
|
||||
isOpen={isMoveModalOpen}
|
||||
moveTargetPath={moveTargetPath}
|
||||
selectionInfo={
|
||||
selectedFiles instanceof Set && selectedFiles.size > 0
|
||||
? `${selectedFiles.size} 个项目`
|
||||
: renamingFile
|
||||
}
|
||||
onClose={() => setIsMoveModalOpen(false)}
|
||||
onMove={() =>
|
||||
selectedFiles instanceof Set && selectedFiles.size > 0
|
||||
? handleBatchMove()
|
||||
: handleMove(renamingFile)
|
||||
}
|
||||
onSelect={(dir) => setMoveTargetPath(dir)} // 替换原有 onTargetChange
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
171
napcat.webui/src/pages/dashboard/terminal.tsx
Normal file
171
napcat.webui/src/pages/dashboard/terminal.tsx
Normal file
@@ -0,0 +1,171 @@
|
||||
import {
|
||||
DndContext,
|
||||
DragEndEvent,
|
||||
PointerSensor,
|
||||
closestCenter,
|
||||
useSensor,
|
||||
useSensors
|
||||
} from '@dnd-kit/core'
|
||||
import {
|
||||
SortableContext,
|
||||
arrayMove,
|
||||
horizontalListSortingStrategy
|
||||
} from '@dnd-kit/sortable'
|
||||
import { Button } from '@heroui/button'
|
||||
import { useEffect, useState } from 'react'
|
||||
import toast from 'react-hot-toast'
|
||||
import { IoAdd, IoClose } from 'react-icons/io5'
|
||||
|
||||
import { TabList, TabPanel, Tabs } from '@/components/tabs'
|
||||
import { SortableTab } from '@/components/tabs/sortable_tab.tsx'
|
||||
import { TerminalInstance } from '@/components/terminal/terminal-instance'
|
||||
|
||||
import terminalManager from '@/controllers/terminal_manager'
|
||||
|
||||
interface TerminalTab {
|
||||
id: string
|
||||
title: string
|
||||
}
|
||||
|
||||
export default function TerminalPage() {
|
||||
const [tabs, setTabs] = useState<TerminalTab[]>([])
|
||||
const [selectedTab, setSelectedTab] = useState<string>('')
|
||||
|
||||
useEffect(() => {
|
||||
// 获取已存在的终端列表
|
||||
terminalManager.getTerminalList().then((terminals) => {
|
||||
if (terminals.length === 0) return
|
||||
|
||||
const newTabs = terminals.map((terminal) => ({
|
||||
id: terminal.id,
|
||||
title: terminal.id
|
||||
}))
|
||||
|
||||
setTabs(newTabs)
|
||||
setSelectedTab(newTabs[0].id)
|
||||
})
|
||||
}, [])
|
||||
|
||||
const createNewTerminal = async () => {
|
||||
try {
|
||||
const { id } = await terminalManager.createTerminal(80, 24)
|
||||
const newTab = {
|
||||
id,
|
||||
title: id
|
||||
}
|
||||
|
||||
setTabs((prev) => [...prev, newTab])
|
||||
setSelectedTab(id)
|
||||
} catch (error) {
|
||||
console.error('Failed to create terminal:', error)
|
||||
toast.error('创建终端失败')
|
||||
}
|
||||
}
|
||||
|
||||
const closeTerminal = async (id: string) => {
|
||||
try {
|
||||
await terminalManager.closeTerminal(id)
|
||||
terminalManager.removeTerminal(id)
|
||||
if (selectedTab === id) {
|
||||
const previousIndex = tabs.findIndex((tab) => tab.id === id) - 1
|
||||
if (previousIndex >= 0) {
|
||||
setSelectedTab(tabs[previousIndex].id)
|
||||
} else {
|
||||
setSelectedTab(tabs[0]?.id || '')
|
||||
}
|
||||
}
|
||||
setTabs((prev) => prev.filter((tab) => tab.id !== id))
|
||||
} catch (error) {
|
||||
toast.error('关闭终端失败')
|
||||
}
|
||||
}
|
||||
|
||||
const handleDragEnd = (event: DragEndEvent) => {
|
||||
const { active, over } = event
|
||||
if (active.id !== over?.id) {
|
||||
setTabs((items) => {
|
||||
const oldIndex = items.findIndex((item) => item.id === active.id)
|
||||
const newIndex = items.findIndex((item) => item.id === over?.id)
|
||||
return arrayMove(items, oldIndex, newIndex)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const sensors = useSensors(
|
||||
useSensor(PointerSensor, {
|
||||
activationConstraint: {
|
||||
distance: 8
|
||||
}
|
||||
})
|
||||
)
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-2 p-4">
|
||||
<DndContext
|
||||
sensors={sensors}
|
||||
collisionDetection={closestCenter}
|
||||
onDragEnd={handleDragEnd}
|
||||
>
|
||||
<Tabs
|
||||
activeKey={selectedTab}
|
||||
onChange={setSelectedTab}
|
||||
className="h-full overflow-hidden"
|
||||
>
|
||||
<div className="flex items-center gap-2 flex-shrink-0 flex-grow-0">
|
||||
<TabList className="flex-1 !overflow-x-auto w-full hide-scrollbar">
|
||||
<SortableContext
|
||||
items={tabs}
|
||||
strategy={horizontalListSortingStrategy}
|
||||
>
|
||||
{tabs.map((tab) => (
|
||||
<SortableTab
|
||||
key={tab.id}
|
||||
id={tab.id}
|
||||
value={tab.id}
|
||||
isSelected={selectedTab === tab.id}
|
||||
className="flex gap-2 items-center flex-shrink-0"
|
||||
>
|
||||
{tab.title}
|
||||
<Button
|
||||
isIconOnly
|
||||
radius="full"
|
||||
variant="flat"
|
||||
size="sm"
|
||||
className="min-w-0 w-4 h-4 flex-shrink-0"
|
||||
onPress={() => closeTerminal(tab.id)}
|
||||
color={selectedTab === tab.id ? 'danger' : 'default'}
|
||||
>
|
||||
<IoClose />
|
||||
</Button>
|
||||
</SortableTab>
|
||||
))}
|
||||
</SortableContext>
|
||||
</TabList>
|
||||
<Button
|
||||
isIconOnly
|
||||
color="danger"
|
||||
size="sm"
|
||||
variant="flat"
|
||||
onPress={createNewTerminal}
|
||||
startContent={<IoAdd />}
|
||||
className="text-xl"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex-grow overflow-hidden">
|
||||
{tabs.length === 0 && (
|
||||
<div className="flex flex-col gap-2 items-center justify-center h-full text-gray-500 py-5">
|
||||
<IoAdd className="text-4xl" />
|
||||
<div className="text-sm">点击右上角按钮创建终端</div>
|
||||
</div>
|
||||
)}
|
||||
{tabs.map((tab) => (
|
||||
<TabPanel key={tab.id} value={tab.id} className="h-full">
|
||||
<TerminalInstance id={tab.id} />
|
||||
</TabPanel>
|
||||
))}
|
||||
</div>
|
||||
</Tabs>
|
||||
</DndContext>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -9,8 +9,10 @@ import ConfigPage from './dashboard/config'
|
||||
import DebugPage from './dashboard/debug'
|
||||
import HttpDebug from './dashboard/debug/http'
|
||||
import WSDebug from './dashboard/debug/websocket'
|
||||
import FileManagerPage from './dashboard/file_manager'
|
||||
import LogsPage from './dashboard/logs'
|
||||
import NetworkPage from './dashboard/network'
|
||||
import TerminalPage from './dashboard/terminal'
|
||||
|
||||
export default function IndexPage() {
|
||||
const location = useLocation()
|
||||
@@ -33,6 +35,8 @@ export default function IndexPage() {
|
||||
<Route path="ws" element={<WSDebug />} />
|
||||
<Route path="http" element={<HttpDebug />} />
|
||||
</Route>
|
||||
<Route element={<FileManagerPage />} path="/file_manager" />
|
||||
<Route element={<TerminalPage />} path="/terminal" />
|
||||
<Route element={<AboutPage />} path="/about" />
|
||||
</Routes>
|
||||
</motion.div>
|
||||
|
||||
@@ -35,6 +35,20 @@ body {
|
||||
.font-noto-serif {
|
||||
font-family: 'Noto Serif SC', serif;
|
||||
}
|
||||
.hide-scrollbar::-webkit-scrollbar {
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
}
|
||||
.hide-scrollbar::-webkit-scrollbar-thumb {
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.hide-scrollbar::-webkit-scrollbar-track {
|
||||
width: 0 !important;
|
||||
height: 0 !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
|
||||
@@ -29,6 +29,11 @@ export default defineConfig(({ mode }) => {
|
||||
base: '/webui/',
|
||||
server: {
|
||||
proxy: {
|
||||
'/api/ws/terminal': {
|
||||
target: backendDebugUrl,
|
||||
ws: true,
|
||||
changeOrigin: true
|
||||
},
|
||||
'/api': backendDebugUrl
|
||||
}
|
||||
},
|
||||
|
||||
14
package.json
14
package.json
@@ -17,18 +17,16 @@
|
||||
"dev:depend": "npm i && cd napcat.webui && npm i"
|
||||
},
|
||||
"devDependencies": {
|
||||
"json5": "^2.2.3",
|
||||
"esbuild": "0.24.0",
|
||||
"@babel/preset-typescript": "^7.24.7",
|
||||
"@eslint/compat": "^1.2.2",
|
||||
"@eslint/eslintrc": "^3.1.0",
|
||||
"@eslint/js": "^9.14.0",
|
||||
"@log4js-node/log4js-api": "^1.0.2",
|
||||
"@napneko/nap-proto-core": "^0.0.4",
|
||||
"@rollup/plugin-typescript": "^12.1.2",
|
||||
"@rollup/plugin-node-resolve": "^16.0.0",
|
||||
"@types/cors": "^2.8.17",
|
||||
"@rollup/plugin-typescript": "^12.1.2",
|
||||
"@sinclair/typebox": "^0.34.9",
|
||||
"@types/cors": "^2.8.17",
|
||||
"@types/express": "^5.0.0",
|
||||
"@types/node": "^22.0.1",
|
||||
"@types/qrcode-terminal": "^0.12.2",
|
||||
@@ -39,6 +37,7 @@
|
||||
"async-mutex": "^0.5.0",
|
||||
"commander": "^13.0.0",
|
||||
"cors": "^2.8.5",
|
||||
"esbuild": "0.24.0",
|
||||
"eslint": "^9.14.0",
|
||||
"eslint-import-resolver-typescript": "^3.6.1",
|
||||
"eslint-plugin-import": "^2.29.1",
|
||||
@@ -46,17 +45,20 @@
|
||||
"file-type": "^20.0.0",
|
||||
"globals": "^15.12.0",
|
||||
"image-size": "^1.1.1",
|
||||
"json5": "^2.2.3",
|
||||
"typescript": "^5.3.3",
|
||||
"typescript-eslint": "^8.13.0",
|
||||
"vite": "^6.0.1",
|
||||
"vite-plugin-cp": "^4.0.8",
|
||||
"vite-tsconfig-paths": "^5.1.0",
|
||||
"winston": "^3.17.0"
|
||||
"winston": "^3.17.0",
|
||||
"@homebridge/node-pty-prebuilt-multiarch": "^0.12.0-beta.5",
|
||||
"@ffmpeg.wasm/main": "^0.13.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"@ffmpeg.wasm/core-mt": "^0.13.2",
|
||||
"@ffmpeg.wasm/main": "^0.13.1",
|
||||
"express": "^5.0.0",
|
||||
"express-rate-limit": "^7.5.0",
|
||||
"piscina": "^4.7.0",
|
||||
"qrcode-terminal": "^0.12.0",
|
||||
"silk-wasm": "^3.6.1",
|
||||
|
||||
BIN
src/native/pty/darwin.win64/pty.node
Normal file
BIN
src/native/pty/darwin.win64/pty.node
Normal file
Binary file not shown.
BIN
src/native/pty/darwin.win64/spawn-helper
Normal file
BIN
src/native/pty/darwin.win64/spawn-helper
Normal file
Binary file not shown.
BIN
src/native/pty/darwin.x64/pty.node
Normal file
BIN
src/native/pty/darwin.x64/pty.node
Normal file
Binary file not shown.
BIN
src/native/pty/darwin.x64/spawn-helper
Normal file
BIN
src/native/pty/darwin.x64/spawn-helper
Normal file
Binary file not shown.
BIN
src/native/pty/linux.arm64/pty.node
Normal file
BIN
src/native/pty/linux.arm64/pty.node
Normal file
Binary file not shown.
BIN
src/native/pty/linux.x64/pty.node
Normal file
BIN
src/native/pty/linux.x64/pty.node
Normal file
Binary file not shown.
BIN
src/native/pty/win32.x64/conpty.node
Normal file
BIN
src/native/pty/win32.x64/conpty.node
Normal file
Binary file not shown.
BIN
src/native/pty/win32.x64/conpty_console_list.node
Normal file
BIN
src/native/pty/win32.x64/conpty_console_list.node
Normal file
Binary file not shown.
BIN
src/native/pty/win32.x64/pty.node
Normal file
BIN
src/native/pty/win32.x64/pty.node
Normal file
Binary file not shown.
BIN
src/native/pty/win32.x64/winpty-agent.exe
Normal file
BIN
src/native/pty/win32.x64/winpty-agent.exe
Normal file
Binary file not shown.
BIN
src/native/pty/win32.x64/winpty.dll
Normal file
BIN
src/native/pty/win32.x64/winpty.dll
Normal file
Binary file not shown.
33
src/pty/index.ts
Normal file
33
src/pty/index.ts
Normal file
@@ -0,0 +1,33 @@
|
||||
import type { ITerminal, IPtyOpenOptions, IPtyForkOptions, IWindowsPtyForkOptions } from '@homebridge/node-pty-prebuilt-multiarch/src/interfaces';
|
||||
import type { ArgvOrCommandLine } from '@homebridge/node-pty-prebuilt-multiarch/src/types';
|
||||
import { WindowsTerminal } from './windowsTerminal';
|
||||
import { UnixTerminal } from './unixTerminal';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
import path, { dirname } from 'node:path';
|
||||
|
||||
let terminalCtor: typeof WindowsTerminal | typeof UnixTerminal;
|
||||
|
||||
if (process.platform === 'win32') {
|
||||
terminalCtor = WindowsTerminal;
|
||||
} else {
|
||||
terminalCtor = UnixTerminal;
|
||||
}
|
||||
|
||||
export function spawn(file?: string, args?: ArgvOrCommandLine, opt?: IPtyForkOptions | IWindowsPtyForkOptions): ITerminal {
|
||||
return new terminalCtor(file, args, opt);
|
||||
}
|
||||
|
||||
export function open(options: IPtyOpenOptions): ITerminal {
|
||||
return terminalCtor.open(options) as ITerminal;
|
||||
}
|
||||
export function require_dlopen(modulename: string) {
|
||||
const module = { exports: {} };
|
||||
const import__dirname = dirname(fileURLToPath(import.meta.url));
|
||||
process.dlopen(module, path.join(import__dirname, modulename));
|
||||
return module.exports as any;
|
||||
}
|
||||
/**
|
||||
* Expose the native API when not Windows, note that this is not public API and
|
||||
* could be removed at any time.
|
||||
*/
|
||||
export const native = (process.platform !== 'win32' ? require_dlopen('./pty/' + process.platform + '.' + process.arch + '/pty.node') : null);
|
||||
54
src/pty/native.d.ts
vendored
Normal file
54
src/pty/native.d.ts
vendored
Normal file
@@ -0,0 +1,54 @@
|
||||
/**
|
||||
* Copyright (c) 2018, Microsoft Corporation (MIT License).
|
||||
*/
|
||||
|
||||
interface IConptyNative {
|
||||
startProcess(file: string, cols: number, rows: number, debug: boolean, pipeName: string, conptyInheritCursor: boolean, useConptyDll: boolean): IConptyProcess;
|
||||
connect(ptyId: number, commandLine: string, cwd: string, env: string[], onExitCallback: (exitCode: number) => void): { pid: number };
|
||||
resize(ptyId: number, cols: number, rows: number, useConptyDll: boolean): void;
|
||||
clear(ptyId: number, useConptyDll: boolean): void;
|
||||
kill(ptyId: number, useConptyDll: boolean): void;
|
||||
}
|
||||
|
||||
interface IWinptyNative {
|
||||
startProcess(file: string, commandLine: string, env: string[], cwd: string, cols: number, rows: number, debug: boolean): IWinptyProcess;
|
||||
resize(pid: number, cols: number, rows: number): void;
|
||||
kill(pid: number, innerPid: number): void;
|
||||
getProcessList(pid: number): number[];
|
||||
getExitCode(innerPid: number): number;
|
||||
}
|
||||
|
||||
interface IUnixNative {
|
||||
fork(file: string, args: string[], parsedEnv: string[], cwd: string, cols: number, rows: number, uid: number, gid: number, useUtf8: boolean, helperPath: string, onExitCallback: (code: number, signal: number) => void): IUnixProcess;
|
||||
open(cols: number, rows: number): IUnixOpenProcess;
|
||||
process(fd: number, pty?: string): string;
|
||||
resize(fd: number, cols: number, rows: number): void;
|
||||
}
|
||||
|
||||
interface IConptyProcess {
|
||||
pty: number;
|
||||
fd: number;
|
||||
conin: string;
|
||||
conout: string;
|
||||
}
|
||||
|
||||
interface IWinptyProcess {
|
||||
pty: number;
|
||||
fd: number;
|
||||
conin: string;
|
||||
conout: string;
|
||||
pid: number;
|
||||
innerPid: number;
|
||||
}
|
||||
|
||||
interface IUnixProcess {
|
||||
fd: number;
|
||||
pid: number;
|
||||
pty: string;
|
||||
}
|
||||
|
||||
interface IUnixOpenProcess {
|
||||
master: number;
|
||||
slave: number;
|
||||
pty: string;
|
||||
}
|
||||
231
src/pty/node-pty.d.ts
vendored
Normal file
231
src/pty/node-pty.d.ts
vendored
Normal file
@@ -0,0 +1,231 @@
|
||||
/**
|
||||
* Copyright (c) 2017, Daniel Imms (MIT License).
|
||||
* Copyright (c) 2018, Microsoft Corporation (MIT License).
|
||||
*/
|
||||
|
||||
declare module '@/pty' {
|
||||
/**
|
||||
* Forks a process as a pseudoterminal.
|
||||
* @param file The file to launch.
|
||||
* @param args The file's arguments as argv (string[]) or in a pre-escaped CommandLine format
|
||||
* (string). Note that the CommandLine option is only available on Windows and is expected to be
|
||||
* escaped properly.
|
||||
* @param options The options of the terminal.
|
||||
* @see CommandLineToArgvW https://msdn.microsoft.com/en-us/library/windows/desktop/bb776391(v=vs.85).aspx
|
||||
* @see Parsing C++ Comamnd-Line Arguments https://msdn.microsoft.com/en-us/library/17w5ykft.aspx
|
||||
* @see GetCommandLine https://msdn.microsoft.com/en-us/library/windows/desktop/ms683156.aspx
|
||||
*/
|
||||
export function spawn(file: string, args: string[] | string, options: IPtyForkOptions | IWindowsPtyForkOptions): IPty;
|
||||
|
||||
export interface IBasePtyForkOptions {
|
||||
|
||||
/**
|
||||
* Name of the terminal to be set in environment ($TERM variable).
|
||||
*/
|
||||
name?: string;
|
||||
|
||||
/**
|
||||
* Number of intial cols of the pty.
|
||||
*/
|
||||
cols?: number;
|
||||
|
||||
/**
|
||||
* Number of initial rows of the pty.
|
||||
*/
|
||||
rows?: number;
|
||||
|
||||
/**
|
||||
* Working directory to be set for the child program.
|
||||
*/
|
||||
cwd?: string;
|
||||
|
||||
/**
|
||||
* Environment to be set for the child program.
|
||||
*/
|
||||
env?: { [key: string]: string | undefined };
|
||||
|
||||
/**
|
||||
* String encoding of the underlying pty.
|
||||
* If set, incoming data will be decoded to strings and outgoing strings to bytes applying this encoding.
|
||||
* If unset, incoming data will be delivered as raw bytes (Buffer type).
|
||||
* By default 'utf8' is assumed, to unset it explicitly set it to `null`.
|
||||
*/
|
||||
encoding?: string | null;
|
||||
|
||||
/**
|
||||
* (EXPERIMENTAL)
|
||||
* Whether to enable flow control handling (false by default). If enabled a message of `flowControlPause`
|
||||
* will pause the socket and thus blocking the child program execution due to buffer back pressure.
|
||||
* A message of `flowControlResume` will resume the socket into flow mode.
|
||||
* For performance reasons only a single message as a whole will match (no message part matching).
|
||||
* If flow control is enabled the `flowControlPause` and `flowControlResume` messages are not forwarded to
|
||||
* the underlying pseudoterminal.
|
||||
*/
|
||||
handleFlowControl?: boolean;
|
||||
|
||||
/**
|
||||
* (EXPERIMENTAL)
|
||||
* The string that should pause the pty when `handleFlowControl` is true. Default is XOFF ('\x13').
|
||||
*/
|
||||
flowControlPause?: string;
|
||||
|
||||
/**
|
||||
* (EXPERIMENTAL)
|
||||
* The string that should resume the pty when `handleFlowControl` is true. Default is XON ('\x11').
|
||||
*/
|
||||
flowControlResume?: string;
|
||||
}
|
||||
|
||||
export interface IPtyForkOptions extends IBasePtyForkOptions {
|
||||
/**
|
||||
* Security warning: use this option with great caution,
|
||||
* as opened file descriptors with higher privileges might leak to the child program.
|
||||
*/
|
||||
uid?: number;
|
||||
gid?: number;
|
||||
}
|
||||
|
||||
export interface IWindowsPtyForkOptions extends IBasePtyForkOptions {
|
||||
/**
|
||||
* Whether to use the ConPTY system on Windows. When this is not set, ConPTY will be used when
|
||||
* the Windows build number is >= 18309 (instead of winpty). Note that ConPTY is available from
|
||||
* build 17134 but is too unstable to enable by default.
|
||||
*
|
||||
* This setting does nothing on non-Windows.
|
||||
*/
|
||||
useConpty?: boolean;
|
||||
|
||||
/**
|
||||
* (EXPERIMENTAL)
|
||||
*
|
||||
* Whether to use the conpty.dll shipped with the node-pty package instead of the one built into
|
||||
* Windows. Defaults to false.
|
||||
*/
|
||||
useConptyDll?: boolean;
|
||||
|
||||
/**
|
||||
* Whether to use PSEUDOCONSOLE_INHERIT_CURSOR in conpty.
|
||||
* @see https://docs.microsoft.com/en-us/windows/console/createpseudoconsole
|
||||
*/
|
||||
conptyInheritCursor?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* An interface representing a pseudoterminal, on Windows this is emulated via the winpty library.
|
||||
*/
|
||||
export interface IPty {
|
||||
/**
|
||||
* The process ID of the outer process.
|
||||
*/
|
||||
readonly pid: number;
|
||||
|
||||
/**
|
||||
* The column size in characters.
|
||||
*/
|
||||
readonly cols: number;
|
||||
|
||||
/**
|
||||
* The row size in characters.
|
||||
*/
|
||||
readonly rows: number;
|
||||
|
||||
/**
|
||||
* The title of the active process.
|
||||
*/
|
||||
readonly process: string;
|
||||
|
||||
/**
|
||||
* (EXPERIMENTAL)
|
||||
* Whether to handle flow control. Useful to disable/re-enable flow control during runtime.
|
||||
* Use this for binary data that is likely to contain the `flowControlPause` string by accident.
|
||||
*/
|
||||
handleFlowControl: boolean;
|
||||
|
||||
/**
|
||||
* Adds an event listener for when a data event fires. This happens when data is returned from
|
||||
* the pty.
|
||||
* @returns an `IDisposable` to stop listening.
|
||||
*/
|
||||
readonly onData: IEvent<string>;
|
||||
|
||||
/**
|
||||
* Adds an event listener for when an exit event fires. This happens when the pty exits.
|
||||
* @returns an `IDisposable` to stop listening.
|
||||
*/
|
||||
readonly onExit: IEvent<{ exitCode: number, signal?: number }>;
|
||||
|
||||
/**
|
||||
* Resizes the dimensions of the pty.
|
||||
* @param columns The number of columns to use.
|
||||
* @param rows The number of rows to use.
|
||||
*/
|
||||
resize(columns: number, rows: number): void;
|
||||
|
||||
// Re-added this interface as homebridge-config-ui-x leverages it https://github.com/microsoft/node-pty/issues/282
|
||||
|
||||
/**
|
||||
* Adds a listener to the data event, fired when data is returned from the pty.
|
||||
* @param event The name of the event.
|
||||
* @param listener The callback function.
|
||||
* @deprecated Use IPty.onData
|
||||
*/
|
||||
on(event: 'data', listener: (data: string) => void): void;
|
||||
|
||||
/**
|
||||
* Adds a listener to the exit event, fired when the pty exits.
|
||||
* @param event The name of the event.
|
||||
* @param listener The callback function, exitCode is the exit code of the process and signal is
|
||||
* the signal that triggered the exit. signal is not supported on Windows.
|
||||
* @deprecated Use IPty.onExit
|
||||
*/
|
||||
on(event: 'exit', listener: (exitCode: number, signal?: number) => void): void;
|
||||
|
||||
/**
|
||||
* Clears the pty's internal representation of its buffer. This is a no-op
|
||||
* unless on Windows/ConPTY. This is useful if the buffer is cleared on the
|
||||
* frontend in order to synchronize state with the backend to avoid ConPTY
|
||||
* possibly reprinting the screen.
|
||||
*/
|
||||
clear(): void;
|
||||
|
||||
/**
|
||||
* Writes data to the pty.
|
||||
* @param data The data to write.
|
||||
*/
|
||||
write(data: string): void;
|
||||
|
||||
/**
|
||||
* Kills the pty.
|
||||
* @param signal The signal to use, defaults to SIGHUP. This parameter is not supported on
|
||||
* Windows.
|
||||
* @throws Will throw when signal is used on Windows.
|
||||
*/
|
||||
kill(signal?: string): void;
|
||||
|
||||
/**
|
||||
* Pauses the pty for customizable flow control.
|
||||
*/
|
||||
pause(): void;
|
||||
|
||||
/**
|
||||
* Resumes the pty for customizable flow control.
|
||||
*/
|
||||
resume(): void;
|
||||
}
|
||||
|
||||
/**
|
||||
* An object that can be disposed via a dispose function.
|
||||
*/
|
||||
export interface IDisposable {
|
||||
dispose(): void;
|
||||
}
|
||||
|
||||
/**
|
||||
* An event that can be listened to.
|
||||
* @returns an `IDisposable` to stop listening.
|
||||
*/
|
||||
export interface IEvent<T> {
|
||||
(listener: (e: T) => any): IDisposable;
|
||||
}
|
||||
}
|
||||
|
||||
10
src/pty/prebuild-loader.ts
Normal file
10
src/pty/prebuild-loader.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import { require_dlopen } from '.';
|
||||
export function pty_loader() {
|
||||
let pty: any;
|
||||
try {
|
||||
pty = require_dlopen('./pty/' + process.platform + '.' + process.arch + '/pty.node');
|
||||
} catch (outerError) {
|
||||
pty = undefined;
|
||||
}
|
||||
return pty;
|
||||
};
|
||||
297
src/pty/unixTerminal.ts
Normal file
297
src/pty/unixTerminal.ts
Normal file
@@ -0,0 +1,297 @@
|
||||
/* eslint-disable prefer-rest-params */
|
||||
/**
|
||||
* Copyright (c) 2012-2015, Christopher Jeffrey (MIT License)
|
||||
* Copyright (c) 2016, Daniel Imms (MIT License).
|
||||
* Copyright (c) 2018, Microsoft Corporation (MIT License).
|
||||
*/
|
||||
import * as net from 'net';
|
||||
import * as path from 'path';
|
||||
import * as tty from 'tty';
|
||||
import { Terminal, DEFAULT_COLS, DEFAULT_ROWS } from '@homebridge/node-pty-prebuilt-multiarch/src/terminal';
|
||||
import { IProcessEnv, IPtyForkOptions, IPtyOpenOptions } from '@homebridge/node-pty-prebuilt-multiarch/src/interfaces';
|
||||
import { ArgvOrCommandLine } from '@homebridge/node-pty-prebuilt-multiarch/src/types';
|
||||
import { assign } from '@homebridge/node-pty-prebuilt-multiarch/src/utils';
|
||||
import { pty_loader } from './prebuild-loader';
|
||||
export const pty = pty_loader();
|
||||
|
||||
let helperPath: string;
|
||||
helperPath = '../build/Release/spawn-helper';
|
||||
|
||||
helperPath = path.resolve(__dirname, helperPath);
|
||||
helperPath = helperPath.replace('app.asar', 'app.asar.unpacked');
|
||||
helperPath = helperPath.replace('node_modules.asar', 'node_modules.asar.unpacked');
|
||||
|
||||
const DEFAULT_FILE = 'sh';
|
||||
const DEFAULT_NAME = 'xterm';
|
||||
const DESTROY_SOCKET_TIMEOUT_MS = 200;
|
||||
|
||||
export class UnixTerminal extends Terminal {
|
||||
protected _fd: number;
|
||||
protected _pty: string;
|
||||
|
||||
protected _file: string;
|
||||
protected _name: string;
|
||||
|
||||
protected _readable: boolean;
|
||||
protected _writable: boolean;
|
||||
|
||||
private _boundClose: boolean = false;
|
||||
private _emittedClose: boolean = false;
|
||||
private _master: net.Socket | undefined;
|
||||
private _slave: net.Socket | undefined;
|
||||
|
||||
public get master(): net.Socket | undefined { return this._master; }
|
||||
public get slave(): net.Socket | undefined { return this._slave; }
|
||||
|
||||
constructor(file?: string, args?: ArgvOrCommandLine, opt?: IPtyForkOptions) {
|
||||
super(opt);
|
||||
|
||||
if (typeof args === 'string') {
|
||||
throw new Error('args as a string is not supported on unix.');
|
||||
}
|
||||
|
||||
// Initialize arguments
|
||||
args = args || [];
|
||||
file = file || DEFAULT_FILE;
|
||||
opt = opt || {};
|
||||
opt.env = opt.env || process.env;
|
||||
|
||||
this._cols = opt.cols || DEFAULT_COLS;
|
||||
this._rows = opt.rows || DEFAULT_ROWS;
|
||||
const uid = opt.uid ?? -1;
|
||||
const gid = opt.gid ?? -1;
|
||||
const env: IProcessEnv = assign({}, opt.env);
|
||||
|
||||
if (opt.env === process.env) {
|
||||
this._sanitizeEnv(env);
|
||||
}
|
||||
|
||||
const cwd = opt.cwd || process.cwd();
|
||||
env.PWD = cwd;
|
||||
const name = opt.name || env.TERM || DEFAULT_NAME;
|
||||
env.TERM = name;
|
||||
const parsedEnv = this._parseEnv(env);
|
||||
|
||||
const encoding = (opt.encoding === undefined ? 'utf8' : opt.encoding);
|
||||
|
||||
const onexit = (code: number, signal: number): void => {
|
||||
// XXX Sometimes a data event is emitted after exit. Wait til socket is
|
||||
// destroyed.
|
||||
if (!this._emittedClose) {
|
||||
if (this._boundClose) {
|
||||
return;
|
||||
}
|
||||
this._boundClose = true;
|
||||
// From macOS High Sierra 10.13.2 sometimes the socket never gets
|
||||
// closed. A timeout is applied here to avoid the terminal never being
|
||||
// destroyed when this occurs.
|
||||
let timeout: NodeJS.Timeout | null = setTimeout(() => {
|
||||
timeout = null;
|
||||
// Destroying the socket now will cause the close event to fire
|
||||
this._socket.destroy();
|
||||
}, DESTROY_SOCKET_TIMEOUT_MS);
|
||||
this.once('close', () => {
|
||||
if (timeout !== null) {
|
||||
clearTimeout(timeout);
|
||||
}
|
||||
this.emit('exit', code, signal);
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.emit('exit', code, signal);
|
||||
};
|
||||
|
||||
// fork
|
||||
const term = pty.fork(file, args, parsedEnv, cwd, this._cols, this._rows, uid, gid, (encoding === 'utf8'), helperPath, onexit);
|
||||
|
||||
this._socket = new tty.ReadStream(term.fd);
|
||||
if (encoding !== null) {
|
||||
this._socket.setEncoding(encoding as BufferEncoding);
|
||||
}
|
||||
|
||||
// setup
|
||||
this._socket.on('error', (err: any) => {
|
||||
// NOTE: fs.ReadStream gets EAGAIN twice at first:
|
||||
if (err.code) {
|
||||
if (~err.code.indexOf('EAGAIN')) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// close
|
||||
this._close();
|
||||
// EIO on exit from fs.ReadStream:
|
||||
if (!this._emittedClose) {
|
||||
this._emittedClose = true;
|
||||
this.emit('close');
|
||||
}
|
||||
|
||||
// EIO, happens when someone closes our child process: the only process in
|
||||
// the terminal.
|
||||
// node < 0.6.14: errno 5
|
||||
// node >= 0.6.14: read EIO
|
||||
if (err.code) {
|
||||
if (~err.code.indexOf('errno 5') || ~err.code.indexOf('EIO')) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// throw anything else
|
||||
if (this.listeners('error').length < 2) {
|
||||
throw err;
|
||||
}
|
||||
});
|
||||
|
||||
this._pid = term.pid;
|
||||
this._fd = term.fd;
|
||||
this._pty = term.pty;
|
||||
|
||||
this._file = file;
|
||||
this._name = name;
|
||||
|
||||
this._readable = true;
|
||||
this._writable = true;
|
||||
|
||||
this._socket.on('close', () => {
|
||||
if (this._emittedClose) {
|
||||
return;
|
||||
}
|
||||
this._emittedClose = true;
|
||||
this._close();
|
||||
this.emit('close');
|
||||
});
|
||||
|
||||
this._forwardEvents();
|
||||
}
|
||||
|
||||
protected _write(data: string): void {
|
||||
this._socket.write(data);
|
||||
}
|
||||
|
||||
/* Accessors */
|
||||
get fd(): number { return this._fd; }
|
||||
get ptsName(): string { return this._pty; }
|
||||
|
||||
/**
|
||||
* openpty
|
||||
*/
|
||||
|
||||
public static open(opt: IPtyOpenOptions): UnixTerminal {
|
||||
const self: UnixTerminal = Object.create(UnixTerminal.prototype);
|
||||
opt = opt || {};
|
||||
|
||||
if (arguments.length > 1) {
|
||||
opt = {
|
||||
cols: arguments[1],
|
||||
rows: arguments[2]
|
||||
};
|
||||
}
|
||||
|
||||
const cols = opt.cols || DEFAULT_COLS;
|
||||
const rows = opt.rows || DEFAULT_ROWS;
|
||||
const encoding = (opt.encoding === undefined ? 'utf8' : opt.encoding);
|
||||
|
||||
// open
|
||||
const term: IUnixOpenProcess = pty.open(cols, rows);
|
||||
|
||||
self._master = new tty.ReadStream(term.master);
|
||||
if (encoding !== null) {
|
||||
self._master.setEncoding(encoding as BufferEncoding);
|
||||
}
|
||||
self._master.resume();
|
||||
|
||||
self._slave = new tty.ReadStream(term.slave);
|
||||
if (encoding !== null) {
|
||||
self._slave.setEncoding(encoding as BufferEncoding);
|
||||
}
|
||||
self._slave.resume();
|
||||
|
||||
self._socket = self._master;
|
||||
self._pid = -1;
|
||||
self._fd = term.master;
|
||||
self._pty = term.pty;
|
||||
|
||||
self._file = process.argv[0] || 'node';
|
||||
self._name = process.env.TERM || '';
|
||||
|
||||
self._readable = true;
|
||||
self._writable = true;
|
||||
|
||||
self._socket.on('error', err => {
|
||||
self._close();
|
||||
if (self.listeners('error').length < 2) {
|
||||
throw err;
|
||||
}
|
||||
});
|
||||
|
||||
self._socket.on('close', () => {
|
||||
self._close();
|
||||
});
|
||||
|
||||
return self;
|
||||
}
|
||||
|
||||
public destroy(): void {
|
||||
this._close();
|
||||
|
||||
// Need to close the read stream so node stops reading a dead file
|
||||
// descriptor. Then we can safely SIGHUP the shell.
|
||||
this._socket.once('close', () => {
|
||||
this.kill('SIGHUP');
|
||||
});
|
||||
|
||||
this._socket.destroy();
|
||||
}
|
||||
|
||||
public kill(signal?: string): void {
|
||||
try {
|
||||
process.kill(this.pid, signal || 'SIGHUP');
|
||||
} catch (e) { /* swallow */ }
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the name of the process.
|
||||
*/
|
||||
public get process(): string {
|
||||
if (process.platform === 'darwin') {
|
||||
const title = pty.process(this._fd);
|
||||
return (title !== 'kernel_task') ? title : this._file;
|
||||
}
|
||||
|
||||
return pty.process(this._fd, this._pty) || this._file;
|
||||
}
|
||||
|
||||
/**
|
||||
* TTY
|
||||
*/
|
||||
|
||||
public resize(cols: number, rows: number): void {
|
||||
if (cols <= 0 || rows <= 0 || isNaN(cols) || isNaN(rows) || cols === Infinity || rows === Infinity) {
|
||||
throw new Error('resizing must be done using positive cols and rows');
|
||||
}
|
||||
pty.resize(this._fd, cols, rows);
|
||||
this._cols = cols;
|
||||
this._rows = rows;
|
||||
}
|
||||
|
||||
public clear(): void {
|
||||
|
||||
}
|
||||
|
||||
private _sanitizeEnv(env: IProcessEnv): void {
|
||||
// Make sure we didn't start our server from inside tmux.
|
||||
delete env['TMUX'];
|
||||
delete env['TMUX_PANE'];
|
||||
|
||||
// Make sure we didn't start our server from inside screen.
|
||||
// http://web.mit.edu/gnu/doc/html/screen_20.html
|
||||
delete env['STY'];
|
||||
delete env['WINDOW'];
|
||||
|
||||
// Delete some variables that might confuse our terminal.
|
||||
delete env['WINDOWID'];
|
||||
delete env['TERMCAP'];
|
||||
delete env['COLUMNS'];
|
||||
delete env['LINES'];
|
||||
}
|
||||
}
|
||||
80
src/pty/windowsConoutConnection.ts
Normal file
80
src/pty/windowsConoutConnection.ts
Normal file
@@ -0,0 +1,80 @@
|
||||
/**
|
||||
* Copyright (c) 2020, Microsoft Corporation (MIT License).
|
||||
*/
|
||||
|
||||
import { Worker } from 'worker_threads';
|
||||
import { Socket } from 'net';
|
||||
import { IDisposable } from '@homebridge/node-pty-prebuilt-multiarch/src/types';
|
||||
import { IWorkerData, ConoutWorkerMessage, getWorkerPipeName } from '@homebridge/node-pty-prebuilt-multiarch/src/shared/conout';
|
||||
import { dirname, join } from 'path';
|
||||
import { IEvent, EventEmitter2 } from '@homebridge/node-pty-prebuilt-multiarch/src/eventEmitter2';
|
||||
import { fileURLToPath } from 'node:url';
|
||||
|
||||
/**
|
||||
* The amount of time to wait for additional data after the conpty shell process has exited before
|
||||
* shutting down the worker and sockets. The timer will be reset if a new data event comes in after
|
||||
* the timer has started.
|
||||
*/
|
||||
const FLUSH_DATA_INTERVAL = 1000;
|
||||
|
||||
/**
|
||||
* Connects to and manages the lifecycle of the conout socket. This socket must be drained on
|
||||
* another thread in order to avoid deadlocks where Conpty waits for the out socket to drain
|
||||
* when `ClosePseudoConsole` is called. This happens when data is being written to the terminal when
|
||||
* the pty is closed.
|
||||
*
|
||||
* See also:
|
||||
* - https://github.com/microsoft/node-pty/issues/375
|
||||
* - https://github.com/microsoft/vscode/issues/76548
|
||||
* - https://github.com/microsoft/terminal/issues/1810
|
||||
* - https://docs.microsoft.com/en-us/windows/console/closepseudoconsole
|
||||
*/
|
||||
export class ConoutConnection implements IDisposable {
|
||||
private _worker: Worker;
|
||||
private _drainTimeout: NodeJS.Timeout | undefined;
|
||||
private _isDisposed: boolean = false;
|
||||
|
||||
private _onReady = new EventEmitter2<void>();
|
||||
public get onReady(): IEvent<void> { return this._onReady.event; }
|
||||
|
||||
constructor(
|
||||
private _conoutPipeName: string
|
||||
) {
|
||||
const workerData: IWorkerData = { conoutPipeName: _conoutPipeName };
|
||||
const scriptPath = dirname(fileURLToPath(import.meta.url));
|
||||
this._worker = new Worker(join(scriptPath, 'worker/conoutSocketWorker.mjs'), { workerData });
|
||||
this._worker.on('message', (message: ConoutWorkerMessage) => {
|
||||
switch (message) {
|
||||
case ConoutWorkerMessage.READY:
|
||||
this._onReady.fire();
|
||||
return;
|
||||
default:
|
||||
console.warn('Unexpected ConoutWorkerMessage', message);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
dispose(): void {
|
||||
if (this._isDisposed) {
|
||||
return;
|
||||
}
|
||||
this._isDisposed = true;
|
||||
// Drain all data from the socket before closing
|
||||
this._drainDataAndClose();
|
||||
}
|
||||
|
||||
connectSocket(socket: Socket): void {
|
||||
socket.connect(getWorkerPipeName(this._conoutPipeName));
|
||||
}
|
||||
|
||||
private _drainDataAndClose(): void {
|
||||
if (this._drainTimeout) {
|
||||
clearTimeout(this._drainTimeout);
|
||||
}
|
||||
this._drainTimeout = setTimeout(() => this._destroySocket(), FLUSH_DATA_INTERVAL);
|
||||
}
|
||||
|
||||
private async _destroySocket(): Promise<void> {
|
||||
await this._worker.terminate();
|
||||
}
|
||||
}
|
||||
306
src/pty/windowsPtyAgent.ts
Normal file
306
src/pty/windowsPtyAgent.ts
Normal file
@@ -0,0 +1,306 @@
|
||||
/**
|
||||
* Copyright (c) 2012-2015, Christopher Jeffrey, Peter Sunde (MIT License)
|
||||
* Copyright (c) 2016, Daniel Imms (MIT License).
|
||||
* Copyright (c) 2018, Microsoft Corporation (MIT License).
|
||||
*/
|
||||
|
||||
import * as fs from 'fs';
|
||||
import * as os from 'os';
|
||||
import * as path from 'path';
|
||||
import { Socket } from 'net';
|
||||
import { ArgvOrCommandLine } from '@homebridge/node-pty-prebuilt-multiarch/src/types';
|
||||
import { fork } from 'child_process';
|
||||
import { ConoutConnection } from './windowsConoutConnection';
|
||||
import { require_dlopen } from '.';
|
||||
|
||||
let conptyNative: IConptyNative;
|
||||
let winptyNative: IWinptyNative;
|
||||
|
||||
/**
|
||||
* The amount of time to wait for additional data after the conpty shell process has exited before
|
||||
* shutting down the socket. The timer will be reset if a new data event comes in after the timer
|
||||
* has started.
|
||||
*/
|
||||
const FLUSH_DATA_INTERVAL = 1000;
|
||||
|
||||
/**
|
||||
* This agent sits between the WindowsTerminal class and provides a common interface for both conpty
|
||||
* and winpty.
|
||||
*/
|
||||
export class WindowsPtyAgent {
|
||||
private _inSocket: Socket;
|
||||
private _outSocket: Socket;
|
||||
private _pid: number = 0;
|
||||
private _innerPid: number = 0;
|
||||
private _closeTimeout: NodeJS.Timer | undefined;
|
||||
private _exitCode: number | undefined;
|
||||
private _conoutSocketWorker: ConoutConnection;
|
||||
|
||||
private _fd: any;
|
||||
private _pty: number;
|
||||
private _ptyNative: IConptyNative | IWinptyNative;
|
||||
|
||||
public get inSocket(): Socket { return this._inSocket; }
|
||||
public get outSocket(): Socket { return this._outSocket; }
|
||||
public get fd(): any { return this._fd; }
|
||||
public get innerPid(): number { return this._innerPid; }
|
||||
public get pty(): number { return this._pty; }
|
||||
|
||||
constructor(
|
||||
file: string,
|
||||
args: ArgvOrCommandLine,
|
||||
env: string[],
|
||||
cwd: string,
|
||||
cols: number,
|
||||
rows: number,
|
||||
debug: boolean,
|
||||
private _useConpty: boolean | undefined,
|
||||
private _useConptyDll: boolean = false,
|
||||
conptyInheritCursor: boolean = false
|
||||
) {
|
||||
if (this._useConpty === undefined || this._useConpty === true) {
|
||||
this._useConpty = this._getWindowsBuildNumber() >= 18309;
|
||||
}
|
||||
if (this._useConpty) {
|
||||
if (!conptyNative) {
|
||||
conptyNative = require_dlopen('./pty/' + process.platform + '.' + process.arch + '/conpty.node');
|
||||
}
|
||||
} else {
|
||||
if (!winptyNative) {
|
||||
winptyNative = require_dlopen('./pty/' + process.platform + '.' + process.arch + '/pty.node');
|
||||
}
|
||||
}
|
||||
this._ptyNative = this._useConpty ? conptyNative : winptyNative;
|
||||
|
||||
// Sanitize input variable.
|
||||
cwd = path.resolve(cwd);
|
||||
|
||||
// Compose command line
|
||||
const commandLine = argsToCommandLine(file, args);
|
||||
|
||||
// Open pty session.
|
||||
let term: IConptyProcess | IWinptyProcess;
|
||||
if (this._useConpty) {
|
||||
term = (this._ptyNative as IConptyNative).startProcess(file, cols, rows, debug, this._generatePipeName(), conptyInheritCursor, this._useConptyDll);
|
||||
} else {
|
||||
term = (this._ptyNative as IWinptyNative).startProcess(file, commandLine, env, cwd, cols, rows, debug);
|
||||
this._pid = (term as IWinptyProcess).pid;
|
||||
this._innerPid = (term as IWinptyProcess).innerPid;
|
||||
}
|
||||
|
||||
// Not available on windows.
|
||||
this._fd = term.fd;
|
||||
|
||||
// Generated incremental number that has no real purpose besides using it
|
||||
// as a terminal id.
|
||||
this._pty = term.pty;
|
||||
|
||||
// Create terminal pipe IPC channel and forward to a local unix socket.
|
||||
this._outSocket = new Socket();
|
||||
this._outSocket.setEncoding('utf8');
|
||||
// The conout socket must be ready out on another thread to avoid deadlocks
|
||||
this._conoutSocketWorker = new ConoutConnection(term.conout);
|
||||
this._conoutSocketWorker.onReady(() => {
|
||||
this._conoutSocketWorker.connectSocket(this._outSocket);
|
||||
});
|
||||
this._outSocket.on('connect', () => {
|
||||
this._outSocket.emit('ready_datapipe');
|
||||
});
|
||||
|
||||
const inSocketFD = fs.openSync(term.conin, 'w');
|
||||
this._inSocket = new Socket({
|
||||
fd: inSocketFD,
|
||||
readable: false,
|
||||
writable: true
|
||||
});
|
||||
this._inSocket.setEncoding('utf8');
|
||||
|
||||
if (this._useConpty) {
|
||||
const connect = (this._ptyNative as IConptyNative).connect(this._pty, commandLine, cwd, env, c => this._$onProcessExit(c));
|
||||
this._innerPid = connect.pid;
|
||||
}
|
||||
}
|
||||
|
||||
public resize(cols: number, rows: number): void {
|
||||
if (this._useConpty) {
|
||||
if (this._exitCode !== undefined) {
|
||||
throw new Error('Cannot resize a pty that has already exited');
|
||||
}
|
||||
(this._ptyNative as IConptyNative).resize(this._pty, cols, rows, this._useConptyDll);
|
||||
return;
|
||||
}
|
||||
(this._ptyNative as IWinptyNative).resize(this._pid, cols, rows);
|
||||
}
|
||||
|
||||
public clear(): void {
|
||||
if (this._useConpty) {
|
||||
(this._ptyNative as IConptyNative).clear(this._pty, this._useConptyDll);
|
||||
}
|
||||
}
|
||||
|
||||
public kill(): void {
|
||||
this._inSocket.readable = false;
|
||||
this._outSocket.readable = false;
|
||||
// Tell the agent to kill the pty, this releases handles to the process
|
||||
if (this._useConpty) {
|
||||
this._getConsoleProcessList().then(consoleProcessList => {
|
||||
consoleProcessList.forEach((pid: number) => {
|
||||
try {
|
||||
process.kill(pid);
|
||||
} catch (e) {
|
||||
// Ignore if process cannot be found (kill ESRCH error)
|
||||
}
|
||||
});
|
||||
(this._ptyNative as IConptyNative).kill(this._pty, this._useConptyDll);
|
||||
});
|
||||
} else {
|
||||
// Because pty.kill closes the handle, it will kill most processes by itself.
|
||||
// Process IDs can be reused as soon as all handles to them are
|
||||
// dropped, so we want to immediately kill the entire console process list.
|
||||
// If we do not force kill all processes here, node servers in particular
|
||||
// seem to become detached and remain running (see
|
||||
// Microsoft/vscode#26807).
|
||||
const processList: number[] = (this._ptyNative as IWinptyNative).getProcessList(this._pid);
|
||||
(this._ptyNative as IWinptyNative).kill(this._pid, this._innerPid);
|
||||
processList.forEach(pid => {
|
||||
try {
|
||||
process.kill(pid);
|
||||
} catch (e) {
|
||||
// Ignore if process cannot be found (kill ESRCH error)
|
||||
}
|
||||
});
|
||||
}
|
||||
this._conoutSocketWorker.dispose();
|
||||
}
|
||||
|
||||
private _getConsoleProcessList(): Promise<number[]> {
|
||||
return new Promise<number[]>(resolve => {
|
||||
const agent = fork(path.join(__dirname, 'conpty_console_list_agent'), [this._innerPid.toString()]);
|
||||
agent.on('message', message => {
|
||||
clearTimeout(timeout);
|
||||
// @ts-expect-error no need to check if it is null
|
||||
resolve(message.consoleProcessList);
|
||||
});
|
||||
const timeout = setTimeout(() => {
|
||||
// Something went wrong, just send back the shell PID
|
||||
agent.kill();
|
||||
resolve([this._innerPid]);
|
||||
}, 5000);
|
||||
});
|
||||
}
|
||||
|
||||
public get exitCode(): number | undefined {
|
||||
if (this._useConpty) {
|
||||
return this._exitCode;
|
||||
}
|
||||
const winptyExitCode = (this._ptyNative as IWinptyNative).getExitCode(this._innerPid);
|
||||
return winptyExitCode === -1 ? undefined : winptyExitCode;
|
||||
}
|
||||
|
||||
private _getWindowsBuildNumber(): number {
|
||||
const osVersion = (/(\d+)\.(\d+)\.(\d+)/g).exec(os.release());
|
||||
let buildNumber: number = 0;
|
||||
if (osVersion && osVersion.length === 4) {
|
||||
buildNumber = parseInt(osVersion[3]);
|
||||
}
|
||||
return buildNumber;
|
||||
}
|
||||
|
||||
private _generatePipeName(): string {
|
||||
return `conpty-${Math.random() * 10000000}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* Triggered from the native side when a contpy process exits.
|
||||
*/
|
||||
private _$onProcessExit(exitCode: number): void {
|
||||
this._exitCode = exitCode;
|
||||
this._flushDataAndCleanUp();
|
||||
this._outSocket.on('data', () => this._flushDataAndCleanUp());
|
||||
}
|
||||
|
||||
private _flushDataAndCleanUp(): void {
|
||||
if (this._closeTimeout) {
|
||||
// @ts-expect-error no need to check if it is null
|
||||
clearTimeout(this._closeTimeout);
|
||||
}
|
||||
this._closeTimeout = setTimeout(() => this._cleanUpProcess(), FLUSH_DATA_INTERVAL);
|
||||
}
|
||||
|
||||
private _cleanUpProcess(): void {
|
||||
this._inSocket.readable = false;
|
||||
this._outSocket.readable = false;
|
||||
this._outSocket.destroy();
|
||||
}
|
||||
}
|
||||
|
||||
// Convert argc/argv into a Win32 command-line following the escaping convention
|
||||
// documented on MSDN (e.g. see CommandLineToArgvW documentation). Copied from
|
||||
// winpty project.
|
||||
export function argsToCommandLine(file: string, args: ArgvOrCommandLine): string {
|
||||
if (isCommandLine(args)) {
|
||||
if (args.length === 0) {
|
||||
return file;
|
||||
}
|
||||
return `${argsToCommandLine(file, [])} ${args}`;
|
||||
}
|
||||
const argv = [file];
|
||||
Array.prototype.push.apply(argv, args);
|
||||
let result = '';
|
||||
for (let argIndex = 0; argIndex < argv.length; argIndex++) {
|
||||
if (argIndex > 0) {
|
||||
result += ' ';
|
||||
}
|
||||
const arg = argv[argIndex];
|
||||
// if it is empty or it contains whitespace and is not already quoted
|
||||
const hasLopsidedEnclosingQuote = xOr((arg[0] !== '"'), (arg[arg.length - 1] !== '"'));
|
||||
const hasNoEnclosingQuotes = ((arg[0] !== '"') && (arg[arg.length - 1] !== '"'));
|
||||
const quote =
|
||||
arg === '' ||
|
||||
(arg.indexOf(' ') !== -1 ||
|
||||
arg.indexOf('\t') !== -1) &&
|
||||
((arg.length > 1) &&
|
||||
(hasLopsidedEnclosingQuote || hasNoEnclosingQuotes));
|
||||
if (quote) {
|
||||
result += '"';
|
||||
}
|
||||
let bsCount = 0;
|
||||
for (let i = 0; i < arg.length; i++) {
|
||||
const p = arg[i];
|
||||
if (p === '\\') {
|
||||
bsCount++;
|
||||
} else if (p === '"') {
|
||||
result += repeatText('\\', bsCount * 2 + 1);
|
||||
result += '"';
|
||||
bsCount = 0;
|
||||
} else {
|
||||
result += repeatText('\\', bsCount);
|
||||
bsCount = 0;
|
||||
result += p;
|
||||
}
|
||||
}
|
||||
if (quote) {
|
||||
result += repeatText('\\', bsCount * 2);
|
||||
result += '"';
|
||||
} else {
|
||||
result += repeatText('\\', bsCount);
|
||||
}
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function isCommandLine(args: ArgvOrCommandLine): args is string {
|
||||
return typeof args === 'string';
|
||||
}
|
||||
|
||||
function repeatText(text: string, count: number): string {
|
||||
let result = '';
|
||||
for (let i = 0; i < count; i++) {
|
||||
result += text;
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function xOr(arg1: boolean, arg2: boolean): boolean {
|
||||
return ((arg1 && !arg2) || (!arg1 && arg2));
|
||||
}
|
||||
208
src/pty/windowsTerminal.ts
Normal file
208
src/pty/windowsTerminal.ts
Normal file
@@ -0,0 +1,208 @@
|
||||
/**
|
||||
* Copyright (c) 2012-2015, Christopher Jeffrey, Peter Sunde (MIT License)
|
||||
* Copyright (c) 2016, Daniel Imms (MIT License).
|
||||
* Copyright (c) 2018, Microsoft Corporation (MIT License).
|
||||
*/
|
||||
|
||||
import { Socket } from 'net';
|
||||
import { Terminal, DEFAULT_COLS, DEFAULT_ROWS } from '@homebridge/node-pty-prebuilt-multiarch/src/terminal';
|
||||
import { WindowsPtyAgent } from './windowsPtyAgent';
|
||||
import { IPtyOpenOptions, IWindowsPtyForkOptions } from '@homebridge/node-pty-prebuilt-multiarch/src/interfaces';
|
||||
import { ArgvOrCommandLine } from '@homebridge/node-pty-prebuilt-multiarch/src/types';
|
||||
import { assign } from '@homebridge/node-pty-prebuilt-multiarch/src/utils';
|
||||
|
||||
const DEFAULT_FILE = 'cmd.exe';
|
||||
const DEFAULT_NAME = 'Windows Shell';
|
||||
|
||||
export class WindowsTerminal extends Terminal {
|
||||
private _isReady: boolean;
|
||||
private _deferreds: any[];
|
||||
private _agent: WindowsPtyAgent;
|
||||
|
||||
constructor(file?: string, args?: ArgvOrCommandLine, opt?: IWindowsPtyForkOptions) {
|
||||
super(opt);
|
||||
|
||||
this._checkType('args', args, 'string', true);
|
||||
|
||||
// Initialize arguments
|
||||
args = args || [];
|
||||
file = file || DEFAULT_FILE;
|
||||
opt = opt || {};
|
||||
opt.env = opt.env || process.env;
|
||||
|
||||
if (opt.encoding) {
|
||||
console.warn('Setting encoding on Windows is not supported');
|
||||
}
|
||||
|
||||
const env = assign({}, opt.env);
|
||||
this._cols = opt.cols || DEFAULT_COLS;
|
||||
this._rows = opt.rows || DEFAULT_ROWS;
|
||||
const cwd = opt.cwd || process.cwd();
|
||||
const name = opt.name || env.TERM || DEFAULT_NAME;
|
||||
const parsedEnv = this._parseEnv(env);
|
||||
|
||||
// If the terminal is ready
|
||||
this._isReady = false;
|
||||
|
||||
// Functions that need to run after `ready` event is emitted.
|
||||
this._deferreds = [];
|
||||
|
||||
// Create new termal.
|
||||
this._agent = new WindowsPtyAgent(file, args, parsedEnv, cwd, this._cols, this._rows, false, opt.useConpty, opt.useConptyDll, opt.conptyInheritCursor);
|
||||
this._socket = this._agent.outSocket;
|
||||
|
||||
// Not available until `ready` event emitted.
|
||||
this._pid = this._agent.innerPid;
|
||||
this._fd = this._agent.fd;
|
||||
this._pty = this._agent.pty;
|
||||
|
||||
// The forked windows terminal is not available until `ready` event is
|
||||
// emitted.
|
||||
this._socket.on('ready_datapipe', () => {
|
||||
|
||||
// These events needs to be forwarded.
|
||||
['connect', 'data', 'end', 'timeout', 'drain'].forEach(event => {
|
||||
this._socket.on(event, () => {
|
||||
|
||||
// Wait until the first data event is fired then we can run deferreds.
|
||||
if (!this._isReady && event === 'data') {
|
||||
|
||||
// Terminal is now ready and we can avoid having to defer method
|
||||
// calls.
|
||||
this._isReady = true;
|
||||
|
||||
// Execute all deferred methods
|
||||
this._deferreds.forEach(fn => {
|
||||
// NB! In order to ensure that `this` has all its references
|
||||
// updated any variable that need to be available in `this` before
|
||||
// the deferred is run has to be declared above this forEach
|
||||
// statement.
|
||||
fn.run();
|
||||
});
|
||||
|
||||
// Reset
|
||||
this._deferreds = [];
|
||||
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Shutdown if `error` event is emitted.
|
||||
this._socket.on('error', err => {
|
||||
// Close terminal session.
|
||||
this._close();
|
||||
|
||||
// EIO, happens when someone closes our child process: the only process
|
||||
// in the terminal.
|
||||
// node < 0.6.14: errno 5
|
||||
// node >= 0.6.14: read EIO
|
||||
if ((<any>err).code) {
|
||||
if (~(<any>err).code.indexOf('errno 5') || ~(<any>err).code.indexOf('EIO')) return;
|
||||
}
|
||||
|
||||
// Throw anything else.
|
||||
if (this.listeners('error').length < 2) {
|
||||
throw err;
|
||||
}
|
||||
});
|
||||
|
||||
// Cleanup after the socket is closed.
|
||||
this._socket.on('close', () => {
|
||||
this.emit('exit', this._agent.exitCode);
|
||||
this._close();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
this._file = file;
|
||||
this._name = name;
|
||||
|
||||
this._readable = true;
|
||||
this._writable = true;
|
||||
|
||||
this._forwardEvents();
|
||||
}
|
||||
|
||||
protected _write(data: string): void {
|
||||
this._defer(this._doWrite, data);
|
||||
}
|
||||
|
||||
private _doWrite(data: string): void {
|
||||
this._agent.inSocket.write(data);
|
||||
}
|
||||
|
||||
/**
|
||||
* openpty
|
||||
*/
|
||||
|
||||
public static open(options?: IPtyOpenOptions): void {
|
||||
throw new Error('open() not supported on windows, use Fork() instead.');
|
||||
}
|
||||
|
||||
/**
|
||||
* TTY
|
||||
*/
|
||||
|
||||
public resize(cols: number, rows: number): void {
|
||||
if (cols <= 0 || rows <= 0 || isNaN(cols) || isNaN(rows) || cols === Infinity || rows === Infinity) {
|
||||
throw new Error('resizing must be done using positive cols and rows');
|
||||
}
|
||||
this._deferNoArgs(() => {
|
||||
this._agent.resize(cols, rows);
|
||||
this._cols = cols;
|
||||
this._rows = rows;
|
||||
});
|
||||
}
|
||||
|
||||
public clear(): void {
|
||||
this._deferNoArgs(() => {
|
||||
this._agent.clear();
|
||||
});
|
||||
}
|
||||
|
||||
public destroy(): void {
|
||||
this._deferNoArgs(() => {
|
||||
this.kill();
|
||||
});
|
||||
}
|
||||
|
||||
public kill(signal?: string): void {
|
||||
this._deferNoArgs(() => {
|
||||
if (signal) {
|
||||
throw new Error('Signals not supported on windows.');
|
||||
}
|
||||
this._close();
|
||||
this._agent.kill();
|
||||
});
|
||||
}
|
||||
|
||||
private _deferNoArgs<A>(deferredFn: () => void): void {
|
||||
// If the terminal is ready, execute.
|
||||
if (this._isReady) {
|
||||
deferredFn.call(this);
|
||||
return;
|
||||
}
|
||||
|
||||
// Queue until terminal is ready.
|
||||
this._deferreds.push({
|
||||
run: () => deferredFn.call(this)
|
||||
});
|
||||
}
|
||||
|
||||
private _defer<A>(deferredFn: (arg: A) => void, arg: A): void {
|
||||
// If the terminal is ready, execute.
|
||||
if (this._isReady) {
|
||||
deferredFn.call(this, arg);
|
||||
return;
|
||||
}
|
||||
|
||||
// Queue until terminal is ready.
|
||||
this._deferreds.push({
|
||||
run: () => deferredFn.call(this, arg)
|
||||
});
|
||||
}
|
||||
|
||||
public get process(): string { return this._name; }
|
||||
public get master(): Socket { throw new Error('master is not supported on Windows'); }
|
||||
public get slave(): Socket { throw new Error('slave is not supported on Windows'); }
|
||||
}
|
||||
22
src/pty/worker/conoutSocketWorker.ts
Normal file
22
src/pty/worker/conoutSocketWorker.ts
Normal file
@@ -0,0 +1,22 @@
|
||||
/**
|
||||
* Copyright (c) 2020, Microsoft Corporation (MIT License).
|
||||
*/
|
||||
|
||||
import { parentPort, workerData } from 'worker_threads';
|
||||
import { Socket, createServer } from 'net';
|
||||
import { ConoutWorkerMessage, IWorkerData, getWorkerPipeName } from '@homebridge/node-pty-prebuilt-multiarch/src/shared/conout';
|
||||
|
||||
const conoutPipeName = (workerData as IWorkerData).conoutPipeName;
|
||||
const conoutSocket = new Socket();
|
||||
conoutSocket.setEncoding('utf8');
|
||||
conoutSocket.connect(conoutPipeName, () => {
|
||||
const server = createServer(workerSocket => {
|
||||
conoutSocket.pipe(workerSocket);
|
||||
});
|
||||
server.listen(getWorkerPipeName(conoutPipeName));
|
||||
|
||||
if (!parentPort) {
|
||||
throw new Error('worker_threads parentPort is null');
|
||||
}
|
||||
parentPort.postMessage(ConoutWorkerMessage.READY);
|
||||
});
|
||||
@@ -1,3 +1,2 @@
|
||||
import { NCoreInitShell } from './base';
|
||||
|
||||
import { NCoreInitShell } from "./base";
|
||||
NCoreInitShell();
|
||||
@@ -3,6 +3,7 @@
|
||||
*/
|
||||
|
||||
import express from 'express';
|
||||
import { createServer } from 'http';
|
||||
import { LogWrapper } from '@/common/log';
|
||||
import { NapCatPathWrapper } from '@/common/path';
|
||||
import { WebUiConfigWrapper } from '@webapi/helper/config';
|
||||
@@ -11,10 +12,11 @@ import { cors } from '@webapi/middleware/cors';
|
||||
import { createUrl } from '@webapi/utils/url';
|
||||
import { sendSuccess } from '@webapi/utils/response';
|
||||
import { join } from 'node:path';
|
||||
import { terminalManager } from '@webapi/terminal/terminal_manager';
|
||||
|
||||
// 实例化Express
|
||||
const app = express();
|
||||
|
||||
const server = createServer(app);
|
||||
/**
|
||||
* 初始化并启动WebUI服务。
|
||||
* 该函数配置了Express服务器以支持JSON解析和静态文件服务，并监听6099端口。
|
||||
@@ -45,6 +47,10 @@ export async function InitWebUi(logger: LogWrapper, pathWrapper: NapCatPathWrapp
|
||||
// ------------挂载路由------------
|
||||
// 挂载静态路由（前端），路径为 [/前缀]/webui
|
||||
app.use('/webui', express.static(pathWrapper.staticPath));
|
||||
// 初始化WebSocket服务器
|
||||
server.on('upgrade', (request, socket, head) => {
|
||||
terminalManager.initialize(request, socket, head, logger);
|
||||
});
|
||||
// 挂载API接口
|
||||
app.use('/api', ALLRouter);
|
||||
// 所有剩下的请求都转到静态页面
|
||||
@@ -61,7 +67,7 @@ export async function InitWebUi(logger: LogWrapper, pathWrapper: NapCatPathWrapp
|
||||
// ------------路由挂载结束------------
|
||||
|
||||
// ------------启动服务------------
|
||||
app.listen(config.port, config.host, async () => {
|
||||
server.listen(config.port, config.host, async () => {
|
||||
// 启动后打印出相关地址
|
||||
const port = config.port.toString(),
|
||||
searchParams = { token: config.token };
|
||||
|
||||
261
src/webui/src/api/File.ts
Normal file
261
src/webui/src/api/File.ts
Normal file
@@ -0,0 +1,261 @@
|
||||
import type { RequestHandler } from 'express';
|
||||
import { sendError, sendSuccess } from '../utils/response';
|
||||
import fs from 'fs/promises';
|
||||
import path from 'path';
|
||||
import os from 'os';
|
||||
|
||||
const isWindows = os.platform() === 'win32';
|
||||
|
||||
// 获取系统根目录列表（Windows返回盘符列表，其他系统返回['/']）
|
||||
const getRootDirs = async (): Promise<string[]> => {
|
||||
if (!isWindows) return ['/'];
|
||||
|
||||
// Windows 驱动器字母 (A-Z)
|
||||
const drives: string[] = [];
|
||||
for (let i = 65; i <= 90; i++) {
|
||||
const driveLetter = String.fromCharCode(i);
|
||||
try {
|
||||
await fs.access(`${driveLetter}:\\`);
|
||||
drives.push(`${driveLetter}:`);
|
||||
} catch {
|
||||
// 如果驱动器不存在或无法访问，跳过
|
||||
continue;
|
||||
}
|
||||
}
|
||||
return drives.length > 0 ? drives : ['C:'];
|
||||
};
|
||||
|
||||
// 规范化路径
|
||||
const normalizePath = (inputPath: string): string => {
|
||||
if (!inputPath) return isWindows ? 'C:\\' : '/';
|
||||
// 如果是Windows且输入为纯盘符（可能带或不带斜杠），统一返回 "X:\"
|
||||
if (isWindows && /^[A-Z]:[\\/]*$/i.test(inputPath)) {
|
||||
return inputPath.slice(0, 2) + '\\';
|
||||
}
|
||||
return path.normalize(inputPath);
|
||||
};
|
||||
|
||||
interface FileInfo {
|
||||
name: string;
|
||||
isDirectory: boolean;
|
||||
size: number;
|
||||
mtime: Date;
|
||||
}
|
||||
|
||||
// 添加系统文件黑名单
|
||||
const SYSTEM_FILES = new Set(['pagefile.sys', 'swapfile.sys', 'hiberfil.sys', 'System Volume Information']);
|
||||
|
||||
// 检查同类型的文件或目录是否存在
|
||||
const checkSameTypeExists = async (pathToCheck: string, isDirectory: boolean): Promise<boolean> => {
|
||||
try {
|
||||
const stat = await fs.stat(pathToCheck);
|
||||
// 只有当类型相同时才认为是冲突
|
||||
return stat.isDirectory() === isDirectory;
|
||||
} catch {
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
// 获取目录内容
|
||||
export const ListFilesHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const requestPath = (req.query.path as string) || (isWindows ? 'C:\\' : '/');
|
||||
const normalizedPath = normalizePath(requestPath);
|
||||
const onlyDirectory = req.query.onlyDirectory === 'true';
|
||||
|
||||
// 如果是根路径且在Windows系统上，返回盘符列表
|
||||
if (isWindows && (!requestPath || requestPath === '/' || requestPath === '\\')) {
|
||||
const drives = await getRootDirs();
|
||||
const driveInfos: FileInfo[] = await Promise.all(
|
||||
drives.map(async (drive) => {
|
||||
try {
|
||||
const stat = await fs.stat(`${drive}\\`);
|
||||
return {
|
||||
name: drive,
|
||||
isDirectory: true,
|
||||
size: 0,
|
||||
mtime: stat.mtime,
|
||||
};
|
||||
} catch {
|
||||
return {
|
||||
name: drive,
|
||||
isDirectory: true,
|
||||
size: 0,
|
||||
mtime: new Date(),
|
||||
};
|
||||
}
|
||||
})
|
||||
);
|
||||
return sendSuccess(res, driveInfos);
|
||||
}
|
||||
|
||||
const files = await fs.readdir(normalizedPath);
|
||||
let fileInfos: FileInfo[] = [];
|
||||
|
||||
for (const file of files) {
|
||||
// 跳过系统文件
|
||||
if (SYSTEM_FILES.has(file)) continue;
|
||||
|
||||
try {
|
||||
const fullPath = path.join(normalizedPath, file);
|
||||
const stat = await fs.stat(fullPath);
|
||||
fileInfos.push({
|
||||
name: file,
|
||||
isDirectory: stat.isDirectory(),
|
||||
size: stat.size,
|
||||
mtime: stat.mtime,
|
||||
});
|
||||
} catch (error) {
|
||||
// 忽略无法访问的文件
|
||||
// console.warn(`无法访问文件 ${file}:`, error);
|
||||
continue;
|
||||
}
|
||||
}
|
||||
|
||||
// 如果请求参数 onlyDirectory 为 true，则只返回目录信息
|
||||
if (onlyDirectory) {
|
||||
fileInfos = fileInfos.filter((info) => info.isDirectory);
|
||||
}
|
||||
|
||||
return sendSuccess(res, fileInfos);
|
||||
} catch (error) {
|
||||
console.error('读取目录失败:', error);
|
||||
return sendError(res, '读取目录失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 创建目录
|
||||
export const CreateDirHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { path: dirPath } = req.body;
|
||||
const normalizedPath = normalizePath(dirPath);
|
||||
|
||||
// 检查是否已存在同类型（目录）
|
||||
if (await checkSameTypeExists(normalizedPath, true)) {
|
||||
return sendError(res, '同名目录已存在');
|
||||
}
|
||||
|
||||
await fs.mkdir(normalizedPath, { recursive: true });
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '创建目录失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 删除文件/目录
|
||||
export const DeleteHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { path: targetPath } = req.body;
|
||||
const normalizedPath = normalizePath(targetPath);
|
||||
const stat = await fs.stat(normalizedPath);
|
||||
if (stat.isDirectory()) {
|
||||
await fs.rm(normalizedPath, { recursive: true });
|
||||
} else {
|
||||
await fs.unlink(normalizedPath);
|
||||
}
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '删除失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 批量删除文件/目录
|
||||
export const BatchDeleteHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { paths } = req.body;
|
||||
for (const targetPath of paths) {
|
||||
const normalizedPath = normalizePath(targetPath);
|
||||
const stat = await fs.stat(normalizedPath);
|
||||
if (stat.isDirectory()) {
|
||||
await fs.rm(normalizedPath, { recursive: true });
|
||||
} else {
|
||||
await fs.unlink(normalizedPath);
|
||||
}
|
||||
}
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '批量删除失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 读取文件内容
|
||||
export const ReadFileHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const filePath = normalizePath(req.query.path as string);
|
||||
const content = await fs.readFile(filePath, 'utf-8');
|
||||
return sendSuccess(res, content);
|
||||
} catch (error) {
|
||||
return sendError(res, '读取文件失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 写入文件内容
|
||||
export const WriteFileHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { path: filePath, content } = req.body;
|
||||
const normalizedPath = normalizePath(filePath);
|
||||
await fs.writeFile(normalizedPath, content, 'utf-8');
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '写入文件失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 创建新文件
|
||||
export const CreateFileHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { path: filePath } = req.body;
|
||||
const normalizedPath = normalizePath(filePath);
|
||||
|
||||
// 检查是否已存在同类型（文件）
|
||||
if (await checkSameTypeExists(normalizedPath, false)) {
|
||||
return sendError(res, '同名文件已存在');
|
||||
}
|
||||
|
||||
await fs.writeFile(normalizedPath, '', 'utf-8');
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '创建文件失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 重命名文件/目录
|
||||
export const RenameHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { oldPath, newPath } = req.body;
|
||||
const normalizedOldPath = normalizePath(oldPath);
|
||||
const normalizedNewPath = normalizePath(newPath);
|
||||
await fs.rename(normalizedOldPath, normalizedNewPath);
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '重命名失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 移动文件/目录
|
||||
export const MoveHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { sourcePath, targetPath } = req.body;
|
||||
const normalizedSourcePath = normalizePath(sourcePath);
|
||||
const normalizedTargetPath = normalizePath(targetPath);
|
||||
await fs.rename(normalizedSourcePath, normalizedTargetPath);
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '移动失败');
|
||||
}
|
||||
};
|
||||
|
||||
// 批量移动
|
||||
export const BatchMoveHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { items } = req.body;
|
||||
for (const { sourcePath, targetPath } of items) {
|
||||
const normalizedSourcePath = normalizePath(sourcePath);
|
||||
const normalizedTargetPath = normalizePath(targetPath);
|
||||
await fs.rename(normalizedSourcePath, normalizedTargetPath);
|
||||
}
|
||||
return sendSuccess(res, true);
|
||||
} catch (error) {
|
||||
return sendError(res, '批量移动失败');
|
||||
}
|
||||
};
|
||||
@@ -2,6 +2,7 @@ import type { RequestHandler } from 'express';
|
||||
import { sendError, sendSuccess } from '../utils/response';
|
||||
import { WebUiConfigWrapper } from '../helper/config';
|
||||
import { logSubscription } from '@/common/log';
|
||||
import { terminalManager } from '../terminal/terminal_manager';
|
||||
|
||||
// 日志记录
|
||||
export const LogHandler: RequestHandler = async (req, res) => {
|
||||
@@ -35,3 +36,25 @@ export const LogRealTimeHandler: RequestHandler = async (req, res) => {
|
||||
logSubscription.unsubscribe(listener);
|
||||
});
|
||||
};
|
||||
|
||||
// 终端相关处理器
|
||||
export const CreateTerminalHandler: RequestHandler = async (req, res) => {
|
||||
try {
|
||||
const { id } = terminalManager.createTerminal();
|
||||
return sendSuccess(res, { id });
|
||||
} catch (error) {
|
||||
console.error('Failed to create terminal:', error);
|
||||
return sendError(res, '创建终端失败');
|
||||
}
|
||||
};
|
||||
|
||||
export const GetTerminalListHandler: RequestHandler = (_, res) => {
|
||||
const list = terminalManager.getTerminalList();
|
||||
return sendSuccess(res, list);
|
||||
};
|
||||
|
||||
export const CloseTerminalHandler: RequestHandler = (req, res) => {
|
||||
const id = req.params.id;
|
||||
terminalManager.closeTerminal(id);
|
||||
return sendSuccess(res, {});
|
||||
};
|
||||
|
||||
36
src/webui/src/router/File.ts
Normal file
36
src/webui/src/router/File.ts
Normal file
@@ -0,0 +1,36 @@
|
||||
import { Router } from 'express';
|
||||
import rateLimit from 'express-rate-limit';
|
||||
import {
|
||||
ListFilesHandler,
|
||||
CreateDirHandler,
|
||||
DeleteHandler,
|
||||
ReadFileHandler,
|
||||
WriteFileHandler,
|
||||
CreateFileHandler,
|
||||
BatchDeleteHandler, // 添加这一行
|
||||
RenameHandler,
|
||||
MoveHandler,
|
||||
BatchMoveHandler,
|
||||
} from '../api/File';
|
||||
|
||||
const router = Router();
|
||||
|
||||
const apiLimiter = rateLimit({
|
||||
windowMs: 1 * 60 * 1000, // 1分钟内
|
||||
max: 60, // 最大60个请求
|
||||
});
|
||||
|
||||
router.use(apiLimiter);
|
||||
|
||||
router.get('/list', ListFilesHandler);
|
||||
router.post('/mkdir', CreateDirHandler);
|
||||
router.post('/delete', DeleteHandler);
|
||||
router.get('/read', ReadFileHandler);
|
||||
router.post('/write', WriteFileHandler);
|
||||
router.post('/create', CreateFileHandler);
|
||||
router.post('/batchDelete', BatchDeleteHandler);
|
||||
router.post('/rename', RenameHandler);
|
||||
router.post('/move', MoveHandler);
|
||||
router.post('/batchMove', BatchMoveHandler);
|
||||
|
||||
export { router as FileRouter };
|
||||
@@ -1,13 +1,23 @@
|
||||
import { Router } from 'express';
|
||||
import { LogHandler, LogListHandler, LogRealTimeHandler } from '../api/Log';
|
||||
import {
|
||||
LogHandler,
|
||||
LogListHandler,
|
||||
LogRealTimeHandler,
|
||||
CreateTerminalHandler,
|
||||
GetTerminalListHandler,
|
||||
CloseTerminalHandler,
|
||||
} from '../api/Log';
|
||||
|
||||
const router = Router();
|
||||
// router:读取日志内容
|
||||
router.get('/GetLog', LogHandler);
|
||||
// router:读取日志列表
|
||||
router.get('/GetLogList', LogListHandler);
|
||||
|
||||
// router:实时日志
|
||||
// 日志相关路由
|
||||
router.get('/GetLog', LogHandler);
|
||||
router.get('/GetLogList', LogListHandler);
|
||||
router.get('/GetLogRealTime', LogRealTimeHandler);
|
||||
|
||||
// 终端相关路由
|
||||
router.get('/terminal/list', GetTerminalListHandler);
|
||||
router.post('/terminal/create', CreateTerminalHandler);
|
||||
router.post('/terminal/:id/close', CloseTerminalHandler);
|
||||
|
||||
export { router as LogRouter };
|
||||
|
||||
@@ -12,6 +12,7 @@ import { QQLoginRouter } from '@webapi/router/QQLogin';
|
||||
import { AuthRouter } from '@webapi/router/auth';
|
||||
import { LogRouter } from '@webapi/router/Log';
|
||||
import { BaseRouter } from '@webapi/router/Base';
|
||||
import { FileRouter } from './File';
|
||||
|
||||
const router = Router();
|
||||
|
||||
@@ -32,5 +33,7 @@ router.use('/QQLogin', QQLoginRouter);
|
||||
router.use('/OB11Config', OB11ConfigRouter);
|
||||
// router:日志相关路由
|
||||
router.use('/Log', LogRouter);
|
||||
// file:文件相关路由
|
||||
router.use('/File', FileRouter);
|
||||
|
||||
export { router as ALLRouter };
|
||||
|
||||
21
src/webui/src/terminal/init-dynamic-dirname.ts
Normal file
21
src/webui/src/terminal/init-dynamic-dirname.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
import path from 'path';
|
||||
|
||||
Object.defineProperty(global, '__dirname', {
|
||||
get() {
|
||||
const err = new Error();
|
||||
const stack = err.stack?.split('\n') || [];
|
||||
let callerFile = '';
|
||||
// 遍历错误堆栈，跳过当前文件所在行
|
||||
// 注意：堆栈格式可能不同，请根据实际环境调整索引及正则表达式
|
||||
for (const line of stack) {
|
||||
const match = line.match(/\((.*):\d+:\d+\)/);
|
||||
if (match) {
|
||||
callerFile = match[1];
|
||||
if (!callerFile.includes('init-dynamic-dirname.ts')) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
return callerFile ? path.dirname(callerFile) : '';
|
||||
},
|
||||
});
|
||||
175
src/webui/src/terminal/terminal_manager.ts
Normal file
175
src/webui/src/terminal/terminal_manager.ts
Normal file
@@ -0,0 +1,175 @@
|
||||
import './init-dynamic-dirname';
|
||||
import { WebUiConfig } from '@/webui';
|
||||
import { AuthHelper } from '../helper/SignToken';
|
||||
import { LogWrapper } from '@/common/log';
|
||||
import { WebSocket, WebSocketServer } from 'ws';
|
||||
import os from 'os';
|
||||
import { IPty, spawn as ptySpawn } from '@/pty';
|
||||
import { randomUUID } from 'crypto';
|
||||
|
||||
interface TerminalInstance {
|
||||
pty: IPty; // 改用 PTY 实例
|
||||
lastAccess: number;
|
||||
sockets: Set<WebSocket>;
|
||||
// 新增标识，用于防止重复关闭
|
||||
isClosing: boolean;
|
||||
}
|
||||
|
||||
class TerminalManager {
|
||||
private terminals: Map<string, TerminalInstance> = new Map();
|
||||
private wss: WebSocketServer | null = null;
|
||||
|
||||
initialize(req: any, socket: any, head: any, logger?: LogWrapper) {
|
||||
logger?.log('[NapCat] [WebUi] terminal websocket initialized');
|
||||
this.wss = new WebSocketServer({
|
||||
noServer: true,
|
||||
verifyClient: async (info, cb) => {
|
||||
// 验证 token
|
||||
const url = new URL(info.req.url || '', 'ws://localhost');
|
||||
const token = url.searchParams.get('token');
|
||||
const terminalId = url.searchParams.get('id');
|
||||
|
||||
if (!token || !terminalId) {
|
||||
cb(false, 401, 'Unauthorized');
|
||||
return;
|
||||
}
|
||||
|
||||
// 解析token
|
||||
let Credential: WebUiCredentialJson;
|
||||
try {
|
||||
Credential = JSON.parse(Buffer.from(token, 'base64').toString('utf-8'));
|
||||
} catch (e) {
|
||||
cb(false, 401, 'Unauthorized');
|
||||
return;
|
||||
}
|
||||
const config = await WebUiConfig.GetWebUIConfig();
|
||||
const validate = AuthHelper.validateCredentialWithinOneHour(config.token, Credential);
|
||||
if (!validate) {
|
||||
cb(false, 401, 'Unauthorized');
|
||||
return;
|
||||
}
|
||||
cb(true);
|
||||
},
|
||||
});
|
||||
this.wss.handleUpgrade(req, socket, head, (ws) => {
|
||||
this.wss?.emit('connection', ws, req);
|
||||
});
|
||||
this.wss.on('connection', async (ws, req) => {
|
||||
logger?.log('建立终端连接');
|
||||
try {
|
||||
const url = new URL(req.url || '', 'ws://localhost');
|
||||
const terminalId = url.searchParams.get('id')!;
|
||||
|
||||
const instance = this.terminals.get(terminalId);
|
||||
|
||||
if (!instance) {
|
||||
ws.close();
|
||||
return;
|
||||
}
|
||||
|
||||
const dataHandler = (data: string) => {
|
||||
if (ws.readyState === WebSocket.OPEN) {
|
||||
ws.send(JSON.stringify({ type: 'output', data }));
|
||||
}
|
||||
};
|
||||
|
||||
instance.sockets.add(ws);
|
||||
instance.lastAccess = Date.now();
|
||||
|
||||
ws.on('message', (data) => {
|
||||
if (instance) {
|
||||
const result = JSON.parse(data.toString());
|
||||
if (result.type === 'input') {
|
||||
instance.pty.write(result.data);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
ws.on('close', () => {
|
||||
instance.sockets.delete(ws);
|
||||
if (instance.sockets.size === 0 && !instance.isClosing) {
|
||||
instance.isClosing = true;
|
||||
if (os.platform() === 'win32') {
|
||||
process.kill(instance.pty.pid);
|
||||
} else {
|
||||
instance.pty.kill();
|
||||
}
|
||||
}
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('WebSocket authentication failed:', err);
|
||||
ws.close();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 修改：移除参数 id，使用 crypto.randomUUID 生成终端 id
|
||||
createTerminal() {
|
||||
const id = randomUUID();
|
||||
const shell = os.platform() === 'win32' ? 'powershell.exe' : 'bash';
|
||||
const pty = ptySpawn(shell, [], {
|
||||
name: 'xterm-256color',
|
||||
cols: 80,
|
||||
rows: 24,
|
||||
cwd: process.cwd(),
|
||||
env: {
|
||||
...process.env,
|
||||
// 统一编码设置
|
||||
LANG: os.platform() === 'win32' ? 'chcp 65001' : 'zh_CN.UTF-8',
|
||||
TERM: 'xterm-256color',
|
||||
},
|
||||
});
|
||||
|
||||
const instance: TerminalInstance = {
|
||||
pty,
|
||||
lastAccess: Date.now(),
|
||||
sockets: new Set(),
|
||||
isClosing: false,
|
||||
};
|
||||
|
||||
pty.onData((data: any) => {
|
||||
instance.sockets.forEach((ws) => {
|
||||
if (ws.readyState === WebSocket.OPEN) {
|
||||
ws.send(JSON.stringify({ type: 'output', data }));
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
pty.onExit(() => {
|
||||
this.closeTerminal(id);
|
||||
});
|
||||
|
||||
this.terminals.set(id, instance);
|
||||
// 返回生成的 id 及对应实例，方便后续通知客户端使用该 id
|
||||
return { id, instance };
|
||||
}
|
||||
|
||||
closeTerminal(id: string) {
|
||||
const instance = this.terminals.get(id);
|
||||
if (instance) {
|
||||
if (!instance.isClosing) {
|
||||
instance.isClosing = true;
|
||||
if (os.platform() === 'win32') {
|
||||
process.kill(instance.pty.pid);
|
||||
} else {
|
||||
instance.pty.kill();
|
||||
}
|
||||
}
|
||||
instance.sockets.forEach((ws) => ws.close());
|
||||
this.terminals.delete(id);
|
||||
}
|
||||
}
|
||||
|
||||
getTerminal(id: string) {
|
||||
return this.terminals.get(id);
|
||||
}
|
||||
|
||||
getTerminalList() {
|
||||
return Array.from(this.terminals.keys()).map((id) => ({
|
||||
id,
|
||||
lastAccess: this.terminals.get(id)!.lastAccess,
|
||||
}));
|
||||
}
|
||||
}
|
||||
|
||||
export const terminalManager = new TerminalManager();
|
||||
@@ -4,7 +4,14 @@ import { resolve } from 'path';
|
||||
import nodeResolve from '@rollup/plugin-node-resolve';
|
||||
import { builtinModules } from 'module';
|
||||
//依赖排除
|
||||
const external = ['silk-wasm', 'ws', 'express', 'qrcode-terminal', 'piscina', '@ffmpeg.wasm/core-mt', "@ffmpeg.wasm/main"];
|
||||
const external = [
|
||||
'silk-wasm',
|
||||
'ws',
|
||||
'express',
|
||||
'qrcode-terminal',
|
||||
'piscina',
|
||||
'@ffmpeg.wasm/core-mt'
|
||||
];
|
||||
const nodeModules = [...builtinModules, builtinModules.map((m) => `node:${m}`)].flat();
|
||||
|
||||
let startScripts: string[] | undefined = undefined;
|
||||
@@ -22,6 +29,7 @@ const UniversalBaseConfigPlugin: PluginOption[] = [
|
||||
{ src: './manifest.json', dest: 'dist' },
|
||||
{ src: './src/core/external/napcat.json', dest: 'dist/config/' },
|
||||
{ src: './src/native/packet', dest: 'dist/moehoo', flatten: false },
|
||||
{ src: './src/native/pty', dest: 'dist/pty', flatten: false },
|
||||
{ src: './napcat.webui/dist/', dest: 'dist/static/', flatten: false },
|
||||
{ src: './src/framework/liteloader.cjs', dest: 'dist' },
|
||||
{ src: './src/framework/napcat.cjs', dest: 'dist' },
|
||||
@@ -44,6 +52,7 @@ const FrameworkBaseConfigPlugin: PluginOption[] = [
|
||||
{ src: './manifest.json', dest: 'dist' },
|
||||
{ src: './src/core/external/napcat.json', dest: 'dist/config/' },
|
||||
{ src: './src/native/packet', dest: 'dist/moehoo', flatten: false },
|
||||
{ src: './src/native/pty', dest: 'dist/pty', flatten: false },
|
||||
{ src: './napcat.webui/dist/', dest: 'dist/static/', flatten: false },
|
||||
{ src: './src/framework/liteloader.cjs', dest: 'dist' },
|
||||
{ src: './src/framework/napcat.cjs', dest: 'dist' },
|
||||
@@ -56,11 +65,11 @@ const FrameworkBaseConfigPlugin: PluginOption[] = [
|
||||
nodeResolve(),
|
||||
];
|
||||
|
||||
|
||||
const ShellBaseConfigPlugin: PluginOption[] = [
|
||||
cp({
|
||||
targets: [
|
||||
{ src: './src/native/packet', dest: 'dist/moehoo', flatten: false },
|
||||
{ src: './src/native/pty', dest: 'dist/pty', flatten: false },
|
||||
{ src: './napcat.webui/dist/', dest: 'dist/static/', flatten: false },
|
||||
{ src: './src/core/external/napcat.json', dest: 'dist/config/' },
|
||||
{ src: './package.json', dest: 'dist' },
|
||||
@@ -91,6 +100,7 @@ const UniversalBaseConfig = () =>
|
||||
napcat: 'src/universal/napcat.ts',
|
||||
'audio-worker': 'src/common/audio-worker.ts',
|
||||
'ffmpeg-worker': 'src/common/ffmpeg-worker.ts',
|
||||
'worker/conoutSocketWorker': 'src/pty/worker/conoutSocketWorker.ts',
|
||||
},
|
||||
formats: ['es'],
|
||||
fileName: (_, entryName) => `${entryName}.mjs`,
|
||||
@@ -101,7 +111,6 @@ const UniversalBaseConfig = () =>
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
const ShellBaseConfig = () =>
|
||||
defineConfig({
|
||||
resolve: {
|
||||
@@ -121,6 +130,7 @@ const ShellBaseConfig = () =>
|
||||
napcat: 'src/shell/napcat.ts',
|
||||
'audio-worker': 'src/common/audio-worker.ts',
|
||||
'ffmpeg-worker': 'src/common/ffmpeg-worker.ts',
|
||||
'worker/conoutSocketWorker': 'src/pty/worker/conoutSocketWorker.ts',
|
||||
},
|
||||
formats: ['es'],
|
||||
fileName: (_, entryName) => `${entryName}.mjs`,
|
||||
@@ -150,6 +160,7 @@ const FrameworkBaseConfig = () =>
|
||||
napcat: 'src/framework/napcat.ts',
|
||||
'audio-worker': 'src/common/audio-worker.ts',
|
||||
'ffmpeg-worker': 'src/common/ffmpeg-worker.ts',
|
||||
'worker/conoutSocketWorker': 'src/pty/worker/conoutSocketWorker.ts',
|
||||
},
|
||||
formats: ['es'],
|
||||
fileName: (_, entryName) => `${entryName}.mjs`,
|
||||
|
||||
Reference in New Issue
Block a user