Commit 85b4f125 authored by Ylg's avatar Ylg

resove conflict

parents e1d11319 6f8b236c
import Footer from '@/components/Footer';
import RightContent from '@/components/RightContent';
import { PageLoading, SettingDrawer } from '@ant-design/pro-components';
import { SettingDrawer } from '@ant-design/pro-components';
import { isEmpty } from 'lodash';
import { history } from 'umi';
const loginPath = '/chat';
/** 获取用户信息比较慢的时候会展示一个 loading */
export const initialStateConfig = {
loading: <PageLoading />,
};
// export const initialStateConfig = {
// loading: <PageLoading />,
// };
/**
* @see https://umijs.org/zh-CN/plugins/plugin-initial-state
......
import { Row, Spin, Col } from 'antd';
import { LoadingOutlined } from '@ant-design/icons';
const antIcon = <LoadingOutlined style={{ fontSize: 48 }} spin />;
const Loading: React.FC = () => (
<>
<Row justify={'center'}>
<Col span={24} style={{ textAlign: 'center', marginTop: '30vh' }}>
<Spin size="large" indicator={antIcon} />
</Col>
</Row>
</>
);
export default Loading;
import logoSvg from '../../assets/logo.svg';
import copySvg from '../../assets/copy.svg';
import { Button, Col, Grid, Row } from 'antd';
import { Button, Col, Grid, Row, message } from 'antd';
import styles from './index.less';
import classNames from 'classnames';
import { CopyOutlined } from '@ant-design/icons';
interface IAnswerProps {
answerValue: string;
......@@ -17,6 +18,17 @@ const Answer = (props: IAnswerProps) => {
const screens = useBreakpoint();
const isMobile = screens.xs;
function copy() {
navigator.clipboard
.writeText(answerValue)
.then(() => {
message.success('已复制');
})
.catch(() => {
message.error('复制失败');
});
}
return (
<Col span={24}>
<Row>
......@@ -41,22 +53,32 @@ const Answer = (props: IAnswerProps) => {
)}
</div>
{!isMobile && answerValue && (
<p className={styles.copyAnswer} onClick={() => {}}>
<p
className={styles.copyAnswer}
onClick={() => {
copy();
}}
>
<img src={copySvg} alt="" />
<span>复制回答</span>
</p>
)}
</div>
{isShowRetry && !isMobile && <Button className={styles.chat_retry}>重试</Button>}
{/* {isShowRetry && !isMobile && <Button className={styles.chat_retry}>重试</Button>} */}
</Col>
<Col>
{isMobile && answerValue && (
<Row justify={'center'} className={styles.mobile_button}>
<Button className={styles.mobile_copyAnswer}>
<img src={copySvg} alt="" />
<span>复制回答</span>
<Row justify={'end'} align={'middle'} className={styles.mobile_button}>
<Button
className={styles.mobile_copyAnswer}
icon={<CopyOutlined />}
onClick={() => {
copy();
}}
>
复制回答
</Button>
<Button className={styles.mobile_chat_retry}>重试</Button>
{/* <Button className={styles.mobile_chat_retry}>重试</Button> */}
</Row>
)}
</Col>
......
......@@ -96,7 +96,9 @@
.mobile_copyAnswer {
width: 151px;
height: 40px;
line-height: 32px;
background: rgba(0, 155, 149, 0.12);
border: none !important;
border-radius: 4px;
img {
width: 24px;
......
......@@ -100,11 +100,11 @@ ol {
.ant-btn:active,
.ant-btn:focus {
background-color: #009b95 !important;
border-color: #009b95 !important;
background-color: #00beb6 !important;
border-color: #00beb6 !important;
}
.ant-btn:hover {
background-color: #009b95 !important;
border-color: #009b95 !important;
background-color: #00beb6 !important;
border-color: #00beb6 !important;
}
import { Grid } from 'antd';
import styles from './productionCard.less';
import classnames from 'classnames';
......
......@@ -9,19 +9,23 @@
.sider {
position: fixed;
top: 0;
left: 0;
left: -240px;
width: 240px;
min-height: 100vh;
background-color: #001529;
transition: left 0.3s ease-in-out;
.siderChatContent {
height: 70%;
min-height: 400px;
:global(.ant-btn-primary) {
border-radius: 2px;
}
}
}
}
.siderOpen {
left: 0 !important;
}
.header {
margin-top: 80px;
margin-bottom: 40px;
......@@ -67,12 +71,12 @@
}
.chatFooter {
position: fixed;
position: absolute;
bottom: 0;
left: 0;
width: 240px;
width: 100%;
margin-bottom: 52px;
margin-bottom: 60px;
}
.chatFooterItem {
......
......@@ -24,6 +24,11 @@ const { useBreakpoint } = Grid;
const { Title } = Typography;
const { Item } = Form;
const isMobileDevice = (): boolean => {
const ua = navigator.userAgent;
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(ua);
};
interface IHistory {
prompt: string;
answer: string;
......@@ -33,7 +38,7 @@ const Chat: React.FC = () => {
const screens = useBreakpoint();
const isMobile = screens.xs;
const [chat, setChat] = useState('');
const [showSider, setShowSider] = useState(true);
const [showSider, setShowSider] = useState(!isMobileDevice());
const [firstChat, setFirstChat] = useState(false);
const [form] = Form.useForm();
const { data: glmToken, run: getChatGLMToken } = useRequest(GetChatGLMToken, { manual: true });
......@@ -67,7 +72,6 @@ const Chat: React.FC = () => {
},
onError: () => {
setLoading(false);
message.error('连接失败了,请稍后再试!');
},
});
......@@ -76,6 +80,7 @@ const Chat: React.FC = () => {
messageHistory.current[messageHistory.current.length - 1].answer += answer;
return messageHistory.current;
}, [answer]);
async function handleSendMessage() {
if (!checkIsTokenExpires()) {
messageHistory.current.push({ prompt: chat, answer: '' });
......@@ -127,12 +132,11 @@ const Chat: React.FC = () => {
<Col push={1}>
<MenuOutlined
onClick={() => {
console.log(showSider);
setShowSider(!showSider);
}}
/>
</Col>
<Col>AI改变世界</Col>
<Col>长沙振升集团</Col>
<Col pull={1} />
</Row>
);
......@@ -143,45 +147,46 @@ const Chat: React.FC = () => {
<LoginModal open={loginModalOpen} setOpen={setLoginModalOpen} />
{isMobile && renderMobileHeader()}
<Row>
{(showSider || !isMobile) && (
<Col className={`${styles.siderWrapper}`}>
<div
style={{ top: isMobile && '44px', zIndex: isMobile ? 13 : 10 }}
className={`${styles.sider}`}
>
<div className={styles.siderChatContent}>
<div style={{ padding: '30px 20px 0 20px' }}>
<Button size="large" block type="primary" icon={<PlusOutlined />}>
新建对话
</Button>
</div>
</div>
<div className={styles.chatFooter}>
<Row style={{ width: '240px' }} justify={'center'} align={'middle'}>
<Col
span={24}
className={styles.chatFooterItem}
hidden={!access.roles?.find((x) => ['管理员', 'admin'].includes(x))}
onClick={() => {
history.push('/');
}}
>
<Space wrap>
<SettingOutlined />
后台管理
</Space>
</Col>
<Col span={24} className={styles.chatFooterItem} style={{ color: '#009B95' }}>
<Space wrap>
<UserOutlined />
{access?.name || '请先登录'}
</Space>
</Col>
</Row>
<Col className={`${styles.siderWrapper}`}>
<div
style={{ top: isMobile && '44px', zIndex: isMobile ? 13 : 10 }}
className={`${styles.sider} ${showSider ? styles.siderOpen : ''}`}
>
<div className={styles.siderChatContent}>
<div style={{ padding: '30px 20px 0 20px' }}>
<Button size="large" block type="primary" icon={<PlusOutlined />}>
新建对话
</Button>
</div>
</div>
</Col>
)}
<Row
className={styles.chatFooter}
style={{ width: '240px', marginBottom: isMobile ? 80 : 60 }}
justify={'center'}
align={'middle'}
>
<Col
span={24}
className={styles.chatFooterItem}
hidden={!access.roles?.find((x) => ['管理员', 'admin'].includes(x))}
onClick={() => {
history.push('/');
}}
>
<Space wrap>
<SettingOutlined />
后台管理
</Space>
</Col>
<Col span={24} className={styles.chatFooterItem} style={{ color: '#009B95' }}>
<Space wrap>
<UserOutlined />
{access?.name || '请先登录'}
</Space>
</Col>
</Row>
</div>
</Col>
<Form
form={form}
initialValues={{ chatInput: chat }}
......@@ -264,6 +269,7 @@ const Chat: React.FC = () => {
>
<Item name="chatInput">
<Input
autoComplete={false}
required
placeholder="在这里输入你想知道的问题,给我几句提示,我来帮你回答"
size="large"
......
......@@ -81,7 +81,7 @@
margin: 0;
padding: 0;
color: rgba(0, 0, 0, 0.65);
color: #1890ff;
color: #009b95;
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5;
......@@ -116,7 +116,7 @@
display: block;
width: 9px;
height: 9px;
background-color: #1890ff;
background-color: #009b95;
border-radius: 100%;
-webkit-transform: scale(0.75);
-ms-transform: scale(0.75);
......
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