Skip to content

Commit e8c3941

Browse files
author
lrhh123
committed
feat: 修改编辑器样式
1 parent d76baeb commit e8c3941

File tree

13 files changed

+604
-286
lines changed

13 files changed

+604
-286
lines changed

‎src/renderer/common/components/MyModal/index.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ const MyModal = ({
2727
isCentered,
2828
w = 'auto',
2929
maxW = ['90vw', '600px'],
30+
style,
3031
...props
3132
}: MyModalProps) => {
3233
return (

‎src/renderer/dataview-window/App.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import {
2121
} from '@chakra-ui/react';
2222
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
2323
import ReplyKeyword from './components/ReplyKeyword';
24-
import ChatHistory from './components/ChatHistory';
24+
import SessionHistory from './components/SessionHistory';
2525
import theme from '../common/styles/theme';
2626
import '../common/App.css';
2727

@@ -76,7 +76,7 @@ const App = () => {
7676
<Heading as="h3" size="md" mb={4}>
7777
历史聊天记录
7878
</Heading>
79-
<ChatHistory />
79+
<SessionHistory />
8080
</TabPanel>
8181
</TabPanels>
8282
</Tabs>

‎src/renderer/dataview-window/components/EditKeyword/GlobalSwitch.tsx‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import React from 'react';
2+
import { Text, HStack, Box, Switch, Tooltip, Flex } from '@chakra-ui/react';
3+
4+
type GlobalSwitchProps = {
5+
isGlobal: boolean;
6+
setIsGlobal: (isGlobal: boolean) => void;
7+
};
8+
9+
const GlobalSwitch = ({ isGlobal, setIsGlobal }: GlobalSwitchProps) => (
10+
<Flex mt={3} alignItems="center">
11+
<Tooltip label="该关键词是否面向全部平台，否则请选择一个适用的平台">
12+
<HStack spacing={4} width="100%">
13+
<Text fontSize="large">开启全局关键词</Text>
14+
<Switch
15+
isChecked={isGlobal}
16+
onChange={() => setIsGlobal(!isGlobal)}
17+
size="lg"
18+
/>
19+
</HStack>
20+
</Tooltip>
21+
</Flex>
22+
);
23+
24+
export default GlobalSwitch;

‎src/renderer/dataview-window/components/EditKeyword/KeywordInput.tsx‎

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
import React, { useState, useEffect } from 'react';
2+
import {
3+
Button,
4+
Input,
5+
Modal,
6+
ModalOverlay,
7+
ModalContent,
8+
ModalHeader,
9+
ModalCloseButton,
10+
ModalBody,
11+
ModalFooter,
12+
Stack,
13+
Text,
14+
Icon,
15+
HStack,
16+
Box,
17+
Switch,
18+
Select,
19+
IconButton,
20+
Tooltip,
21+
Flex,
22+
useToast,
23+
} from '@chakra-ui/react';
24+
import { FiHelpCircle } from 'react-icons/fi';
25+
import { AddIcon } from '@chakra-ui/icons';
26+
27+
type KeywordInputProps = {
28+
newKeyword: string;
29+
setNewKeyword: (value: string) => void;
30+
handleAddKeyword: () => void;
31+
startKeyword: string;
32+
setStartKeyword: (value: string) => void;
33+
endKeyword: string;
34+
setEndKeyword: (value: string) => void;
35+
handleAddFuzzyKeyword: () => void;
36+
};
37+
38+
const KeywordInput = ({
39+
newKeyword,
40+
setNewKeyword,
41+
handleAddKeyword,
42+
startKeyword,
43+
setStartKeyword,
44+
endKeyword,
45+
setEndKeyword,
46+
handleAddFuzzyKeyword,
47+
}: KeywordInputProps) => (
48+
<>
49+
<Flex mb="8px" mt="12px">
50+
<Text mr={2} fontSize={'large'} fontWeight={'bold'}>
51+
关键词设置
52+
</Text>
53+
<Tooltip label="设置关键词以匹配具体的回复，命中关键词的问题，不会使用 GPT 进行回答">
54+
<Box color={'gray.500'}>
55+
<Icon as={FiHelpCircle} w={6} h={6} />
56+
</Box>
57+
</Tooltip>
58+
</Flex>
59+
<Stack direction="row" mb="4">
60+
<Input
61+
placeholder="新增关键词"
62+
value={newKeyword}
63+
onChange={(e) => setNewKeyword(e.target.value)}
64+
/>
65+
<Tooltip label="新增一条关键词，可以使用 * 字符模糊匹配，如果要输入 * 字符，则使用 \* 代替">
66+
<Button onClick={handleAddKeyword} colorScheme="green">
67+
<AddIcon />
68+
</Button>
69+
</Tooltip>
70+
</Stack>
71+
<Stack direction="row" mb="4">
72+
<Input
73+
placeholder="起始匹配关键词"
74+
value={startKeyword}
75+
onChange={(e) => setStartKeyword(e.target.value)}
76+
/>
77+
<Input
78+
placeholder="结束匹配关键词"
79+
value={endKeyword}
80+
onChange={(e) => setEndKeyword(e.target.value)}
81+
/>
82+
<Tooltip label="新增一个范围关键词，如果匹配上了开始关键词和结束关键词，也能匹配成功">
83+
<Button onClick={handleAddFuzzyKeyword} colorScheme="green">
84+
<AddIcon />
85+
</Button>
86+
</Tooltip>
87+
</Stack>
88+
</>
89+
);
90+
91+
export default KeywordInput;

‎src/renderer/dataview-window/components/EditKeyword/KeywordList.tsx‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import React, { useState, useEffect } from 'react';
2+
import {
3+
Button,
4+
Input,
5+
Modal,
6+
ModalOverlay,
7+
ModalContent,
8+
ModalHeader,
9+
ModalCloseButton,
10+
ModalBody,
11+
ModalFooter,
12+
Stack,
13+
Text,
14+
Icon,
15+
HStack,
16+
Box,
17+
Switch,
18+
Select,
19+
IconButton,
20+
Tooltip,
21+
Flex,
22+
useToast,
23+
} from '@chakra-ui/react';
24+
import { DeleteIcon } from '@chakra-ui/icons';
25+
26+
type KeywordListProps = {
27+
keywords: string[];
28+
handleKeywordClick: (keyword: string, index: number) => void;
29+
handleDeleteKeyword: (index: number) => void;
30+
};
31+
32+
const KeywordList = ({
33+
keywords,
34+
handleKeywordClick,
35+
handleDeleteKeyword,
36+
}: KeywordListProps) => (
37+
<Stack direction="row" spacing={4} wrap="wrap">
38+
{keywords.map((keyword, index) => (
39+
<Text
40+
key={index}
41+
p="1"
42+
borderRadius="md"
43+
borderWidth="1px"
44+
cursor="pointer"
45+
maxWidth="220px"
46+
onClick={() => handleKeywordClick(keyword, index)}
47+
style={{ whiteSpace: 'normal', wordWrap: 'break-word' }}
48+
>
49+
{keyword}
50+
<IconButton
51+
ml={3}
52+
aria-label="Delete keyword"
53+
colorScheme="red"
54+
icon={<DeleteIcon />}
55+
size="xs"
56+
onClick={(e) => {
57+
e.stopPropagation();
58+
handleDeleteKeyword(index);
59+
}}
60+
/>
61+
</Text>
62+
))}
63+
</Stack>
64+
);
65+
66+
export default KeywordList;

‎src/renderer/dataview-window/components/EditKeyword/PlatformSelector.tsx‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import React, { useState, useEffect } from 'react';
2+
import { Text, HStack, Box, Select } from '@chakra-ui/react';
3+
4+
type PlatformSelectorProps = {
5+
ptf: string | null;
6+
setPtf: (ptf: string) => void;
7+
platforms: any;
8+
isLoading: boolean;
9+
};
10+
11+
const PlatformSelector = ({
12+
ptf,
13+
setPtf,
14+
platforms,
15+
isLoading,
16+
}: PlatformSelectorProps) => (
17+
<HStack width="full" alignItems="center" mb={5}>
18+
<Box width="30%">
19+
<Text>选择平台：</Text>
20+
</Box>
21+
<Box width="70%">
22+
<Select
23+
value={ptf || ''}
24+
onChange={(e) => setPtf(e.target.value)}
25+
isDisabled={isLoading}
26+
>
27+
{platforms?.data.map((platform: any) => (
28+
<option key={platform.id} value={platform.id}>
29+
{platform.name}
30+
</option>
31+
))}
32+
</Select>
33+
</Box>
34+
</HStack>
35+
);
36+
37+
export default PlatformSelector;

‎src/renderer/dataview-window/components/EditKeyword/ReplyInput.tsx‎

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
import React, { useState, useEffect } from 'react';
2+
import {
3+
Button,
4+
Input,
5+
Modal,
6+
ModalOverlay,
7+
ModalContent,
8+
ModalHeader,
9+
ModalCloseButton,
10+
ModalBody,
11+
ModalFooter,
12+
Stack,
13+
Text,
14+
Icon,
15+
HStack,
16+
Box,
17+
Switch,
18+
Select,
19+
IconButton,
20+
Tooltip,
21+
Flex,
22+
useToast,
23+
} from '@chakra-ui/react';
24+
import { FiHelpCircle } from 'react-icons/fi';
25+
import { AddIcon, AttachmentIcon } from '@chakra-ui/icons';
26+
import MyTextarea from '../../../common/components/MyTextarea';
27+
import Markdown from '../../../common/components/Markdown';
28+
import { App } from '../../../common/services/platform/platform';
29+
30+
type ReplyInputProps = {
31+
newReply: string;
32+
setNewReply: (value: string) => void;
33+
handleAddReply: () => void;
34+
handleInsertRandomChar: () => void;
35+
handleInsertFile: () => void;
36+
currentPlatform: App | undefined;
37+
};
38+
39+
const ReplyInput = ({
40+
newReply,
41+
setNewReply,
42+
handleAddReply,
43+
handleInsertRandomChar,
44+
handleInsertFile,
45+
currentPlatform,
46+
}: ReplyInputProps) => (
47+
<>
48+
<Flex mb="8px" mt="22px">
49+
<Text mr={2} fontSize={'large'} fontWeight={'bold'}>
50+
回复内容
51+
</Text>
52+
<Tooltip label="添加的多个关键词只要一个匹配上了，将会触发回复，如果有多个回复，将会随机选择一个回复。">
53+
<Box color={'gray.500'}>
54+
<Icon as={FiHelpCircle} w={6} h={6} />
55+
</Box>
56+
</Tooltip>
57+
</Flex>
58+
{currentPlatform && currentPlatform.desc && (
59+
<Box>
60+
<Markdown content={currentPlatform.desc} />
61+
</Box>
62+
)}
63+
<Tooltip label="在拼多多平台等平台，是不允许每次重复一个回答的，所以可以插入一个随机符，以规避这个问题">
64+
<Button onClick={handleInsertRandomChar} mt="4" mr={4} colorScheme="teal">
65+
插入随机符
66+
</Button>
67+
</Tooltip>
68+
<Tooltip label="有些无法发送文件或者图片的平台无法使用该文件">
69+
<Button
70+
leftIcon={<AttachmentIcon />}
71+
mt="4"
72+
onClick={handleInsertFile}
73+
colorScheme="orange"
74+
>
75+
插入文件
76+
</Button>
77+
</Tooltip>
78+
<Stack direction="row" mt="4">
79+
<MyTextarea
80+
mb="4"
81+
maxLength={200}
82+
placeholder="回复内容"
83+
value={newReply}
84+
onChange={(e) => setNewReply(e.target.value)}
85+
/>
86+
<Button onClick={handleAddReply} colorScheme="green">
87+
<AddIcon />
88+
</Button>
89+
</Stack>
90+
</>
91+
);
92+
93+
export default ReplyInput;

0 commit comments

Comments
 (0)