Merge cc367dd95b
into fdd7bf41c0
This commit is contained in:
commit
91e295cba1
@ -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 ||============================== //
|
||||
|
||||
@ -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: '渠道',
|
||||
|
@ -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')));
|
||||
@ -31,6 +32,10 @@ const MainRoutes = {
|
||||
path: 'dashboard',
|
||||
element: <Dashboard />
|
||||
},
|
||||
{
|
||||
path: 'chat',
|
||||
element: <Chat />
|
||||
},
|
||||
{
|
||||
path: 'channel',
|
||||
element: <Channel />
|
||||
|
28
web/berry/src/views/Chat/index.css
Normal file
28
web/berry/src/views/Chat/index.css
Normal file
@ -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
web/berry/src/views/Chat/index.js
Normal file
69
web/berry/src/views/Chat/index.js
Normal file
@ -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;
|
Loading…
Reference in New Issue
Block a user