xinyin025/new-api
1
0
Fork 0
mirror of https://github.com/linux-do/new-api.git synced 2025-09-18 00:16:37 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge branch 'main' into g-main

Browse Source 
# Conflicts:
#	web/src/App.js
This commit is contained in:
CalciumIon 2024-09-17 22:50:59 +08:00
commit ed948c121a
14 changed files with 455 additions and 324 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
README.md
View File

@ -1,6 +1,11 @@
<div align="center">
# New API # New API
<a href="https://trendshift.io/repositories/8227" target="_blank"><img src="https://trendshift.io/api/badge/repositories/8227" alt="Calcium-Ion%2Fnew-api | Trendshift" style="width: 250px; height: 55px;" width="250" height="55"/></a>
</div>
> [!NOTE] > [!NOTE]
> 本项目为开源项目，在[One API](https://github.com/songquanpeng/one-api)的基础上进行二次开发 > 本项目为开源项目，在[One API](https://github.com/songquanpeng/one-api)的基础上进行二次开发
@ -115,24 +120,18 @@ docker run --name new-api -d --restart always -p 3000:3000 -e SQL_DSN="root:1234
## Suno接口设置文档 ## Suno接口设置文档
[对接文档](Suno.md) [对接文档](Suno.md)
## 交流群
<img src="https://github.com/Calcium-Ion/new-api/assets/61247483/de536a8a-0161-47a7-a0a2-66ef6de81266" width="300">
## 界面截图 ## 界面截图
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/ad0e7aae-0203-471c-9716-2d83768927d4) ![image](https://github.com/Calcium-Ion/new-api/assets/61247483/ad0e7aae-0203-471c-9716-2d83768927d4)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/d1ac216e-0804-4105-9fdc-66b35022d861) ![image](https://github.com/Calcium-Ion/new-api/assets/61247483/3ca0b282-00ff-4c96-bf9d-e29ef615c605)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/3ca0b282-00ff-4c96-bf9d-e29ef615c605)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/f4f40ed4-8ccb-43d7-a580-90677827646d)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/90d7d763-6a77-4b36-9f76-2bb30f18583d) ![image](https://github.com/Calcium-Ion/new-api/assets/61247483/90d7d763-6a77-4b36-9f76-2bb30f18583d)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/e414228a-3c35-429a-b298-6451d76d9032)
夜间模式 夜间模式
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/1c66b593-bb9e-4757-9720-ff2759539242) ![image](https://github.com/Calcium-Ion/new-api/assets/61247483/1c66b593-bb9e-4757-9720-ff2759539242)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/5b3228e8-2556-44f7-97d6-4f8d8ee6effa)
![image](https://github.com/Calcium-Ion/new-api/assets/61247483/af9a07ee-5101-4b3d-8bd9-ae21a4fd7e9e) ![image](https://github.com/Calcium-Ion/new-api/assets/61247483/af9a07ee-5101-4b3d-8bd9-ae21a4fd7e9e)
## 交流群
<img src="https://github.com/Calcium-Ion/new-api/assets/61247483/de536a8a-0161-47a7-a0a2-66ef6de81266" width="200">
## 相关项目 ## 相关项目
- [One API](https://github.com/songquanpeng/one-api)：原版项目 - [One API](https://github.com/songquanpeng/one-api)：原版项目
- [Midjourney-Proxy](https://github.com/novicezk/midjourney-proxy)：Midjourney接口支持 - [Midjourney-Proxy](https://github.com/novicezk/midjourney-proxy)：Midjourney接口支持

5
common/utils.go
View File

@ -128,6 +128,11 @@ func IntMax(a int, b int) int {
} }
} }
func IsIP(s string) bool {
ip := net.ParseIP(s)
return ip != nil
}
func GetUUID() string { func GetUUID() string {
code := uuid.New().String() code := uuid.New().String()
code = strings.Replace(code, "-", "", -1) code = strings.Replace(code, "-", "", -1)

53
controller/model.go
View File

@ -146,22 +146,49 @@ func ListModels(c *gin.Context) {
}) })
return return
} }
models := model.GetGroupModels(user.Group)
userOpenAiModels := make([]dto.OpenAIModels, 0) userOpenAiModels := make([]dto.OpenAIModels, 0)
permission := getPermission() permission := getPermission()
for _, s := range models {
if _, ok := openAIModelsMap[s]; ok { modelLimitEnable := c.GetBool("token_model_limit_enabled")
userOpenAiModels = append(userOpenAiModels, openAIModelsMap[s]) if modelLimitEnable {
s, ok := c.Get("token_model_limit")
var tokenModelLimit map[string]bool
if ok {
tokenModelLimit = s.(map[string]bool)
} else { } else {
userOpenAiModels = append(userOpenAiModels, dto.OpenAIModels{ tokenModelLimit = map[string]bool{}
Id: s, }
Object: "model", for allowModel, _ := range tokenModelLimit {
Created: 1626777600, if _, ok := openAIModelsMap[allowModel]; ok {
OwnedBy: "custom", userOpenAiModels = append(userOpenAiModels, openAIModelsMap[allowModel])
Permission: permission, } else {
Root: s, userOpenAiModels = append(userOpenAiModels, dto.OpenAIModels{
Parent: nil, Id: allowModel,
}) Object: "model",
Created: 1626777600,
OwnedBy: "custom",
Permission: permission,
Root: allowModel,
Parent: nil,
})
}
}
} else {
models := model.GetGroupModels(user.Group)
for _, s := range models {
if _, ok := openAIModelsMap[s]; ok {
userOpenAiModels = append(userOpenAiModels, openAIModelsMap[s])
} else {
userOpenAiModels = append(userOpenAiModels, dto.OpenAIModels{
Id: s,
Object: "model",
Created: 1626777600,
OwnedBy: "custom",
Permission: permission,
Root: s,
Parent: nil,
})
}
} }
} }
c.JSON(200, gin.H{ c.JSON(200, gin.H{

2
controller/token.go
View File

@ -134,6 +134,7 @@ func AddToken(c *gin.Context) {
UnlimitedQuota: token.UnlimitedQuota, UnlimitedQuota: token.UnlimitedQuota,
ModelLimitsEnabled: token.ModelLimitsEnabled, ModelLimitsEnabled: token.ModelLimitsEnabled,
ModelLimits: token.ModelLimits, ModelLimits: token.ModelLimits,
AllowIps: token.AllowIps,
} }
err = cleanToken.Insert() err = cleanToken.Insert()
if err != nil { if err != nil {
@ -221,6 +222,7 @@ func UpdateToken(c *gin.Context) {
cleanToken.UnlimitedQuota = token.UnlimitedQuota cleanToken.UnlimitedQuota = token.UnlimitedQuota
cleanToken.ModelLimitsEnabled = token.ModelLimitsEnabled cleanToken.ModelLimitsEnabled = token.ModelLimitsEnabled
cleanToken.ModelLimits = token.ModelLimits cleanToken.ModelLimits = token.ModelLimits
cleanToken.AllowIps = token.AllowIps
} }
err = cleanToken.Update() err = cleanToken.Update()
if err != nil { if err != nil {

1
middleware/auth.go
View File

@ -175,6 +175,7 @@ func TokenAuth() func(c *gin.Context) {
} else { } else {
c.Set("token_model_limit_enabled", false) c.Set("token_model_limit_enabled", false)
} }
c.Set("allow_ips", token.GetIpLimitsMap())
if len(parts) > 1 { if len(parts) > 1 {
if model.IsAdmin(token.UserId) { if model.IsAdmin(token.UserId) {
c.Set("specific_channel_id", parts[1]) c.Set("specific_channel_id", parts[1])

8
middleware/distributor.go
View File

@ -22,6 +22,14 @@ type ModelRequest struct {
func Distribute() func(c *gin.Context) { func Distribute() func(c *gin.Context) {
return func(c *gin.Context) { return func(c *gin.Context) {
allowIpsMap := c.GetStringMap("allow_ips")
if len(allowIpsMap) != 0 {
clientIp := c.ClientIP()
if _, ok := allowIpsMap[clientIp]; !ok {
abortWithOpenAiMessage(c, http.StatusForbidden, "您的 IP 不在令牌允许访问的列表中")
return
}
}
userId := c.GetInt("id") userId := c.GetInt("id")
var channel *model.Channel var channel *model.Channel
channelId, ok := c.Get("specific_channel_id") channelId, ok := c.Get("specific_channel_id")

25
model/token.go
View File

@ -23,10 +23,33 @@ type Token struct {
UnlimitedQuota bool `json:"unlimited_quota" gorm:"default:false"` UnlimitedQuota bool `json:"unlimited_quota" gorm:"default:false"`
ModelLimitsEnabled bool `json:"model_limits_enabled" gorm:"default:false"` ModelLimitsEnabled bool `json:"model_limits_enabled" gorm:"default:false"`
ModelLimits string `json:"model_limits" gorm:"type:varchar(1024);default:''"` ModelLimits string `json:"model_limits" gorm:"type:varchar(1024);default:''"`
AllowIps *string `json:"allow_ips" gorm:"default:''"`
UsedQuota int `json:"used_quota" gorm:"default:0"` // used quota UsedQuota int `json:"used_quota" gorm:"default:0"` // used quota
DeletedAt gorm.DeletedAt `gorm:"index"` DeletedAt gorm.DeletedAt `gorm:"index"`
} }
func (token *Token) GetIpLimitsMap() map[string]any {
// delete empty spaces
//split with \n
ipLimitsMap := make(map[string]any)
if token.AllowIps == nil {
return ipLimitsMap
}
cleanIps := strings.ReplaceAll(*token.AllowIps, " ", "")
if cleanIps == "" {
return ipLimitsMap
}
ips := strings.Split(cleanIps, "\n")
for _, ip := range ips {
ip = strings.TrimSpace(ip)
ip = strings.ReplaceAll(ip, ",", "")
if common.IsIP(ip) {
ipLimitsMap[ip] = true
}
}
return ipLimitsMap
}
func GetAllUserTokens(userId int, startIdx int, num int) ([]*Token, error) { func GetAllUserTokens(userId int, startIdx int, num int) ([]*Token, error) {
var tokens []*Token var tokens []*Token
var err error var err error
@ -130,7 +153,7 @@ func (token *Token) Insert() error {
// Update Make sure your token's fields is completed, because this will update non-zero values // Update Make sure your token's fields is completed, because this will update non-zero values
func (token *Token) Update() error { func (token *Token) Update() error {
var err error var err error
err = DB.Model(token).Select("name", "status", "expired_time", "remain_quota", "unlimited_quota", "model_limits_enabled", "model_limits").Updates(token).Error err = DB.Model(token).Select("name", "status", "expired_time", "remain_quota", "unlimited_quota", "model_limits_enabled", "model_limits", "allow_ips").Updates(token).Error
return err return err
} }

381
web/src/App.js
View File

@ -20,12 +20,11 @@ import Redemption from './pages/Redemption';
import TopUp from './pages/TopUp'; import TopUp from './pages/TopUp';
import Log from './pages/Log'; import Log from './pages/Log';
import Chat from './pages/Chat'; import Chat from './pages/Chat';
import Chat2Link from './pages/Chat2Link'; import Chat2Link from './pages/Chat2Link';
import { Layout } from '@douyinfe/semi-ui'; import { Layout } from '@douyinfe/semi-ui';
import Midjourney from './pages/Midjourney'; import Midjourney from './pages/Midjourney';
import Pricing from './pages/Pricing/index.js'; import Pricing from './pages/Pricing/index.js';
import Task from "./pages/Task/index.js"; import Task from "./pages/Task/index.js";
// import Detail from './pages/Detail';
const Home = lazy(() => import('./pages/Home')); const Home = lazy(() => import('./pages/Home'));
const Detail = lazy(() => import('./pages/Detail')); const Detail = lazy(() => import('./pages/Detail'));
@ -59,204 +58,203 @@ function App() {
}, []); }, []);
return ( return (
<Layout> <>
<Layout.Content> <Routes>
<Routes> <Route
<Route path='/'
path='/' element={
element={ <Suspense fallback={<Loading></Loading>}>
<Home />
</Suspense>
}
/>
<Route
path='/channel'
element={
<PrivateRoute>
<Channel />
</PrivateRoute>
}
/>
<Route
path='/channel/edit/:id'
element={
<Suspense fallback={<Loading></Loading>}>
<EditChannel />
</Suspense>
}
/>
<Route
path='/channel/add'
element={
<Suspense fallback={<Loading></Loading>}>
<EditChannel />
</Suspense>
}
/>
<Route
path='/token'
element={
<PrivateRoute>
<Token />
</PrivateRoute>
}
/>
<Route
path='/redemption'
element={
<PrivateRoute>
<Redemption />
</PrivateRoute>
}
/>
<Route
path='/user'
element={
<PrivateRoute>
<User />
</PrivateRoute>
}
/>
<Route
path='/user/edit/:id'
element={
<Suspense fallback={<Loading></Loading>}>
<EditUser />
</Suspense>
}
/>
<Route
path='/user/edit'
element={
<Suspense fallback={<Loading></Loading>}>
<EditUser />
</Suspense>
}
/>
<Route
path='/user/reset'
element={
<Suspense fallback={<Loading></Loading>}>
<PasswordResetConfirm />
</Suspense>
}
/>
<Route
path='/login'
element={
<Suspense fallback={<Loading></Loading>}>
<LoginForm />
</Suspense>
}
/>
<Route
path='/register'
element={
<Suspense fallback={<Loading></Loading>}>
<RegisterForm />
</Suspense>
}
/>
<Route
path='/reset'
element={
<Suspense fallback={<Loading></Loading>}>
<PasswordResetForm />
</Suspense>
}
/>
<Route
path='/oauth/github'
element={
<Suspense fallback={<Loading></Loading>}>
<GitHubOAuth />
</Suspense>
}
/>
<Route
path='/setting'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<Home /> <Setting />
</Suspense> </Suspense>
} </PrivateRoute>
/> }
<Route />
path='/channel' <Route
element={ path='/topup'
<PrivateRoute> element={
<Channel /> <PrivateRoute>
</PrivateRoute>
}
/>
<Route
path='/channel/edit/:id'
element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditChannel /> <TopUp />
</Suspense> </Suspense>
} </PrivateRoute>
/> }
<Route />
path='/channel/add' <Route
element={ path='/log'
element={
<PrivateRoute>
<Log />
</PrivateRoute>
}
/>
<Route
path='/detail'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditChannel /> <Detail />
</Suspense> </Suspense>
} </PrivateRoute>
/> }
<Route />
path='/token' <Route
element={ path='/midjourney'
<PrivateRoute> element={
<Token /> <PrivateRoute>
</PrivateRoute>
}
/>
<Route
path='/redemption'
element={
<PrivateRoute>
<Redemption />
</PrivateRoute>
}
/>
<Route
path='/user'
element={
<PrivateRoute>
<User />
</PrivateRoute>
}
/>
<Route
path='/user/edit/:id'
element={
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditUser /> <Midjourney />
</Suspense> </Suspense>
} </PrivateRoute>
/> }
<Route />
path='/user/edit' <Route
element={ path='/task'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}> <Suspense fallback={<Loading></Loading>}>
<EditUser /> <Task />
</Suspense> </Suspense>
} </PrivateRoute>
/> }
<Route />
path='/user/reset' <Route
element={ path='/pricing'
<Suspense fallback={<Loading></Loading>}> element={
<PasswordResetConfirm /> <Suspense fallback={<Loading></Loading>}>
</Suspense> <Pricing />
} </Suspense>
/> }
<Route />
path='/login' <Route
element={ path='/about'
<Suspense fallback={<Loading></Loading>}> element={
<LoginForm /> <Suspense fallback={<Loading></Loading>}>
</Suspense> <About />
} </Suspense>
/> }
<Route />
path='/register' <Route
element={ path='/chat'
<Suspense fallback={<Loading></Loading>}> element={
<RegisterForm /> <Suspense fallback={<Loading></Loading>}>
</Suspense> <Chat />
} </Suspense>
/> }
<Route />
path='/reset' {/* 方便使用chat2link直接跳转聊天... */}
element={
<Suspense fallback={<Loading></Loading>}>
<PasswordResetForm />
</Suspense>
}
/>
<Route
path='/oauth/github'
element={
<Suspense fallback={<Loading></Loading>}>
<GitHubOAuth />
</Suspense>
}
/>
<Route
path='/setting'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}>
<Setting />
</Suspense>
</PrivateRoute>
}
/>
<Route
path='/topup'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}>
<TopUp />
</Suspense>
</PrivateRoute>
}
/>
<Route
path='/log'
element={
<PrivateRoute>
<Log />
</PrivateRoute>
}
/>
<Route
path='/detail'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}>
<Detail />
</Suspense>
</PrivateRoute>
}
/>
<Route
path='/midjourney'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}>
<Midjourney />
</Suspense>
</PrivateRoute>
}
/>
<Route
path='/task'
element={
<PrivateRoute>
<Suspense fallback={<Loading></Loading>}>
<Task />
</Suspense>
</PrivateRoute>
}
/>
<Route
path='/pricing'
element={
<Suspense fallback={<Loading></Loading>}>
<Pricing />
</Suspense>
}
/>
<Route
path='/about'
element={
<Suspense fallback={<Loading></Loading>}>
<About />
</Suspense>
}
/>
<Route
path='/chat'
element={
<Suspense fallback={<Loading></Loading>}>
<Chat />
</Suspense>
}
/>
{/* 方便使用chat2link直接跳转聊天... */}
<Route <Route
path='/chat2link' path='/chat2link'
element={ element={
@ -269,8 +267,7 @@ function App() {
/> />
<Route path='*' element={<NotFound />} /> <Route path='*' element={<NotFound />} />
</Routes> </Routes>
</Layout.Content> </>
</Layout>
); );
} }

26
web/src/components/Footer.js
View File

@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react';
import { getFooterHTML, getSystemName } from '../helpers'; import { getFooterHTML, getSystemName } from '../helpers';
import { Layout, Tooltip } from '@douyinfe/semi-ui'; import { Layout, Tooltip } from '@douyinfe/semi-ui';
const Footer = () => { const FooterBar = () => {
const systemName = getSystemName(); const systemName = getSystemName();
const [footer, setFooter] = useState(getFooterHTML()); const [footer, setFooter] = useState(getFooterHTML());
let remainCheckTimes = 5; let remainCheckTimes = 5;
@ -56,19 +56,17 @@ const Footer = () => {
}, []); }, []);
return ( return (
<Layout> <div style={{ textAlign: 'center' }}>
<Layout.Content style={{ textAlign: 'center' }}> {footer ? (
{footer ? ( <div
<div className='custom-footer'
className='custom-footer' dangerouslySetInnerHTML={{ __html: footer }}
dangerouslySetInnerHTML={{ __html: footer }} ></div>
></div> ) : (
) : ( defaultFooter
defaultFooter )}
)} </div>
</Layout.Content>
</Layout>
); );
}; };
export default Footer; export default FooterBar;

65
web/src/components/HeaderBar.js
View File

@ -3,14 +3,23 @@ import { Link, useNavigate } from 'react-router-dom';
import { UserContext } from '../context/User'; import { UserContext } from '../context/User';
import { useSetTheme, useTheme } from '../context/Theme'; import { useSetTheme, useTheme } from '../context/Theme';
import { API, getLogo, getSystemName, showSuccess } from '../helpers'; import { API, getLogo, getSystemName, isMobile, showSuccess } from '../helpers';
import '../index.css'; import '../index.css';
import fireworks from 'react-fireworks'; import fireworks from 'react-fireworks';
import { IconHelpCircle, IconKey, IconUser } from '@douyinfe/semi-icons'; import {
IconHelpCircle,
IconHome,
IconHomeStroked,
IconKey,
IconNoteMoneyStroked,
IconPriceTag,
IconUser
} from '@douyinfe/semi-icons';
import { Avatar, Dropdown, Layout, Nav, Switch } from '@douyinfe/semi-ui'; import { Avatar, Dropdown, Layout, Nav, Switch } from '@douyinfe/semi-ui';
import { stringToColor } from '../helpers/render'; import { stringToColor } from '../helpers/render';
import Text from '@douyinfe/semi-ui/lib/es/typography/text';
// HeaderBar Buttons // HeaderBar Buttons
let headerButtons = [ let headerButtons = [
@ -22,6 +31,21 @@ let headerButtons = [
}, },
]; ];
let buttons = [
{
text: '首页',
itemKey: 'home',
to: '/',
icon: <IconHomeStroked />,
},
// {
// text: '模型价格',
// itemKey: 'pricing',
// to: '/pricing',
// icon: <IconNoteMoneyStroked />,
// },
];
if (localStorage.getItem('chat_link')) { if (localStorage.getItem('chat_link')) {
headerButtons.splice(1, 0, { headerButtons.splice(1, 0, {
name: '聊天', name: '聊天',
@ -90,6 +114,7 @@ const HeaderBar = () => {
about: '/about', about: '/about',
login: '/login', login: '/login',
register: '/register', register: '/register',
home: '/',
}; };
return ( return (
<Link <Link
@ -103,6 +128,18 @@ const HeaderBar = () => {
selectedKeys={[]} selectedKeys={[]}
// items={headerButtons} // items={headerButtons}
onSelect={(key) => {}} onSelect={(key) => {}}
header={isMobile()?{
logo: (
<img src={logo} alt='logo' style={{ marginRight: '0.75em' }} />
),
}:{
logo: (
<img src={logo} alt='logo' />
),
text: systemName,
}}
items={buttons}
footer={ footer={
<> <>
{isNewYear && ( {isNewYear && (
@ -121,15 +158,19 @@ const HeaderBar = () => {
</Dropdown> </Dropdown>
)} )}
<Nav.Item itemKey={'about'} icon={<IconHelpCircle />} /> <Nav.Item itemKey={'about'} icon={<IconHelpCircle />} />
<Switch <>
checkedText='🌞' {!isMobile() && (
size={'large'} <Switch
checked={theme === 'dark'} checkedText='🌞'
uncheckedText='🌙' size={'large'}
onChange={(checked) => { checked={theme === 'dark'}
setTheme(checked); uncheckedText='🌙'
}} onChange={(checked) => {
/> setTheme(checked);
}}
/>
)}
</>
{userState.user ? ( {userState.user ? (
<> <>
<Dropdown <Dropdown
@ -155,7 +196,7 @@ const HeaderBar = () => {
<Nav.Item <Nav.Item
itemKey={'login'} itemKey={'login'}
text={'登录'} text={'登录'}
icon={<IconKey />} // icon={<IconKey />}
/> />
<Nav.Item <Nav.Item
itemKey={'register'} itemKey={'register'}

124
web/src/components/SiderBar.js
View File

@ -17,7 +17,7 @@ import {
IconCalendarClock, IconChecklistStroked, IconCalendarClock, IconChecklistStroked,
IconComment, IconComment,
IconCreditCard, IconCreditCard,
IconGift, IconGift, IconHelpCircle,
IconHistogram, IconHistogram,
IconHome, IconHome,
IconImage, IconImage,
@ -25,10 +25,12 @@ import {
IconLayers, IconLayers,
IconPriceTag, IconPriceTag,
IconSetting, IconSetting,
IconUser, IconUser
} from '@douyinfe/semi-icons'; } from '@douyinfe/semi-icons';
import { Layout, Nav } from '@douyinfe/semi-ui'; import { Avatar, Dropdown, Layout, Nav, Switch } from '@douyinfe/semi-ui';
import { setStatusData } from '../helpers/data.js'; import { setStatusData } from '../helpers/data.js';
import { stringToColor } from '../helpers/render.js';
import { useSetTheme, useTheme } from '../context/Theme/index.js';
// HeaderBar Buttons // HeaderBar Buttons
@ -43,6 +45,8 @@ const SiderBar = () => {
const systemName = getSystemName(); const systemName = getSystemName();
const logo = getLogo(); const logo = getLogo();
const [isCollapsed, setIsCollapsed] = useState(defaultIsCollapsed); const [isCollapsed, setIsCollapsed] = useState(defaultIsCollapsed);
const theme = useTheme();
const setTheme = useSetTheme();
const routerMap = { const routerMap = {
home: '/', home: '/',
@ -63,11 +67,17 @@ const SiderBar = () => {
const headerButtons = useMemo( const headerButtons = useMemo(
() => [ () => [
// {
// text: '首页',
// itemKey: 'home',
// to: '/',
// icon: <IconHome />,
// },
{ {
text: '首页', text: '模型价格',
itemKey: 'home', itemKey: 'pricing',
to: '/', to: '/pricing',
icon: <IconHome />, icon: <IconPriceTag />,
}, },
{ {
text: '渠道', text: '渠道',
@ -104,12 +114,6 @@ const SiderBar = () => {
to: '/topup', to: '/topup',
icon: <IconCreditCard />, icon: <IconCreditCard />,
}, },
{
text: '模型价格',
itemKey: 'pricing',
to: '/pricing',
icon: <IconPriceTag />,
},
{ {
text: '用户管理', text: '用户管理',
itemKey: 'user', itemKey: 'user',
@ -205,48 +209,58 @@ const SiderBar = () => {
return ( return (
<> <>
<Layout> <Nav
<div style={{ height: '100%' }}> style={{ maxWidth: 220, height: '100%' }}
<Nav defaultIsCollapsed={
// bodyStyle={{ maxWidth: 200 }} isMobile() ||
style={{ maxWidth: 200 }} localStorage.getItem('default_collapse_sidebar') === 'true'
defaultIsCollapsed={ }
isMobile() || isCollapsed={isCollapsed}
localStorage.getItem('default_collapse_sidebar') === 'true' onCollapseChange={(collapsed) => {
} setIsCollapsed(collapsed);
isCollapsed={isCollapsed} }}
onCollapseChange={(collapsed) => { selectedKeys={selectedKeys}
setIsCollapsed(collapsed); renderWrapper={({ itemElement, isSubNav, isInSubNav, props }) => {
}} return (
selectedKeys={selectedKeys} <Link
renderWrapper={({ itemElement, isSubNav, isInSubNav, props }) => { style={{ textDecoration: 'none' }}
return ( to={routerMap[props.itemKey]}
<Link >
style={{ textDecoration: 'none' }} {itemElement}
to={routerMap[props.itemKey]} </Link>
> );
{itemElement} }}
</Link> items={headerButtons}
); onSelect={(key) => {
}} setSelectedKeys([key.itemKey]);
items={headerButtons} }}
onSelect={(key) => { // header={{
setSelectedKeys([key.itemKey]); // logo: (
}} // <img src={logo} alt='logo' style={{ marginRight: '0.75em' }} />
header={{ // ),
logo: ( // text: systemName,
<img src={logo} alt='logo' style={{ marginRight: '0.75em' }} /> // }}
), // footer={{
text: systemName, // text: '© 2021 NekoAPI',
}} // }}
// footer={{ footer={
// text: '© 2021 NekoAPI', <>
// }} {isMobile() && (
> <Switch
<Nav.Footer collapseButton={true}></Nav.Footer> checkedText='🌞'
</Nav> size={'small'}
</div> checked={theme === 'dark'}
</Layout> uncheckedText='🌙'
onChange={(checked) => {
setTheme(checked);
}}
/>
)}
</>
}
>
<Nav.Footer collapseButton={true}></Nav.Footer>
</Nav>
</> </>
); );
}; };

11
web/src/index.css
View File

@ -9,11 +9,12 @@ body {
scrollbar-width: none; scrollbar-width: none;
color: var(--semi-color-text-0) !important; color: var(--semi-color-text-0) !important;
background-color: var(--semi-color-bg-0) !important; background-color: var(--semi-color-bg-0) !important;
height: 100%; height: 100vh;
} }
#root { #root {
height: 100%; height: 100vh;
flex-direction: column;
} }
@media only screen and (max-width: 767px) { @media only screen and (max-width: 767px) {
@ -50,9 +51,9 @@ body {
} }
} }
.semi-layout { /*.semi-layout {*/
height: 100%; /* height: 100%;*/
} /*}*/
.tableShow { .tableShow {
display: revert; display: revert;

40
web/src/index.js
View File

@ -3,7 +3,6 @@ import ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom'; import { BrowserRouter } from 'react-router-dom';
import App from './App'; import App from './App';
import HeaderBar from './components/HeaderBar'; import HeaderBar from './components/HeaderBar';
import Footer from './components/Footer';
import 'semantic-ui-offline/semantic.min.css'; import 'semantic-ui-offline/semantic.min.css';
import './index.css'; import './index.css';
import { UserProvider } from './context/User'; import { UserProvider } from './context/User';
@ -13,35 +12,36 @@ import { StatusProvider } from './context/Status';
import { Layout } from '@douyinfe/semi-ui'; import { Layout } from '@douyinfe/semi-ui';
import SiderBar from './components/SiderBar'; import SiderBar from './components/SiderBar';
import { ThemeProvider } from './context/Theme'; import { ThemeProvider } from './context/Theme';
import FooterBar from './components/Footer';
// initialization // initialization
const root = ReactDOM.createRoot(document.getElementById('root')); const root = ReactDOM.createRoot(document.getElementById('root'));
const { Sider, Content, Header } = Layout; const { Sider, Content, Header, Footer } = Layout;
root.render( root.render(
<React.StrictMode> <React.StrictMode>
<StatusProvider> <StatusProvider>
<UserProvider> <UserProvider>
<BrowserRouter> <BrowserRouter>
<ThemeProvider> <ThemeProvider>
<Layout> <Layout style={{ height: '100vh', display: 'flex', flexDirection: 'column' }}>
<Sider> <Header>
<SiderBar /> <HeaderBar />
</Sider> </Header>
<Layout> <Layout style={{ flex: 1, overflow: 'hidden' }}>
<Header> <Sider>
<HeaderBar /> <SiderBar />
</Header> </Sider>
<Content <Layout>
style={{ <Content
padding: '24px', style={{ overflowY: 'auto', padding: '24px' }}
}} >
> <App />
<App /> </Content>
</Content> <Layout.Footer>
<Layout.Footer> <FooterBar></FooterBar>
<Footer></Footer> </Layout.Footer>
</Layout.Footer> </Layout>
</Layout> </Layout>
<ToastContainer /> <ToastContainer />
</Layout> </Layout>

19
web/src/pages/Token/EditToken.js
View File

@ -18,8 +18,8 @@ import {
Select, Select,
SideSheet, SideSheet,
Space, Space,
Spin, Spin, TextArea,
Typography, Typography
} from '@douyinfe/semi-ui'; } from '@douyinfe/semi-ui';
import Title from '@douyinfe/semi-ui/lib/es/typography/title'; import Title from '@douyinfe/semi-ui/lib/es/typography/title';
import { Divider } from 'semantic-ui-react'; import { Divider } from 'semantic-ui-react';
@ -34,6 +34,7 @@ const EditToken = (props) => {
unlimited_quota: false, unlimited_quota: false,
model_limits_enabled: false, model_limits_enabled: false,
model_limits: [], model_limits: [],
allow_ips: '',
}; };
const [inputs, setInputs] = useState(originInputs); const [inputs, setInputs] = useState(originInputs);
const { const {
@ -43,6 +44,7 @@ const EditToken = (props) => {
unlimited_quota, unlimited_quota,
model_limits_enabled, model_limits_enabled,
model_limits, model_limits,
allow_ips
} = inputs; } = inputs;
// const [visible, setVisible] = useState(false); // const [visible, setVisible] = useState(false);
const [models, setModels] = useState({}); const [models, setModels] = useState({});
@ -374,6 +376,19 @@ const EditToken = (props) => {
</Button> </Button>
</div> </div>
<Divider /> <Divider />
<div style={{ marginTop: 10 }}>
<Typography.Text>IP白名单（请勿过度信任此功能）</Typography.Text>
</div>
<TextArea
label='IP白名单'
name='allow_ips'
placeholder={'允许的IP，一行一个'}
onChange={(value) => {
handleInputChange('allow_ips', value);
}}
value={inputs.allow_ips}
style={{ fontFamily: 'JetBrains Mono, Consolas' }}
/>
<div style={{ marginTop: 10, display: 'flex' }}> <div style={{ marginTop: 10, display: 'flex' }}>
<Space> <Space>
<Checkbox <Checkbox