Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

berry主题添加聊天按钮,并基于https://github.com/songquanpeng/one-api/pull/1401 实现点击聊天直接直接使用默认token #1480

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 12 additions & 2 deletions web/berry/src/menu-items/panel.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,12 @@ import {
IconKey,
IconGardenCart,
IconUser,
IconUserScan
IconUserScan,
IconMessageCircle
} from '@tabler/icons-react';

// constant
const icons = { IconDashboard, IconSitemap, IconArticle, IconCoin, IconAdjustments, IconKey, IconGardenCart, IconUser, IconUserScan };
const icons = { IconDashboard, IconSitemap, IconArticle, IconCoin, IconAdjustments, IconKey, IconGardenCart, IconUser, IconUserScan,IconMessageCircle };

// ==============================|| DASHBOARD MENU ITEMS ||============================== //

Expand All @@ -29,6 +30,15 @@ const panel = {
breadcrumbs: false,
isAdmin: false
},
{
id: 'chat',
title: '聊天',
type: 'item',
url: '/panel/chat',
icon: icons.IconMessageCircle,
breadcrumbs: false,
isAdmin: false
},
{
id: 'channel',
title: '渠道',
Expand Down
5 changes: 5 additions & 0 deletions web/berry/src/routes/MainRoutes.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { lazy } from 'react';
// project imports
import MainLayout from 'layout/MainLayout';
import Loadable from 'ui-component/Loadable';
import Chat from "../views/Chat";

const Channel = Loadable(lazy(() => import('views/Channel')));
const Log = Loadable(lazy(() => import('views/Log')));
Expand Down Expand Up @@ -31,6 +32,10 @@ const MainRoutes = {
path: 'dashboard',
element: <Dashboard />
},
{
path: 'chat',
element: <Chat />
},
{
path: 'channel',
element: <Channel />
Expand Down
28 changes: 28 additions & 0 deletions web/berry/src/views/Chat/index.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
.MuiContainer-root {
padding-left: 0;
padding-right: 0;
height: calc(100% - 1px);
max-width: unset;
}

.css-1xnbu7n-MuiContainer-root {
/* 如果有特定样式,请在此处添加 */
}

.css-9d4wr9 {
background-color: #eef2f6;
width: 100%;
min-height: calc(100vh - 88px);
flex-grow: 1;
padding: 0;
margin-top: 83.746px;
margin-right: 0;
border-radius: 12px;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
transition: margin 225ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
}

.chat-container {
height: 100%;
}
69 changes: 69 additions & 0 deletions web/berry/src/views/Chat/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
import React, { useEffect, useState } from "react";
import { API } from "../../utils/api";
import "./index.css";

const useIsSmallScreen = () => {
const [isSmallScreen, setIsSmallScreen] = useState(window.innerWidth <= 768);

useEffect(() => {
const handleResize = () => {
setIsSmallScreen(window.innerWidth <= 768);
};

window.addEventListener('resize', handleResize);

return () => {
window.removeEventListener('resize', handleResize);
};
}, []);

return isSmallScreen;
};

const Chat = () => {
const [chatUrl, setChatUrl] = useState("");
const [loading, setLoading] = useState(true);
// const isSmallScreen = useIsSmallScreen();

const loadTokens = async () => {
try {
const res = await API.get(`/api/token/`);
const siteInfo = JSON.parse(localStorage.getItem('siteInfo'));
if (!siteInfo) {
console.error("siteInfo not found in localStorage");
setLoading(false);
return;
}
// const url = `https://like.chatapi.asia/#/?settings={"key":"sk-xxx","url":"https://chat.chatapi.asia"}`;
const serverAddress = siteInfo.server_address;
const key = res.data.data[0].key;
const url = `${siteInfo.chat_link}/#/?settings={"key":"sk-${key}","url":"${serverAddress}"}`;

setChatUrl(url);
} catch (error) {
console.error("Error loading tokens:", error);
} finally {
setLoading(false);
}
};

useEffect(() => {
loadTokens();
}, []);

if (loading) {
return <div className="chat-container">Loading...</div>;
}

return (
<div className="chat-container">
<iframe
src={chatUrl}
style={{ height: '100%', width: '100%', padding: 0, border: 'none' }}
title="Chat"
/>
</div>
);
};

export default Chat;