|
@@ -2,12 +2,14 @@ import React, { useState, useRef, useEffect } from 'react'
|
|
|
import axios from 'axios'
|
|
import axios from 'axios'
|
|
|
import styles from './index.module.scss'
|
|
import styles from './index.module.scss'
|
|
|
import { decrypt } from '@/utils/encrypt'
|
|
import { decrypt } from '@/utils/encrypt'
|
|
|
|
|
+import ChartInput from '../ChartInput'
|
|
|
|
|
+import { useSelector } from 'react-redux'
|
|
|
|
|
+import { RootState } from '@/store'
|
|
|
|
|
|
|
|
const questions = [
|
|
const questions = [
|
|
|
'程哲碑有哪些特殊之处?',
|
|
'程哲碑有哪些特殊之处?',
|
|
|
'碑主程哲是一个怎样的人?',
|
|
'碑主程哲是一个怎样的人?',
|
|
|
- '程哲碑的造像艺术有何特点?',
|
|
|
|
|
- '什么是“碑禁政策”?'
|
|
|
|
|
|
|
+ '程哲碑的造像艺术有何特点?'
|
|
|
]
|
|
]
|
|
|
|
|
|
|
|
const FASTGPT_API_URL = 'https://cloud.fastgpt.cn/api'
|
|
const FASTGPT_API_URL = 'https://cloud.fastgpt.cn/api'
|
|
@@ -20,12 +22,16 @@ interface Message {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
function Chart() {
|
|
function Chart() {
|
|
|
|
|
+ const { isHH } = useSelector((state: RootState) => state.A0Layout)
|
|
|
const [messages, setMessages] = useState<Message[]>([])
|
|
const [messages, setMessages] = useState<Message[]>([])
|
|
|
const [inputValue, setInputValue] = useState('')
|
|
const [inputValue, setInputValue] = useState('')
|
|
|
const [isLoading, setIsLoading] = useState(false)
|
|
const [isLoading, setIsLoading] = useState(false)
|
|
|
const [showQuickQuestions, setShowQuickQuestions] = useState(true)
|
|
const [showQuickQuestions, setShowQuickQuestions] = useState(true)
|
|
|
|
|
+ const [showChartInput, setShowChartInput] = useState(false)
|
|
|
const messagesEndRef = useRef<HTMLDivElement>(null)
|
|
const messagesEndRef = useRef<HTMLDivElement>(null)
|
|
|
const inputRef = useRef<HTMLInputElement>(null)
|
|
const inputRef = useRef<HTMLInputElement>(null)
|
|
|
|
|
+ const savedTransformRef = useRef<string>('')
|
|
|
|
|
+ const savedLeftRef = useRef<string>('')
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' })
|
|
messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' })
|
|
@@ -155,6 +161,35 @@ function Chart() {
|
|
|
setShowQuickQuestions(true)
|
|
setShowQuickQuestions(true)
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
+ const handleInputClick = () => {
|
|
|
|
|
+ if (isHH) {
|
|
|
|
|
+ return
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ const rootElement = document.querySelector('#root') as HTMLElement
|
|
|
|
|
+ if (rootElement) {
|
|
|
|
|
+ savedTransformRef.current = rootElement.style.transform || ''
|
|
|
|
|
+ savedLeftRef.current = rootElement.style.left || ''
|
|
|
|
|
+
|
|
|
|
|
+ const currentTransform = rootElement.style.transform
|
|
|
|
|
+ if (currentTransform && currentTransform.includes('rotate(90deg)')) {
|
|
|
|
|
+ rootElement.style.transform = ''
|
|
|
|
|
+ rootElement.style.left = '0'
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ setShowChartInput(true)
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ const handleCloseChartInput = () => {
|
|
|
|
|
+ const rootElement = document.querySelector('#root') as HTMLElement
|
|
|
|
|
+ if (rootElement) {
|
|
|
|
|
+ rootElement.style.transform = savedTransformRef.current || ''
|
|
|
|
|
+ rootElement.style.left = savedLeftRef.current || ''
|
|
|
|
|
+ }
|
|
|
|
|
+ setShowChartInput(false)
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
return (
|
|
return (
|
|
|
<div className={styles.chart}>
|
|
<div className={styles.chart}>
|
|
|
<div className={styles.chartWrap}>
|
|
<div className={styles.chartWrap}>
|
|
@@ -199,15 +234,25 @@ function Chart() {
|
|
|
<input
|
|
<input
|
|
|
ref={inputRef}
|
|
ref={inputRef}
|
|
|
type='text'
|
|
type='text'
|
|
|
|
|
+ readOnly={!isHH}
|
|
|
placeholder='请输入您想了解的内容...'
|
|
placeholder='请输入您想了解的内容...'
|
|
|
value={inputValue}
|
|
value={inputValue}
|
|
|
onChange={e => setInputValue(e.target.value)}
|
|
onChange={e => setInputValue(e.target.value)}
|
|
|
onKeyPress={handleInputKeyPress}
|
|
onKeyPress={handleInputKeyPress}
|
|
|
|
|
+ onClick={handleInputClick}
|
|
|
disabled={isLoading}
|
|
disabled={isLoading}
|
|
|
/>
|
|
/>
|
|
|
<div className={styles.btn} onClick={handleSendMessage.bind(null, inputValue)} />
|
|
<div className={styles.btn} onClick={handleSendMessage.bind(null, inputValue)} />
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+
|
|
|
|
|
+ {showChartInput && (
|
|
|
|
|
+ <ChartInput
|
|
|
|
|
+ onClose={handleCloseChartInput}
|
|
|
|
|
+ onSend={handleSendMessage}
|
|
|
|
|
+ isLoading={isLoading}
|
|
|
|
|
+ />
|
|
|
|
|
+ )}
|
|
|
</div>
|
|
</div>
|
|
|
)
|
|
)
|
|
|
}
|
|
}
|