xinyin025/ChatGPT-Next-Web
1
0
Fork 0
mirror of https://github.com/ChatGPTNextWeb/ChatGPT-Next-Web.git synced 2025-10-02 16:16:39 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

update ui

Browse Source
This commit is contained in:
sijinhui 2024-05-15 00:39:45 +08:00
parent 8dc76ac212
commit 71176bcc74
3 changed files with 82 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/components/ui-lib.module.scss
View File

@ -326,3 +326,10 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.modal-mask-container {
//min-width: 80vw;
.ant-card .ant-card-body {
padding: 12px;
}
}

90
app/components/ui-lib.tsx
View File

@ -15,7 +15,8 @@ import Locale from "../locales";
import { createRoot } from "react-dom/client"; import { createRoot } from "react-dom/client";
import React, { HTMLProps, useEffect, useState } from "react"; import React, { HTMLProps, useEffect, useState } from "react";
import { IconButton } from "./button"; import { IconButton } from "./button";
import { Card as AntCard, List as AntList, Row, Col, Grid } from "antd"; import { Card as AntCard, List as AntList, Row, Col, Grid, Avatar } from "antd";
const { Meta } = AntCard;
export function Popover(props: { export function Popover(props: {
children: JSX.Element; children: JSX.Element;
@ -501,20 +502,79 @@ export function ModalSelector<T>(props: {
console.log("-----", props); console.log("-----", props);
return ( return (
<div className={styles["modal-mask"]}> <div
<Modal title="test" onClose={() => props.onClose?.()}> className={styles["modal-mask"] + " " + styles["modal-mask-container"]}
<AntList grid={{ gutter: 16, column: 3 }}> >
<Row gutter={[16, 16]}> <Modal title="选择模型" onClose={() => props.onClose?.()}>
<Col span={8}> <AntList grid={{ gutter: 16 }}>
<AntList.Item> <Row
<AntCard title="你好">Card</AntCard> gutter={[16, 16]}
</AntList.Item> style={{ marginLeft: "-8px", marginRight: "-8px" }}
</Col> >
<Col span={8}> {props.items.map((item, i) => {
<AntList.Item> const selected = props.defaultSelectedValue === item.value;
<AntCard title="你好">Card</AntCard> return (
</AntList.Item> <Col
</Col> key={i}
xs={{ flex: "100%" }}
sm={{ flex: "50%" }}
md={{ flex: "33%" }}
lg={{ flex: "33%" }}
xl={{ flex: "33%" }}
>
<AntCard>
<AntList.Item
onClick={() => {
props.onSelection?.([item.value]);
props.onClose?.();
}}
>
<Meta title={item.title} description={item.subTitle} />
{selected ? (
<div
style={{
height: 10,
width: 10,
backgroundColor: "var(--primary)",
borderRadius: 10,
}}
></div>
) : (
<></>
)}
</AntList.Item>
</AntCard>
</Col>
);
})}
{/*<Col xs={{ flex: '100%' }}*/}
{/* sm={{ flex: '50%' }}*/}
{/* md={{ flex: '33%' }}*/}
{/* lg={{ flex: '33%' }}*/}
{/* xl={{ flex: '33%' }}>*/}
{/* <AntList.Item>*/}
{/* <AntCard title="你好">Card</AntCard>*/}
{/* </AntList.Item>*/}
{/*</Col>*/}
{/*<Col xs={{ flex: '100%' }}*/}
{/* sm={{ flex: '50%' }}*/}
{/* md={{ flex: '33%' }}*/}
{/* lg={{ flex: '33%' }}*/}
{/* xl={{ flex: '33%' }}>*/}
{/* <AntList.Item>*/}
{/* <AntCard title="你好">Card</AntCard>*/}
{/* </AntList.Item>*/}
{/*</Col>*/}
{/*<Col xs={{ flex: '100%' }}*/}
{/* sm={{ flex: '50%' }}*/}
{/* md={{ flex: '33%' }}*/}
{/* lg={{ flex: '33%' }}*/}
{/* xl={{ flex: '33%' }}>*/}
{/* <AntList.Item>*/}
{/* <AntCard title="你好">Card</AntCard>*/}
{/* </AntList.Item>*/}
{/*</Col>*/}
</Row> </Row>
</AntList> </AntList>
</Modal> </Modal>

1
app/constant.ts
View File

@ -134,7 +134,6 @@ export const KnowledgeCutOffDate: Record<string, string> = {
"gpt-4-turbo": "2023-12", "gpt-4-turbo": "2023-12",
"gpt-4-turbo-2024-04-09": "2023-12", "gpt-4-turbo-2024-04-09": "2023-12",
"gpt-4-turbo-preview": "2023-12", "gpt-4-turbo-preview": "2023-12",
"gpt-4o": "2023-10",
"gpt-4o-2024-05-13": "2023-10", "gpt-4o-2024-05-13": "2023-10",
"gpt-4-vision-preview": "2023-04", "gpt-4-vision-preview": "2023-04",
// After improvements, // After improvements,