Commit 0a0af752 authored by littleforest's avatar littleforest
parents 1d2c3ad6 192ec780
import styles from './index.less'; import styles from './index.less';
import { Button, Checkbox, Form, FormInstance, Input, Modal, message } from 'antd'; import { Button, Checkbox, Form, Input, Modal, message } from 'antd';
import { LockOutlined, UserOutlined } from '@ant-design/icons'; import { LockOutlined, UserOutlined } from '@ant-design/icons';
import logoSvg from '../../assets/logo.svg'; import logoSvg from '../../assets/logo.svg';
import { useRef, useState } from 'react'; import { useState } from 'react';
import { loginChatGLM } from '@/services/chatGLM/api'; import { loginChatGLM } from '@/services/chatGLM/api';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
...@@ -16,12 +16,12 @@ const LoginModal = (props: ILoginModalProps) => { ...@@ -16,12 +16,12 @@ const LoginModal = (props: ILoginModalProps) => {
const intl = useIntl(); const intl = useIntl();
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [form] = Form.useForm();
const formRef = useRef<FormInstance>(null);
const reset = () => { const reset = () => {
setOpen(false); setOpen(false);
formRef.current?.resetFields(); form.resetFields();
}; };
const handleSubmit = async (values: any) => { const handleSubmit = async (values: any) => {
setLoading(true); setLoading(true);
...@@ -73,7 +73,6 @@ const LoginModal = (props: ILoginModalProps) => { ...@@ -73,7 +73,6 @@ const LoginModal = (props: ILoginModalProps) => {
console.log(value); console.log(value);
}} }}
className={styles.modal_form} className={styles.modal_form}
ref={formRef}
> >
<Form.Item <Form.Item
name="username" name="username"
...@@ -91,7 +90,7 @@ const LoginModal = (props: ILoginModalProps) => { ...@@ -91,7 +90,7 @@ const LoginModal = (props: ILoginModalProps) => {
<Checkbox>自动登录</Checkbox> <Checkbox>自动登录</Checkbox>
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
<Button type="primary" htmlType="submit" className={styles.modal_button}> <Button type="primary" htmlType="submit" className={styles.modal_button} loading={loading}>
登录 登录
</Button> </Button>
</Form.Item> </Form.Item>
......
import logoSvg from '../../assets/logo.svg';
import copySvg from '../../assets/copy.svg';
import { Button } from 'antd';
import styles from './index.less';
interface IAnswerProps {
answerValue: string;
loading: boolean
isShowRetry?: boolean;
}
const Answer = (props: IAnswerProps) => {
const { answerValue, loading, isShowRetry } = props
return (
<div>
<p className={styles.question}>
<img src={logoSvg} alt="" />
<span>回答如下:</span>
</p>
<div className={styles.chat}>
<div>
<p
className={styles.copyAnswer}
onClick={() => {
}}
>
<img src={copySvg} alt="" />
<span>复制回答</span>
</p>
<div className={styles.answer}>
<p>{loading ? '请耐心等待3-5秒~' : answerValue}</p>
</div>
</div>
{
isShowRetry && <Button>重试</Button>
}
</div>
</div>
);
}
export default Answer;
\ No newline at end of file
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
display: flex; display: flex;
div { div {
position: relative; position: relative;
p { .copyAnswer {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
right: 16px; right: 16px;
...@@ -41,6 +41,20 @@ ...@@ -41,6 +41,20 @@
font-size: 14px; font-size: 14px;
} }
} }
.answer {
width: 900px;
margin-left: 28px;
background: #F0F3F6;
border-radius: 4px;
font-size: 18px;
color: rgba(0,0,0,0.85);
line-height: 32px;
min-height: 268px;
p {
padding: 16px;
}
}
} }
button { button {
width: 90px; width: 90px;
......
import styles from './index.less'; import styles from './index.less';
import userSvg from '../../assets/user.svg'; import Issue from './issue.component';
import logoSvg from '../../assets/logo.svg'; import Answer from './answer.component';
import copySvg from '../../assets/copy.svg';
import { Button, Input } from 'antd';
import { useState } from 'react';
const { TextArea } = Input;
interface INewSessionProps { interface INewSessionProps {
questionValue: string; questionValue: string;
answerValue: string;
} }
const NewSession = (props: INewSessionProps) => { const NewSession = (props: INewSessionProps) => {
const { questionValue } = props; const { questionValue, answerValue } = props;
const [answerValue, setAnswerValue]= useState('');
return ( return (
<div className={styles.newSession}> <div className={styles.newSession}>
<div className={styles.question} style={{ marginBottom: '40px' }}> <Issue
<img src={userSvg} alt="" /> questionValue={questionValue}
<span>{questionValue}</span> />
</div> <Answer
<div> answerValue={answerValue}
<p className={styles.question}> loading
<img src={logoSvg} alt="" /> />
<span>回答如下:</span>
</p>
<div className={styles.chat}>
<div>
<p
onClick={() => {
}}
>
<img src={copySvg} alt="" />
<span>复制回答</span>
</p>
<TextArea
value={answerValue}
onChange={(e) => setAnswerValue(e.target.value)}
placeholder="请耐心等待3-5秒~"
// autoSize={{ minRows: 3, maxRows: 5 }}
style={{
width: '900px',
height: '268px',
marginLeft: '28px',
background: '#F0F3F6',
borderRadius: '4px',
fontSize: '18px',
color: 'rgba(0,0,0,0.85)',
lineHeight: '32px',
}}
/>
</div>
<Button
onClick={() => {
}}
>
重试
</Button>
</div>
</div>
</div> </div>
); );
} }
......
import userSvg from '../../assets/user.svg';
import styles from './index.less';
interface IIssueProps {
questionValue: string;
}
const Issue = (props: IIssueProps) => {
const { questionValue } = props;
return (
<div className={styles.question} style={{ marginBottom: '40px' }}>
<img src={userSvg} alt="" />
<span>{questionValue}</span>
</div>
);
}
export default Issue;
\ No newline at end of file
...@@ -31,7 +31,9 @@ const Chat: React.FC = () => { ...@@ -31,7 +31,9 @@ const Chat: React.FC = () => {
const [selectSiderTabs, setSelectSiderTabs] = useState(''); const [selectSiderTabs, setSelectSiderTabs] = useState('');
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const tabShow = showSider; const tabShow = showSider ;
const questionValue = form.getFieldValue('chatInput');
useEffect(() => { useEffect(() => {
if (!isMobile) { if (!isMobile) {
...@@ -39,8 +41,8 @@ const Chat: React.FC = () => { ...@@ -39,8 +41,8 @@ const Chat: React.FC = () => {
} }
}, [isMobile]); }, [isMobile]);
useEffect(() => { let token = '';
let token = ''; useEffect(() => {
if (localStorage.getItem('user')) { if (localStorage.getItem('user')) {
token = JSON.parse(localStorage.user)?.token; token = JSON.parse(localStorage.user)?.token;
} }
...@@ -191,7 +193,10 @@ const Chat: React.FC = () => { ...@@ -191,7 +193,10 @@ const Chat: React.FC = () => {
> >
{console.log(chat)} {console.log(chat)}
{firstChat ? ( {firstChat ? (
<NewSession questionValue={chat} /> <NewSession
questionValue={chat}
answerValue=''
/>
) : ( ) : (
<div className={classNames(isMobile && styles.mobileContent)}> <div className={classNames(isMobile && styles.mobileContent)}>
<Item name="firstInput"> <Item name="firstInput">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment