From 6048926a4dfdf3fe97055c852f555e56546ae817 Mon Sep 17 00:00:00 2001
From: balibabu <cike8899@users.noreply.github.com>
Date: Thu, 7 Mar 2024 11:38:32 +0800
Subject: [PATCH] feat: fixed the issue that some PDF documents could not be
displayed on the chunk list page in small screens and logout (#105)
* feat: logout
* feat: fixed the issue that some PDF documents could not be displayed on the chunk list page in small screens
---
web/src/hooks/userSettingHook.ts | 10 ++++
web/src/layouts/components/user/index.tsx | 24 +++++---
.../components/chunk-card/index.less | 4 ++
.../components/chunk-card/index.tsx | 56 ++++++++++---------
.../components/knowledge-chunk/index.less | 9 ++-
.../components/knowledge-chunk/index.tsx | 5 +-
web/src/pages/chat/chat-container/index.tsx | 2 +-
web/src/pages/login/model.ts | 23 ++++----
web/src/services/userService.ts | 5 ++
web/src/utils/api.ts | 1 +
10 files changed, 89 insertions(+), 50 deletions(-)
diff --git a/web/src/hooks/userSettingHook.ts b/web/src/hooks/userSettingHook.ts
index f45337f..2bba749 100644
--- a/web/src/hooks/userSettingHook.ts
+++ b/web/src/hooks/userSettingHook.ts
@@ -64,3 +64,13 @@ export const useSelectParserList = (): Array<{
return parserList;
};
+
+export const useLogout = () => {
+ const dispatch = useDispatch();
+
+ const logout = useCallback((): number => {
+ return dispatch<any>({ type: 'loginModel/logout' });
+ }, [dispatch]);
+
+ return logout;
+};
diff --git a/web/src/layouts/components/user/index.tsx b/web/src/layouts/components/user/index.tsx
index 260fab6..3dc4dd1 100644
--- a/web/src/layouts/components/user/index.tsx
+++ b/web/src/layouts/components/user/index.tsx
@@ -1,19 +1,27 @@
-import { useFetchUserInfo, useSelectUserInfo } from '@/hooks/userSettingHook';
+import {
+ useFetchUserInfo,
+ useLogout,
+ useSelectUserInfo,
+} from '@/hooks/userSettingHook';
import authorizationUtil from '@/utils/authorizationUtil';
import type { MenuProps } from 'antd';
import { Avatar, Button, Dropdown } from 'antd';
-import React, { useMemo } from 'react';
+import React, { useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { history } from 'umi';
const App: React.FC = () => {
const { t } = useTranslation();
const userInfo = useSelectUserInfo();
+ const logout = useLogout();
- const logout = () => {
- authorizationUtil.removeAll();
- history.push('/login');
- };
+ const handleLogout = useCallback(async () => {
+ const retcode = await logout();
+ if (retcode === 0) {
+ authorizationUtil.removeAll();
+ history.push('/login');
+ }
+ }, [logout]);
const toSetting = () => {
history.push('/setting');
@@ -23,7 +31,7 @@ const App: React.FC = () => {
return [
{
key: '1',
- onClick: logout,
+ onClick: handleLogout,
label: <Button type="text">{t('header.logout')}</Button>,
},
{
@@ -32,7 +40,7 @@ const App: React.FC = () => {
label: <Button type="text">{t('header.setting')}</Button>,
},
];
- }, [t]);
+ }, [t, handleLogout]);
useFetchUserInfo();
diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less
index 1ee2e3f..956caaa 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.less
@@ -12,6 +12,10 @@
.chunkText;
}
+.chunkCard {
+ width: 100%;
+}
+
.cardSelected {
background-color: @selectedBackgroundColor;
}
diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx
index d021e47..c1aaf2c 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/components/chunk-card/index.tsx
@@ -1,7 +1,9 @@
import Image from '@/components/image';
import { IChunk } from '@/interfaces/database/knowledge';
import { Card, Checkbox, CheckboxProps, Flex, Popover, Switch } from 'antd';
+import classNames from 'classnames';
import { useState } from 'react';
+
import styles from './index.less';
interface IProps {
@@ -44,33 +46,35 @@ const ChunkCard = ({
};
return (
- <div>
- <Card className={selected ? styles.cardSelected : ''}>
- <Flex gap={'middle'} justify={'space-between'}>
- <Checkbox onChange={handleCheck} checked={checked}></Checkbox>
- {item.img_id && (
- <Popover
- placement="topRight"
- content={
- <Image id={item.img_id} className={styles.imagePreview}></Image>
- }
- >
- <Image id={item.img_id} className={styles.image}></Image>
- </Popover>
- )}
+ <Card
+ className={classNames(styles.chunkCard, {
+ [styles.cardSelected]: selected,
+ })}
+ >
+ <Flex gap={'middle'} justify={'space-between'}>
+ <Checkbox onChange={handleCheck} checked={checked}></Checkbox>
+ {item.img_id && (
+ <Popover
+ placement="topRight"
+ content={
+ <Image id={item.img_id} className={styles.imagePreview}></Image>
+ }
+ >
+ <Image id={item.img_id} className={styles.image}></Image>
+ </Popover>
+ )}
- <section
- onDoubleClick={handleContentDoubleClick}
- onClick={handleContentClick}
- className={styles.content}
- dangerouslySetInnerHTML={{ __html: item.content_with_weight }}
- ></section>
- <div>
- <Switch checked={enabled} onChange={onChange} />
- </div>
- </Flex>
- </Card>
- </div>
+ <section
+ onDoubleClick={handleContentDoubleClick}
+ onClick={handleContentClick}
+ className={styles.content}
+ dangerouslySetInnerHTML={{ __html: item.content_with_weight }}
+ ></section>
+ <div>
+ <Switch checked={enabled} onChange={onChange} />
+ </div>
+ </Flex>
+ </Card>
);
};
diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/index.less b/web/src/pages/add-knowledge/components/knowledge-chunk/index.less
index c97956d..4864046 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/index.less
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/index.less
@@ -12,6 +12,10 @@
justify-content: space-between;
}
+ .pagePdfWrapper {
+ width: 60%;
+ }
+
.pageContent {
flex: 1;
width: 100%;
@@ -29,12 +33,11 @@
}
.chunkContainer {
- height: calc(100vh - 320px);
- overflow: auto;
- width: 100%;
+ height: calc(100vh - 332px);
}
.pageFooter {
+ padding-top: 10px;
height: 32px;
}
}
diff --git a/web/src/pages/add-knowledge/components/knowledge-chunk/index.tsx b/web/src/pages/add-knowledge/components/knowledge-chunk/index.tsx
index 01873ce..ffd330b 100644
--- a/web/src/pages/add-knowledge/components/knowledge-chunk/index.tsx
+++ b/web/src/pages/add-knowledge/components/knowledge-chunk/index.tsx
@@ -38,6 +38,7 @@ const Chunk = () => {
const { removeChunk } = useDeleteChunkByIds();
const documentInfo = useSelectDocumentInfo();
const { handleChunkCardClick, selectedChunkId } = useHandleChunkCardClick();
+ const isPdf = documentInfo.type === 'pdf';
const getChunkList = useCallback(() => {
const payload: PayloadType = {
@@ -164,7 +165,7 @@ const Chunk = () => {
></ChunkToolBar>
<Divider></Divider>
<Flex flex={1} gap={'middle'}>
- <Flex flex={1} vertical>
+ <Flex vertical className={isPdf ? styles.pagePdfWrapper : ''}>
<div className={styles.pageContent}>
<Spin spinning={loading} className={styles.spin} size="large">
<Space
@@ -204,7 +205,7 @@ const Chunk = () => {
</div>
</Flex>
- {documentInfo.type === 'pdf' && (
+ {isPdf && (
<section className={styles.documentPreview}>
<DocumentPreview
selectedChunkId={selectedChunkId}
diff --git a/web/src/pages/chat/chat-container/index.tsx b/web/src/pages/chat/chat-container/index.tsx
index c084e2d..79edd5a 100644
--- a/web/src/pages/chat/chat-container/index.tsx
+++ b/web/src/pages/chat/chat-container/index.tsx
@@ -177,7 +177,7 @@ const MessageItem = ({
<Flex vertical gap={8} flex={1}>
<b>{isAssistant ? '' : userInfo.nickname}</b>
<div className={styles.messageText}>
- {item.content ? (
+ {item.content !== '' ? (
<Markdown
rehypePlugins={[rehypeWrapReference]}
components={
diff --git a/web/src/pages/login/model.ts b/web/src/pages/login/model.ts
index 0c2dd4a..8faf077 100644
--- a/web/src/pages/login/model.ts
+++ b/web/src/pages/login/model.ts
@@ -25,18 +25,13 @@ const model: DvaModel<LoginModelState> = {
};
},
},
- subscriptions: {
- setup({ dispatch, history }) {
- history.listen((location) => {});
- },
- },
effects: {
- *login({ payload = {} }, { call, put }) {
+ *login({ payload = {} }, { call }) {
const { data, response } = yield call(userService.login, payload);
const { retcode, data: res } = data;
const authorization = response.headers.get(Authorization);
if (retcode === 0) {
- message.success('登录ć功ďĽ');
+ message.success('logged!');
const token = res.access_token;
const userInfo = {
avatar: res.avatar,
@@ -51,15 +46,23 @@ const model: DvaModel<LoginModelState> = {
}
return retcode;
},
- *register({ payload = {} }, { call, put }) {
- const { data, response } = yield call(userService.register, payload);
+ *register({ payload = {} }, { call }) {
+ const { data } = yield call(userService.register, payload);
console.log();
- const { retcode, data: res, retmsg } = data;
+ const { retcode } = data;
if (retcode === 0) {
message.success('注册ć功ďĽ');
}
return retcode;
},
+ *logout({ payload = {} }, { call }) {
+ const { data } = yield call(userService.logout, payload);
+ const { retcode } = data;
+ if (retcode === 0) {
+ message.success('logout');
+ }
+ return retcode;
+ },
},
};
export default model;
diff --git a/web/src/services/userService.ts b/web/src/services/userService.ts
index 6e11f73..665a7d5 100644
--- a/web/src/services/userService.ts
+++ b/web/src/services/userService.ts
@@ -4,6 +4,7 @@ import request from '@/utils/request';
const {
login,
+ logout,
register,
setting,
user_info,
@@ -20,6 +21,10 @@ const methods = {
url: login,
method: 'post',
},
+ logout: {
+ url: logout,
+ method: 'get',
+ },
register: {
url: register,
method: 'post',
diff --git a/web/src/utils/api.ts b/web/src/utils/api.ts
index 7e90d78..3b1ec9b 100644
--- a/web/src/utils/api.ts
+++ b/web/src/utils/api.ts
@@ -5,6 +5,7 @@ export { api_host };
export default {
// 用ć·
login: `${api_host}/user/login`,
+ logout: `${api_host}/user/logout`,
register: `${api_host}/user/register`,
setting: `${api_host}/user/setting`,
user_info: `${api_host}/user/info`,
--
GitLab