github/DB-GPT
1
0
Fork 0
mirror of https://github.com/csunny/DB-GPT.git synced 2025-08-13 14:06:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: make tr element darker when hover

Browse Source
This commit is contained in:
shiweisong.ssw 2023-06-29 18:36:05 +08:00
parent 8c35b02c8a
commit ab0586e5b1
4 changed files with 135 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
datacenter/app/datastores/constants.tsx
View File

@ -1 +1 @@
export const fetchURL = 'http://30.183.154.125:5000'; export const fetchBaseURL = 'http://30.183.154.125:5000';

34
datacenter/app/datastores/documents/chunklist/page.tsx
View File

@ -2,12 +2,13 @@
import { useSearchParams } from 'next/navigation' import { useSearchParams } from 'next/navigation'
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import { Table, Stack } from '@/lib/mui' import { useColorScheme, Table, Stack } from '@/lib/mui'
import { Popover, Pagination } from 'antd' import { Popover, Pagination } from 'antd'
import { fetchURL } from '@/app/datastores/constants'; import { fetchBaseURL } from '@/app/datastores/constants'
const page_size = 20 const page_size = 20
const ChunkList = () => { const ChunkList = () => {
const { mode } = useColorScheme()
const spaceName = useSearchParams().get('spacename') const spaceName = useSearchParams().get('spacename')
const documentId = useSearchParams().get('documentid') const documentId = useSearchParams().get('documentid')
const [total, setTotal] = useState<number>(0) const [total, setTotal] = useState<number>(0)
@ -16,7 +17,7 @@ const ChunkList = () => {
useEffect(() => { useEffect(() => {
async function fetchChunks() { async function fetchChunks() {
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/chunk/list`, `${fetchBaseURL}/knowledge/${spaceName}/chunk/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -42,7 +43,20 @@ const ChunkList = () => {
<div className="p-4"> <div className="p-4">
{chunkList.length ? ( {chunkList.length ? (
<> <>
<Table color="info" variant="soft" size="lg"> <Table
color="info"
variant="soft"
size="lg"
sx={{
'& tbody tr: hover': {
backgroundColor:
mode === 'light' ? 'rgb(246, 246, 246)' : 'rgb(33, 33, 40)'
},
'& tbody tr: hover a': {
textDecoration: 'underline'
}
}}
>
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>
@ -79,9 +93,13 @@ const ChunkList = () => {
))} ))}
</tbody> </tbody>
</Table> </Table>
<Stack direction="row" justifyContent="flex-end" sx={{ <Stack
marginTop: '20px' direction="row"
}}> justifyContent="flex-end"
sx={{
marginTop: '20px'
}}
>
<Pagination <Pagination
defaultPageSize={20} defaultPageSize={20}
showSizeChanger={false} showSizeChanger={false}
@ -89,7 +107,7 @@ const ChunkList = () => {
total={total} total={total}
onChange={async (page) => { onChange={async (page) => {
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/chunk/list`, `${fetchBaseURL}/knowledge/${spaceName}/chunk/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {

63
datacenter/app/datastores/documents/page.tsx
View File

@ -3,6 +3,7 @@
import { useRouter, useSearchParams } from 'next/navigation' import { useRouter, useSearchParams } from 'next/navigation'
import React, { useState, useEffect } from 'react' import React, { useState, useEffect } from 'react'
import { import {
useColorScheme,
Button, Button,
Table, Table,
Sheet, Sheet,
@ -18,7 +19,7 @@ import moment from 'moment'
import { InboxOutlined } from '@ant-design/icons' import { InboxOutlined } from '@ant-design/icons'
import type { UploadProps } from 'antd' import type { UploadProps } from 'antd'
import { Upload, Pagination, message } from 'antd' import { Upload, Pagination, message } from 'antd'
import { fetchURL } from '@/app/datastores/constants'; import { fetchBaseURL } from '@/app/datastores/constants'
const { Dragger } = Upload const { Dragger } = Upload
const Item = styled(Sheet)(({ theme }) => ({ const Item = styled(Sheet)(({ theme }) => ({
@ -49,14 +50,16 @@ const documentTypeList = [
{ {
type: 'file', type: 'file',
title: 'Document', title: 'Document',
subTitle: 'Upload a document, document type can be PDF, CSV, Text, PowerPoint, Word, Markdown' subTitle:
'Upload a document, document type can be PDF, CSV, Text, PowerPoint, Word, Markdown'
} }
] ]
const page_size = 20; const page_size = 20
const Documents = () => { const Documents = () => {
const router = useRouter() const router = useRouter()
const spaceName = useSearchParams().get('name') const spaceName = useSearchParams().get('name')
const { mode } = useColorScheme()
const [isAddDocumentModalShow, setIsAddDocumentModalShow] = const [isAddDocumentModalShow, setIsAddDocumentModalShow] =
useState<boolean>(false) useState<boolean>(false)
const [activeStep, setActiveStep] = useState<number>(0) const [activeStep, setActiveStep] = useState<number>(0)
@ -86,7 +89,7 @@ const Documents = () => {
useEffect(() => { useEffect(() => {
async function fetchDocuments() { async function fetchDocuments() {
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/list`, `${fetchBaseURL}/knowledge/${spaceName}/document/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -124,7 +127,20 @@ const Documents = () => {
</Sheet> </Sheet>
{documents.length ? ( {documents.length ? (
<> <>
<Table color="info" variant="soft" size="lg"> <Table
color="info"
variant="soft"
size="lg"
sx={{
'& tbody tr: hover': {
backgroundColor:
mode === 'light' ? 'rgb(246, 246, 246)' : 'rgb(33, 33, 40)'
},
'& tbody tr: hover a': {
textDecoration: 'underline'
}
}}
>
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>
@ -139,11 +155,20 @@ const Documents = () => {
{documents.map((row: any) => ( {documents.map((row: any) => (
<tr key={row.id}> <tr key={row.id}>
<td>{row.doc_name}</td> <td>{row.doc_name}</td>
<td><Chip variant='soft' color='neutral'>{row.doc_type}</Chip></td> <td>
<Chip
variant="soft"
color="neutral"
sx={{ fontWeight: 300 }}
>
{row.doc_type}
</Chip>
</td>
<td>{row.chunk_size} chunks</td> <td>{row.chunk_size} chunks</td>
<td>{moment(row.last_sync).format('YYYY-MM-DD HH:MM:SS')}</td> <td>{moment(row.last_sync).format('YYYY-MM-DD HH:MM:SS')}</td>
<td> <td>
<Chip <Chip
sx={{ fontWeight: 300 }}
variant="soft" variant="soft"
color={(function () { color={(function () {
switch (row.status) { switch (row.status) {
@ -169,7 +194,7 @@ const Documents = () => {
size="sm" size="sm"
onClick={async () => { onClick={async () => {
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/sync`, `${fetchBaseURL}/knowledge/${spaceName}/document/sync`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -208,9 +233,13 @@ const Documents = () => {
))} ))}
</tbody> </tbody>
</Table> </Table>
<Stack direction="row" justifyContent="flex-end" sx={{ <Stack
marginTop: '20px' direction="row"
}}> justifyContent="flex-end"
sx={{
marginTop: '20px'
}}
>
<Pagination <Pagination
defaultPageSize={20} defaultPageSize={20}
showSizeChanger={false} showSizeChanger={false}
@ -218,7 +247,7 @@ const Documents = () => {
total={total} total={total}
onChange={async (page) => { onChange={async (page) => {
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/list`, `${fetchBaseURL}/knowledge/${spaceName}/document/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -371,7 +400,7 @@ const Documents = () => {
return return
} }
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/add`, `${fetchBaseURL}/knowledge/${spaceName}/document/add`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -389,7 +418,7 @@ const Documents = () => {
message.success('success') message.success('success')
setIsAddDocumentModalShow(false) setIsAddDocumentModalShow(false)
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/list`, `${fetchBaseURL}/knowledge/${spaceName}/document/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -420,7 +449,7 @@ const Documents = () => {
formData.append('doc_file', originFileObj) formData.append('doc_file', originFileObj)
formData.append('doc_type', 'DOCUMENT') formData.append('doc_type', 'DOCUMENT')
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/upload`, `${fetchBaseURL}/knowledge/${spaceName}/document/upload`,
{ {
method: 'POST', method: 'POST',
body: formData body: formData
@ -431,7 +460,7 @@ const Documents = () => {
message.success('success') message.success('success')
setIsAddDocumentModalShow(false) setIsAddDocumentModalShow(false)
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/list`, `${fetchBaseURL}/knowledge/${spaceName}/document/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -458,7 +487,7 @@ const Documents = () => {
return return
} }
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/add`, `${fetchBaseURL}/knowledge/${spaceName}/document/add`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -477,7 +506,7 @@ const Documents = () => {
message.success('success') message.success('success')
setIsAddDocumentModalShow(false) setIsAddDocumentModalShow(false)
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${spaceName}/document/list`, `${fetchBaseURL}/knowledge/${spaceName}/document/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {

96
datacenter/app/datastores/page.tsx
View File

@ -6,6 +6,7 @@ import { InboxOutlined } from '@ant-design/icons'
import type { UploadProps } from 'antd' import type { UploadProps } from 'antd'
import { message, Upload } from 'antd' import { message, Upload } from 'antd'
import { import {
useColorScheme,
Modal, Modal,
Button, Button,
Table, Table,
@ -14,9 +15,10 @@ import {
Box, Box,
Input, Input,
Textarea, Textarea,
Chip,
styled styled
} from '@/lib/mui' } from '@/lib/mui'
import { fetchURL } from '@/app/datastores/constants'; import { fetchBaseURL } from '@/app/datastores/constants'
const { Dragger } = Upload const { Dragger } = Upload
@ -50,12 +52,14 @@ const documentTypeList = [
{ {
type: 'file', type: 'file',
title: 'Document', title: 'Document',
subTitle: 'Upload a document, document type can be PDF, CSV, Text, PowerPoint, Word, Markdown' subTitle:
'Upload a document, document type can be PDF, CSV, Text, PowerPoint, Word, Markdown'
} }
] ]
const Index = () => { const Index = () => {
const router = useRouter() const router = useRouter()
const { mode } = useColorScheme()
const [activeStep, setActiveStep] = useState<number>(0) const [activeStep, setActiveStep] = useState<number>(0)
const [documentType, setDocumentType] = useState<string>('') const [documentType, setDocumentType] = useState<string>('')
const [knowledgeSpaceList, setKnowledgeSpaceList] = useState<any>([]) const [knowledgeSpaceList, setKnowledgeSpaceList] = useState<any>([])
@ -83,16 +87,13 @@ const Index = () => {
} }
useEffect(() => { useEffect(() => {
async function fetchData() { async function fetchData() {
const res = await fetch( const res = await fetch(`${fetchBaseURL}/knowledge/space/list`, {
`${fetchURL}/knowledge/space/list`, method: 'POST',
{ headers: {
method: 'POST', 'Content-Type': 'application/json'
headers: { },
'Content-Type': 'application/json' body: JSON.stringify({})
}, })
body: JSON.stringify({})
}
)
const data = await res.json() const data = await res.json()
if (data.success) { if (data.success) {
setKnowledgeSpaceList(data.data) setKnowledgeSpaceList(data.data)
@ -126,7 +127,20 @@ const Index = () => {
</Sheet> </Sheet>
<div className="page-body p-4"> <div className="page-body p-4">
{knowledgeSpaceList.length ? ( {knowledgeSpaceList.length ? (
<Table color="info" variant="soft" size="lg"> <Table
color="info"
variant="soft"
size="lg"
sx={{
'& tbody tr: hover': {
backgroundColor:
mode === 'light' ? 'rgb(246, 246, 246)' : 'rgb(33, 33, 40)'
},
'& tbody tr: hover a': {
textDecoration: 'underline'
}
}}
>
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>
@ -140,6 +154,7 @@ const Index = () => {
<td> <td>
{ {
<a <a
style={{ fontWeight: 'bold' }}
href="javascript:;" href="javascript:;"
onClick={() => onClick={() =>
router.push(`/datastores/documents?name=${row.name}`) router.push(`/datastores/documents?name=${row.name}`)
@ -149,8 +164,24 @@ const Index = () => {
</a> </a>
} }
</td> </td>
<td>{row.vector_type}</td> <td>
<td>{row.owner}</td> <Chip
variant="soft"
color="neutral"
sx={{ fontWeight: 300 }}
>
{row.vector_type}
</Chip>
</td>
<td>
<Chip
variant="soft"
color="neutral"
sx={{ fontWeight: 300 }}
>
{row.owner}
</Chip>
</td>
</tr> </tr>
))} ))}
</tbody> </tbody>
@ -206,27 +237,24 @@ const Index = () => {
message.error('please input the name') message.error('please input the name')
return return
} }
const res = await fetch( const res = await fetch(`${fetchBaseURL}/knowledge/space/add`, {
`${fetchURL}/knowledge/space/add`, method: 'POST',
{ headers: {
method: 'POST', 'Content-Type': 'application/json'
headers: { },
'Content-Type': 'application/json' body: JSON.stringify({
}, name: knowledgeSpaceName,
body: JSON.stringify({ vector_type: 'Chroma',
name: knowledgeSpaceName, owner: 'keting',
vector_type: 'Chroma', desc: 'test1'
owner: 'keting', })
desc: 'test1' })
})
}
)
const data = await res.json() const data = await res.json()
if (data.success) { if (data.success) {
message.success('success') message.success('success')
setActiveStep(1) setActiveStep(1)
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/space/list`, `${fetchBaseURL}/knowledge/space/list`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -343,7 +371,7 @@ const Index = () => {
return return
} }
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${knowledgeSpaceName}/document/add`, `${fetchBaseURL}/knowledge/${knowledgeSpaceName}/document/add`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {
@ -373,7 +401,7 @@ const Index = () => {
formData.append('doc_file', originFileObj) formData.append('doc_file', originFileObj)
formData.append('doc_type', 'DOCUMENT') formData.append('doc_type', 'DOCUMENT')
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${knowledgeSpaceName}/document/upload`, `${fetchBaseURL}/knowledge/${knowledgeSpaceName}/document/upload`,
{ {
method: 'POST', method: 'POST',
body: formData body: formData
@ -392,7 +420,7 @@ const Index = () => {
return return
} }
const res = await fetch( const res = await fetch(
`${fetchURL}/knowledge/${knowledgeSpaceName}/document/add`, `${fetchBaseURL}/knowledge/${knowledgeSpaceName}/document/add`,
{ {
method: 'POST', method: 'POST',
headers: { headers: {