Skip to content

Commit

Permalink
->优化TS
Browse files Browse the repository at this point in the history
  • Loading branch information
LeafYeeXYZ committed Apr 30, 2024
1 parent d1954fc commit d43cd0d
Show file tree
Hide file tree
Showing 2 changed files with 18 additions and 20 deletions.
34 changes: 16 additions & 18 deletions src/components/Prompt.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,13 +44,12 @@ class ErrorInfo {

function Prompt({ children, images, setImages, dialogAction, zhMode, status }: PromptProps) {
// 引用元素
const submitRef: React.MutableRefObject<HTMLButtonElement | null> = useRef(null)
const promptRef: React.MutableRefObject<HTMLTextAreaElement | null> = useRef(null)
const modelRef: React.MutableRefObject<HTMLSelectElement | null> = useRef(null)
const submitRef = useRef<HTMLButtonElement>(null)
const promptRef = useRef<HTMLTextAreaElement>(null)
const modelRef = useRef<HTMLSelectElement>(null)
// 点击生成按钮时的事件处理函数
async function handleSubmit(event: React.MouseEvent, prompt?: string) {
event.preventDefault()
if (!submitRef.current || !promptRef.current || !modelRef.current) return
if (status.current) {
dialogAction({ type: 'open', title: '提示', content: `请等待${status.current}完成` })
return
Expand All @@ -59,15 +58,15 @@ function Prompt({ children, images, setImages, dialogAction, zhMode, status }: P
}
try {
// 禁用按钮
submitRef.current.disabled = true
submitRef.current!.disabled = true
// 设置按钮文本
submitRef.current.textContent = '生成中...'
submitRef.current!.textContent = '生成中...'
// 获取用户输入的提示词
const text = prompt || promptRef.current.value
const text = prompt || promptRef.current!.value
// 如果用户没有输入提示词,不发送请求
if (!text) throw new ErrorInfo('提示', '请输入提示词', false)
// 获取模型名称
const model = modelRef.current.value
const model = modelRef.current!.value
// 如果没有选择模型,不发送请求
if (!model) throw new ErrorInfo('提示', '请选择模型', false)
// 插入加载图片
Expand Down Expand Up @@ -108,37 +107,36 @@ function Prompt({ children, images, setImages, dialogAction, zhMode, status }: P
}
} finally {
// 启用按钮
submitRef.current.disabled = false
submitRef.current!.disabled = false
// 设置按钮文本
submitRef.current.textContent = '生成'
submitRef.current!.textContent = '生成'
// 重置状态
status.current = ''
}
}
// 中文模式的事件处理函数
async function handleSubmitZH(event: React.MouseEvent) {
event.preventDefault()
if (!submitRef.current || !promptRef.current) return
if (status.current) {
dialogAction({ type: 'open', title: '提示', content: `请等待${status.current}完成` })
return
} else {
status.current = '翻译提示词'
}
// 禁用按钮
submitRef.current.disabled = true
submitRef.current!.disabled = true
// 设置按钮文本
submitRef.current.textContent = '翻译中...'
submitRef.current!.textContent = '翻译中...'
// 获取用户输入的提示词
const textZH = promptRef.current.value
const textZH = promptRef.current!.value
// 如果没有输入提示词,不发送请求
if (!textZH) {
// 打开对话框
dialogAction({ type: 'open', title: '生成失败', content: '请输入提示词' })
// 启用按钮
submitRef.current.disabled = false
submitRef.current!.disabled = false
// 设置按钮文本
submitRef.current.textContent = '生成'
submitRef.current!.textContent = '生成'
// 退出
return
}
Expand All @@ -163,9 +161,9 @@ function Prompt({ children, images, setImages, dialogAction, zhMode, status }: P
// 打开对话框
dialogAction({ type: 'open', title: '翻译失败', content: `${error.name}: ${error.message} (请尝试使用英文模式)` })
// 启用按钮
submitRef.current.disabled = false
submitRef.current!.disabled = false
// 设置按钮文本
submitRef.current.textContent = '生成'
submitRef.current!.textContent = '生成'
// 退出
return
} finally {
Expand Down
4 changes: 2 additions & 2 deletions src/libs/useDialog.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -33,13 +33,13 @@ function reducer(state: DialogState, action: DialogAction): DialogState {
type UseDialogReturns = {
dialogState: DialogState
dialogAction: React.Dispatch<DialogAction>
dialogRef: React.MutableRefObject<null>
dialogRef: React.RefObject<HTMLDialogElement>
}

/** 创建一个对话框的 Hook */
export function useDialog(): UseDialogReturns {
// 创建一个对话框的引用
const dialogRef = useRef(null)
const dialogRef = useRef<HTMLDialogElement>(null)
// 使用 useReducer
const [dialogState, dialogAction] = useReducer(reducer, { title: '', content: '', ele: dialogRef })
// 返回操作函数
Expand Down

0 comments on commit d43cd0d

Please sign in to comment.