问答助手反馈解决赞同类型记录不了的问题,是由于代码中只针对反对类型进行了记录,并增加 isSubmittingNow 是否提交中的state,已经使用useEffect这个React的hook进行监听状态变化,解决React 的状态更新是 异步的 ,而且函数闭包会捕获旧值,导致提交到后台接口中的反馈内容、消息ID、会话ID获取到的是之前的问题,并完成取消赞同和取消反对功能

This commit is contained in:
wenyongda 2025-07-22 17:02:55 +08:00
parent d2d96ab315
commit 36f93db93f
2 changed files with 45 additions and 19 deletions

View File

@ -1,5 +1,6 @@
import React, { useState } from 'react';
import { Modal, Checkbox, Input, message } from 'antd';
import { useTranslation } from 'react-i18next'
const { TextArea } = Input;
@ -12,10 +13,10 @@ interface FeedbackModalProps {
const FeedbackModal: React.FC<FeedbackModalProps> = ({ open, onOk, onCancel }) => {
const [selectedOption, setSelectedOption] = useState<number | null>(null);
const [feedbackText, setFeedbackText] = useState<string>('');
const { t } = useTranslation()
const handleOk = () => {
if (selectedOption === null || !feedbackText) {
message.warning('请选择操作类型并填写反馈建议');
if (!feedbackText) {
message.warning('请填写反馈建议');
return;
}
onOk(selectedOption, feedbackText);
@ -27,8 +28,10 @@ const FeedbackModal: React.FC<FeedbackModalProps> = ({ open, onOk, onCancel }) =
open={open}
onOk={handleOk}
onCancel={onCancel}
okText={`${t('common.operation.confirm')}`}
cancelText={`${t('common.operation.cancel')}`}
>
<div>
{/* <div>
<Checkbox
checked={selectedOption === 0}
onChange={() => setSelectedOption(0)}
@ -41,7 +44,7 @@ const FeedbackModal: React.FC<FeedbackModalProps> = ({ open, onOk, onCancel }) =
>
</Checkbox>
</div>
</div> */}
<TextArea
rows={4}
placeholder="请输入您的反馈建议"

View File

@ -538,22 +538,42 @@ export const useChatWithHistory = (installedAppInfo?: InstalledApp) => {
] = useState<string | null>(null);
const [resolveFeedback, setResolveFeedback] = useState<(value: boolean | PromiseLike<boolean>) => void | null>(null);
const [isSubmittingNow, setIsSubmittingNow] = useState(false); // 防止重复提交
const handleFeedback = useCallback(
(messageId: string, feedback: Feedback, conversationId: string) => {
return new Promise<boolean>((resolve) => {
console.log('handleFeedback', messageId, feedback, conversationId);
async (messageId: string, feedback: Feedback, conversationId: string) => {
console.log('feedback.rating ', feedback.rating);
setCurrentMessageId(messageId);
setCurrentFeedback(feedback);
setCurrentConversationIdForFeedback(conversationId);
if (feedback.rating === 'like') {
setIsSubmittingNow(true)
return true
} else if (!feedback.rating) {
setIsSubmittingNow(true)
return true
} else
{
return new Promise<boolean>(async (resolve) => {
console.log('handleFeedback', messageId, feedback, conversationId);
setIsFeedbackModalVisible(true);
setResolveFeedback(() => resolve);
})
}
},
[]
);
useEffect(() => {
if (isSubmittingNow) {
handleFeedbackSubmit(null, '')
}
})
const handleFeedbackSubmit = useCallback(
async (selectedOption: number | null, feedbackText: string) => {
console.log(currentMessageId);
@ -562,7 +582,7 @@ export const useChatWithHistory = (installedAppInfo?: InstalledApp) => {
try {
// 构造请求参数
const requestBody = {
operationType: selectedOption, // 0 或 1
operationType: currentFeedback!.rating, // 0 或 1
feedbackText, // 用户反馈建议
conversationId: currentConversationId, // 会话 ID
messageId: currentMessageId, // 消息 ID
@ -604,6 +624,8 @@ export const useChatWithHistory = (installedAppInfo?: InstalledApp) => {
} catch (error) {
console.error("Error:", error);
notify({ type: "error", message: t("common.api.failed") });
} finally {
setIsSubmittingNow(false);
}
},
[
@ -668,6 +690,7 @@ export const useChatWithHistory = (installedAppInfo?: InstalledApp) => {
}
setIsFeedbackModalVisible(false)
}}
// feedbackText={}
/>
),
};