Skip to content

Commit

Permalink
合并冲突并完成美化
Browse files Browse the repository at this point in the history
  • Loading branch information
@UltramarineW
UltramarineW committed Jun 7, 2024
1 parent ae8351a commit a3a6b31
Show file tree
Hide file tree
Showing 6 changed files with 449 additions and 230 deletions.
Binary file modified frontend/public/favicon.ico
View file
Binary file not shown.
30 changes: 19 additions & 11 deletions frontend/src/pages/HomePage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,18 +64,26 @@ const Homepage: React.FC = () => {
};

return (
<div>
<h2>协时通：智能办公平台</h2>
<div style={{ height: '500px' }}>
<ProChat
helloMessage={'欢迎使用协时通，我是你的智能AI助手！'}
request={handleRequest}
/>

<button onClick={handleVoiceButtonClick}>开始语音识别</button>
<button onClick={handleVoiceStopButtonClick}>结束语音识别</button>
</div>
<div>
<div
style={{
background: "#ffffff",
borderRadius: 10,
boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.1)",
}}
>
<div style={{ height: "400px" }}>
<ProChat
helloMessage={"欢迎使用协时通，我是你的智能AI助手！"}
request={handleRequest}
// inputAreaRender={() => null}
/>

{/* <button onClick={handleVoiceButtonClick}>开始语音识别</button>
<button onClick={handleVoiceStopButtonClick}>结束语音识别</button> */}
</div>
</div>
</div>
);
};

Expand Down
114 changes: 72 additions & 42 deletions frontend/src/pages/MainLayout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -184,50 +184,80 @@ const MainLayout: React.FC = () => {
]

return (
<ProLayout
title="智能办公管理系统"
logo={<div className="logo" />}
layout="mix"
navTheme="light"
token={{
header: {
heightLayoutHeader: 80, // 调整Header的高度
},
<ProLayout
title="智能办公管理系统"
logo={<div className="logo" />}
layout="mix"
navTheme="light"
token={{
header: {
heightLayoutHeader: 80, // 调整Header的高度
},
sider: {
colorBgMenuItemSelected: "#D2E5FF",
colorTextMenuSelected: '#253B7D'
},
}}
headerRender={() => (
<Header
className="header"
style={{
display: "flex",
justifyContent: "space-between",
alignItems: "center",
height: "80px",
}}
headerRender={() => (
<Header className="header" style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', height: "80px" } } >
<div style={{ display: 'flex', alignItems: 'center' }}>
<img src={"./assets/logo.png"} alt="logo" style={{ width: 150, height: 60 }} />
</div>
<div style={{ display: 'flex', alignItems: 'center' }}>
{avatarUrl ? (
<img src={avatarUrl} alt="avatar" style={{ width: '24px', height: '24px', borderRadius: '50%', marginRight: '8px' }} />
) : (
<UserOutlined style={{ fontSize: '24px', marginRight: '8px' }} />
)}
<span>你好, {username}</span>
<Dropdown overlay={<Menu items={items} />} trigger={['click']}>
<a onClick={e => e.preventDefault()} style={{ marginLeft: '8px' }}>
<DownOutlined />
</a>
</Dropdown>
</div>
</Header>
)}
menuItemRender={(item, dom) => <Link to={item.path || '/'}>{dom}</Link>}
menuDataRender={() => [
{ path: '/', name: '首页', default: true },
{ path: '/staff-list', name: '日程表' },
{ path: '/notelist-page', name: '笔记备忘录' },
{ path: '/reservation-page', name: '会议室预定' },
{ path: '/team-page', name: '团队管理' },
]}
>
>
<div style={{ display: "flex", alignItems: "center" }}>
<img
src={"./assets/logo.png"}
alt="logo"
style={{ width: 150, height: 60 }}
/>
</div>
<div style={{ display: "flex", alignItems: "center" }}>
{avatarUrl ? (
<img
src={avatarUrl}
alt="avatar"
style={{
width: "24px",
height: "24px",
borderRadius: "50%",
marginRight: "8px",
}}
/>
) : (
<UserOutlined
style={{ fontSize: "24px", marginRight: "8px" }}
/>
)}
<span>你好, {username}</span>
<Dropdown overlay={<Menu items={items} />} trigger={["click"]}>
<a
onClick={(e) => e.preventDefault()}
style={{ marginLeft: "8px" }}
>
<DownOutlined />
</a>
</Dropdown>
</div>
</Header>
)}
menuItemRender={(item, dom) => <Link to={item.path || "/"}>{dom}</Link>}
menuDataRender={() => [
{ path: "/", name: "🏠 首页", default: true },
{ path: "/staff-list", name: "📆 日程表" },
{ path: "/notelist-page", name: "📒 笔记备忘录" },
{ path: "/reservation-page", name: "🚪 会议室预定" },
{ path: "/team-page", name: "👨‍👩‍👧‍👦 团队管理" },
]}
>
{contextHolder}
<Content style={{ padding: '0 24px 24px' }}>
<Outlet />
</Content>
</ProLayout>
<Content style={{ padding: "0 24px 24px" }}>
<Outlet />
</Content>
</ProLayout>
);
};

Expand Down
146 changes: 100 additions & 46 deletions frontend/src/pages/NotePage.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,17 @@ import {
Radio,
ConfigProvider
} from "antd";
import {
SaveOutlined
} from "@ant-design/icons"
import HttpUtil from "../utils/HttpUtil";
import ApiUtil from "../utils/ApiUtil";
import ReactQuill from "react-quill";
import "react-quill/dist/quill.snow.css";
import { ApiResponse } from "../utils/ApiUtil";
import '../css/editor.css'
import { RadioChangeEvent } from "antd/lib";
import { TinyColor } from '@ctrl/tinycolor';

const { Content } = Layout;
const { Panel } = Collapse;
Expand Down Expand Up @@ -174,13 +178,30 @@ class NoteList extends React.Component<{}, State> {
}
});
}
getColorByImportance = (importance: string) => {
if (importance == "Normal") {
return '#f0f5ff';
} else if (importance == "Important") {
return '#feffe6';
} else if (importance == "Crucial") {
return '#ffccc7';
}

}

render() {
return (
<Layout>
<div
style={{
minHeight:700,
background: "#ffffff",
borderRadius: 10,
boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.1)",
}}
>
<Content>
<div>
<div>
<div style={{paddingTop:20, paddingLeft:20}}>
<Input
placeholder="请输入笔记名称"
style={{ width: 200, marginRight: 10, marginBottom: 10 }}
Expand All @@ -189,28 +210,30 @@ class NoteList extends React.Component<{}, State> {
/>
<Button
type="primary"
className="bg-blue-300"
style={{ marginRight: 20 }}
onClick={() => this.addContent(this.state, false)}
icon={<SaveOutlined />}
iconPosition="start"
>
保存
</Button>
<Radio.Group value={this.state.importance}
onChange = {this.handleImportanceChange}
defaultValue={"Normal"}
>
<Radio.Button value="Normal">Normal</Radio.Button>
<Radio.Button value="Important">Important</Radio.Button>
<Radio.Button value="Crucial">Crucial</Radio.Button>
</Radio.Group>
<Radio.Group
value={this.state.importance}
onChange={this.handleImportanceChange}
defaultValue={"Normal"}
>
<Radio.Button value="Normal">Normal</Radio.Button>
<Radio.Button value="Important">Important</Radio.Button>
<Radio.Button value="Crucial">Crucial</Radio.Button>
</Radio.Group>
</div>
<div>
<div style={{paddingLeft:20,paddingRight:20}}>
<ReactQuill
theme="snow"
value={this.state.content || ""}
onChange={this.handleContentChange}
className="my-editor"
style={{ height: 200, marginBottom: 40, }}
style={{ marginBottom: 20 }}
modules={{
toolbar: [
["bold", "italic", "underline", "strike"], // toggled buttons
Expand All @@ -234,21 +257,23 @@ class NoteList extends React.Component<{}, State> {
}}
/>
</div>
</div>
</Content>
<div style={{ margin: "20px 0" }} />
<Content>
<div style={{marginLeft:20, marginRight:20, marginTop:30}}>
{this.state.noteTitles.map((title: string, index) => {
const importance = "Normal";
const importance_color = this.getColorByImportance(importance);
return (
<div>
<ConfigProvider
theme={{
token: {
},
token: {},
components: {
Collapse: {
// headerBg:
}
colorBorder: importance_color,
headerBg: importance_color
},
},
}}
>
Expand All @@ -271,43 +296,70 @@ class NoteList extends React.Component<{}, State> {
justifyContent: "flex-end",
}}
>
<span style={{fontSize: "normal", marginRight:10}}>🏷️ </span>
<span
style={{ fontWeight: "bold", marginRight: "auto" }}
style={{ fontWeight: "normal", marginRight: "auto" }}
>
{title}
</span>
<Button
ghost
type="primary"
style={{ marginLeft: 10 }}
onClick={async (event) => {
event.stopPropagation();
const note_content = await this.getNoteContent(
title
);
this.setState((prevState) => ({
noteContentCache: {
...prevState.noteContentCache,
[title]: note_content[0],
<ConfigProvider
theme={{
components: {
Button: {
defaultBg: '#ffffff',
defaultHoverBg:'#1677FF',
defaultColor: "#2f54eb",
defaultHoverColor: "#ffffff",
lineWidth: 0,
},
}));
console.log(note_content);
this.handleEditBottonClick(title, note_content);
},
}}
>
编辑
</Button>
<Button
ghost
danger
style={{ marginLeft: 10 }}
onClick={(event) => {
event.stopPropagation();
this.deleteNote(title);
<Button
type="default"
style={{ marginLeft: 10 }}
onClick={async (event) => {
event.stopPropagation();
const note_content = await this.getNoteContent(
title
);
this.setState((prevState) => ({
noteContentCache: {
...prevState.noteContentCache,
[title]: note_content[0],
},
}));
console.log(note_content);
this.handleEditBottonClick(title, note_content);
}}
>
编辑
</Button>
</ConfigProvider>
<ConfigProvider
theme={{
components: {
Button: {
defaultBg: '#ffffff',
defaultColor: '#f5222d',
defaultHoverBg: '#ff4d4f',
defaultHoverColor: '#ffffff',
lineWidth: 0,
},
},
}}
>
删除
</Button>
<Button
type="default"
style={{ marginLeft: 10 }}
onClick={(event) => {
event.stopPropagation();
this.deleteNote(title);
}}
>
删除
</Button>
</ConfigProvider>
</div>
}
key={index}
Expand All @@ -325,7 +377,9 @@ class NoteList extends React.Component<{}, State> {
</div>
);
})}
</div>
</Content>
</div>
</Layout>
);
}
Expand Down
Loading

0 comments on commit a3a6b31

Please sign in to comment.