Skip to content
Projects
Groups
Snippets
Help
Loading...
Sign in
Toggle navigation
B
bkunyun
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
sunyihao
bkunyun
Commits
9cfc7e01
Commit
9cfc7e01
authored
Jun 08, 2022
by
chenshouchao
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 完成项目数据静态页面
parent
e26e9f13
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
485 additions
and
8 deletions
+485
-8
bigFolderIcon.svg
src/assets/project/bigFolderIcon.svg
+16
-0
dataSetIcon.svg
src/assets/project/dataSetIcon.svg
+17
-0
fileIcon.svg
src/assets/project/fileIcon.svg
+27
-0
folderIcon.svg
src/assets/project/folderIcon.svg
+20
-0
noFile.svg
src/assets/project/noFile.svg
+58
-0
demo.ts
src/mocks/demo.ts
+9
-7
index.ts
src/router/index.ts
+2
-1
index.module.css
src/views/Project/ProjectData/index.module.css
+90
-0
index.tsx
src/views/Project/ProjectData/index.tsx
+246
-0
No files found.
src/assets/project/bigFolderIcon.svg
0 → 100644
View file @
9cfc7e01
<?xml version="1.0" encoding="UTF-8"?>
<svg
width=
"22px"
height=
"22px"
viewBox=
"0 0 22 22"
version=
"1.1"
xmlns=
"http://www.w3.org/2000/svg"
xmlns:xlink=
"http://www.w3.org/1999/xlink"
>
<title>
编组 6备份 5
</title>
<g
id=
"上线UI"
stroke=
"none"
stroke-width=
"1"
fill=
"none"
fill-rule=
"evenodd"
>
<g
id=
"项目数据-移动文件"
transform=
"translate(-554.000000, -309.000000)"
>
<g
id=
"编组-6备份-5"
transform=
"translate(554.000000, 309.000000)"
>
<rect
id=
"矩形"
x=
"0"
y=
"0"
width=
"22"
height=
"22"
></rect>
<g
id=
"编组-25"
transform=
"translate(11.000000, 11.000000) scale(-1, 1) rotate(-90.000000) translate(-11.000000, -11.000000) translate(0.163690, 3.797619)"
>
<path
d=
"M2.25848043,5.99517195 L2.25848043,1.1 C2.25848043,0.492486775 2.7509672,1.8140083e-13 3.35848043,1.81289231e-13 L9.5197711,1.81289231e-13 C9.81180738,1.8145763e-13 10.0918574,0.116128852 10.2981967,0.32279113 L11.1489864,1.17491279 C11.3553257,1.38157507 11.6353757,1.49770392 11.927412,1.49770392 L16.6934589,1.49770392 C17.3009722,1.49770392 17.7934589,1.99019069 17.7934589,2.59770392 L17.7934589,5.74540783 L17.7934589,5.74540783 L9.97591007,5.58202826 L2.25848043,5.99517195 Z"
id=
"路径-7"
fill=
"#F09C3C"
></path>
<path
d=
"M1.33057336,4.82874117 L20.3420457,4.82874117 C20.9495589,4.82874117 21.4420457,5.32122794 21.4420457,5.92874117 C21.4420457,5.99815212 21.4354759,6.06740728 21.4224242,6.1355801 L20.0102818,13.5116008 C19.9110449,14.0299435 19.45766,14.4047619 18.9299033,14.4047619 L2.74271574,14.4047619 C2.21495905,14.4047619 1.76157419,14.0299435 1.66233726,13.5116008 L0.250194881,6.1355801 C0.135960895,5.53890354 0.527057873,4.96259668 1.12373443,4.84836269 C1.19190725,4.83531097 1.2611624,4.82874117 1.33057336,4.82874117 Z"
id=
"矩形"
fill=
"#FFC133"
></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/dataSetIcon.svg
0 → 100644
View file @
9cfc7e01
<?xml version="1.0" encoding="UTF-8"?>
<svg
width=
"22px"
height=
"22px"
viewBox=
"0 0 22 22"
version=
"1.1"
xmlns=
"http://www.w3.org/2000/svg"
xmlns:xlink=
"http://www.w3.org/1999/xlink"
>
<title>
编组 4备份 3
</title>
<g
id=
"上线UI"
stroke=
"none"
stroke-width=
"1"
fill=
"none"
fill-rule=
"evenodd"
>
<g
id=
"项目数据-数据集"
transform=
"translate(-300.000000, -730.000000)"
>
<g
id=
"编组-5"
transform=
"translate(244.000000, 250.000000)"
>
<g
id=
"编组-4备份-3"
transform=
"translate(56.000000, 480.000000)"
>
<g
id=
"矩形-2"
>
<rect
id=
"矩形"
x=
"0"
y=
"0"
width=
"22"
height=
"22"
></rect>
</g>
<path
d=
"M18.14,3 L3.86,3 C3.385,3 3,3.3852 3,3.86 L3,6.54 C3,7.015 3.385,7.4 3.86,7.4 L18.14,7.4 C18.615,7.4 19,7.015 19,6.54 L19,3.86 C19,3.3852 18.615,3 18.14,3 Z M17.28,5.68 L9.28,5.68 C9.298916,5.6446 9.30956773,5.6036 9.30956773,5.56 L9.30956773,4.84 C9.30956773,4.7964 9.298916,4.7554 9.28,4.72 L17.28,4.72 L17.28,5.68 Z M18.14,8.8 L3.86,8.8 C3.385,8.8 3,9.1852 3,9.66 L3,12.34 C3,12.815 3.385,13.2 3.86,13.2 L18.14,13.2 C18.615,13.2 19,12.815 19,12.34 L19,9.66 C19,9.1852 18.615,8.8 18.14,8.8 Z M17.28,11.48 L9.28,11.48 C9.298916,11.4446 9.30956773,11.4036 9.30956773,11.36 L9.30956773,10.64 C9.30956773,10.5964 9.298916,10.5554 9.28,10.52 L17.28,10.52 L17.28,11.48 Z M18.14,14.6 L3.86,14.6 C3.385,14.6 3,14.9852 3,15.46 L3,18.14 C3,18.615 3.385,19 3.86,19 L18.14,19 C18.615,19 19,18.615 19,18.14 L19,15.46 C19,14.9852 18.615,14.6 18.14,14.6 Z M17.28,17.28 L9.28,17.28 C9.298916,17.2446 9.30956773,17.2036 9.30956773,17.16 L9.30956773,16.44 C9.30956773,16.3964 9.298916,16.3554 9.28,16.32 L17.28,16.32 L17.28,17.28 Z"
id=
"形状"
fill=
"#D1D6DE"
fill-rule=
"nonzero"
></path>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/fileIcon.svg
0 → 100644
View file @
9cfc7e01
<?xml version="1.0" encoding="UTF-8"?>
<svg
width=
"22px"
height=
"22px"
viewBox=
"0 0 22 22"
version=
"1.1"
xmlns=
"http://www.w3.org/2000/svg"
xmlns:xlink=
"http://www.w3.org/1999/xlink"
>
<title>
编组 7备份 10
</title>
<g
id=
"上线UI"
stroke=
"none"
stroke-width=
"1"
fill=
"none"
fill-rule=
"evenodd"
>
<g
id=
"项目数据-多选状态"
transform=
"translate(-300.000000, -622.000000)"
>
<g
id=
"编组-12"
transform=
"translate(244.000000, 250.000000)"
>
<g
id=
"编组-7"
transform=
"translate(0.000000, 96.000000)"
>
<g
id=
"编组-8"
transform=
"translate(56.000000, 12.000000)"
>
<g
id=
"编组-7备份-10"
transform=
"translate(0.000000, 264.000000)"
>
<rect
id=
"矩形"
x=
"0"
y=
"0"
width=
"22"
height=
"22"
></rect>
<g
id=
"编组-6"
transform=
"translate(3.928571, 2.357143)"
>
<path
d=
"M1.2,0 L9.49020093,0 L9.49020093,0 L14.1428571,4.65265622 L14.1428571,16.0857143 C14.1428571,16.748456 13.6055988,17.2857143 12.9428571,17.2857143 L1.2,17.2857143 C0.5372583,17.2857143 -1.40882155e-16,16.748456 0,16.0857143 L0,1.2 C-8.11624501e-17,0.5372583 0.5372583,1.21743675e-16 1.2,0 Z"
id=
"矩形"
fill=
"#D1D6DE"
></path>
<g
id=
"编组-4"
transform=
"translate(3.535714, 7.142857)"
stroke=
"#FFFFFF"
stroke-width=
"1.2"
>
<line
x1=
"7.85086282e-15"
y1=
"6.39285714"
x2=
"7.07142857"
y2=
"6.39285714"
id=
"路径-15备份-2"
></line>
<line
x1=
"7.85086282e-15"
y1=
"3.39285714"
x2=
"7.07142857"
y2=
"3.39285714"
id=
"路径-15备份-3"
></line>
<line
x1=
"7.85086282e-15"
y1=
"0.392857143"
x2=
"7.07142857"
y2=
"0.392857143"
id=
"路径-15备份-4"
></line>
</g>
<path
d=
"M9.49020093,0 L14.1428571,4.65265622 L10.6902009,4.65265622 C10.0274592,4.65265622 9.49020093,4.11539792 9.49020093,3.45265622 L9.49020093,0 L9.49020093,0 Z"
id=
"路径-9"
fill=
"#EBEDF0"
></path>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/folderIcon.svg
0 → 100644
View file @
9cfc7e01
<?xml version="1.0" encoding="UTF-8"?>
<svg
width=
"22px"
height=
"22px"
viewBox=
"0 0 22 22"
version=
"1.1"
xmlns=
"http://www.w3.org/2000/svg"
xmlns:xlink=
"http://www.w3.org/1999/xlink"
>
<title>
编组 6备份 4
</title>
<g
id=
"上线UI"
stroke=
"none"
stroke-width=
"1"
fill=
"none"
fill-rule=
"evenodd"
>
<g
id=
"项目数据—传输列表(切换线路)"
transform=
"translate(-300.000000, -460.000000)"
>
<g
id=
"编组-27"
transform=
"translate(244.000000, 250.000000)"
>
<g
id=
"编组-7"
transform=
"translate(0.000000, 96.000000)"
>
<g
id=
"编组-8"
transform=
"translate(56.000000, 12.000000)"
>
<g
id=
"编组-25"
transform=
"translate(0.000000, 102.000000)"
>
<rect
id=
"矩形"
x=
"0"
y=
"0"
width=
"22"
height=
"22"
></rect>
<path
d=
"M1.64236826,7.68304472 L1.64236826,4.34285714 C1.64236826,3.68011544 2.17962656,3.14285714 2.84236826,3.14285714 L9.56377626,3.14285714 C9.88236129,3.14285714 10.1878704,3.26954316 10.4129678,3.49499292 L11.3411021,4.42458018 C11.5661995,4.65002994 11.8717086,4.77671596 12.1902936,4.77671596 L17.3896175,4.77671596 C18.0523592,4.77671596 18.5896175,5.31397426 18.5896175,5.97671596 L18.5896175,6.41057478 L18.5896175,6.41057478 L10.0613824,9.23234252 L1.64236826,7.68304472 Z"
id=
"路径-7"
fill=
"#F09C3C"
></path>
<rect
id=
"矩形"
fill=
"#FFC133"
x=
"1.17857143"
y=
"6.41057478"
width=
"19.6428571"
height=
"12.4465681"
rx=
"1.2"
></rect>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/noFile.svg
0 → 100644
View file @
9cfc7e01
<?xml version="1.0" encoding="UTF-8"?>
<svg
width=
"67px"
height=
"57px"
viewBox=
"0 0 67 57"
version=
"1.1"
xmlns=
"http://www.w3.org/2000/svg"
xmlns:xlink=
"http://www.w3.org/1999/xlink"
>
<title>
img_no data
</title>
<defs>
<polygon
id=
"path-1"
points=
"0 0 65.7607024 0 65.7607024 46.987 0 46.987"
></polygon>
<linearGradient
x1=
"50%"
y1=
"20.7300519%"
x2=
"50%"
y2=
"102.568465%"
id=
"linearGradient-3"
>
<stop
stop-color=
"#E3F0FF"
offset=
"0%"
></stop>
<stop
stop-color=
"#8CBAFF"
offset=
"100%"
></stop>
</linearGradient>
<linearGradient
x1=
"50%"
y1=
"0%"
x2=
"50%"
y2=
"100%"
id=
"linearGradient-4"
>
<stop
stop-color=
"#CEE2F9"
offset=
"0%"
></stop>
<stop
stop-color=
"#9FC0F0"
offset=
"100%"
></stop>
</linearGradient>
<linearGradient
x1=
"50%"
y1=
"0%"
x2=
"50%"
y2=
"100%"
id=
"linearGradient-5"
>
<stop
stop-color=
"#DBEAFC"
offset=
"0%"
></stop>
<stop
stop-color=
"#8AAFE6"
offset=
"100%"
></stop>
</linearGradient>
<linearGradient
x1=
"50%"
y1=
"0%"
x2=
"50%"
y2=
"100%"
id=
"linearGradient-6"
>
<stop
stop-color=
"#DBEAFC"
offset=
"0%"
></stop>
<stop
stop-color=
"#8AAFE6"
offset=
"100%"
></stop>
</linearGradient>
<linearGradient
x1=
"50%"
y1=
"0%"
x2=
"50%"
y2=
"100%"
id=
"linearGradient-7"
>
<stop
stop-color=
"#F2F7FF"
offset=
"0%"
></stop>
<stop
stop-color=
"#E1EDFF"
offset=
"100%"
></stop>
</linearGradient>
<path
d=
"M17.9695,0 C18.1602024,0 18.3370714,0.101 18.435881,0.267 L18.435881,0.267 L22.5265952,7.169 C22.6254048,7.335 22.8022738,7.436 22.9929762,7.436 L22.9929762,7.436 L42.7677262,7.436 C42.9584286,7.436 43.1352976,7.335 43.233119,7.169 L43.233119,7.169 L47.3258095,0.267 C47.423631,0.101 47.6005,0 47.7912024,0 L47.7912024,0 L65.21725,0 C65.517631,0 65.7607024,0.246 65.7607024,0.55 L65.7607024,0.55 L65.7607024,18.864 C65.7607024,19.534 65.2231786,20.078 64.5611548,20.078 L64.5611548,20.078 L1.19855952,20.078 C0.536535714,20.078 0,19.534 0,18.864 L0,18.864 L0,0.55 C0,0.246 0.243071429,0 0.542464286,0 L0.542464286,0 Z M41.7340798,12.3811 L24.0274131,12.3811 C23.5254607,12.3811 23.1193536,12.7931 23.1193536,13.3001 C23.1193536,13.8081 23.5254607,14.2191 24.0274131,14.2191 L24.0274131,14.2191 L41.7340798,14.2191 C42.235044,14.2191 42.6421393,13.8081 42.6421393,13.3001 C42.6421393,12.7931 42.235044,12.3811 41.7340798,12.3811 L41.7340798,12.3811 Z"
id=
"path-8"
></path>
</defs>
<g
id=
"上线UI"
stroke=
"none"
stroke-width=
"1"
fill=
"none"
fill-rule=
"evenodd"
>
<g
id=
"项目数据-无数据状态"
transform=
"translate(-797.000000, -593.000000)"
>
<g
id=
"编组-6"
transform=
"translate(788.000000, 587.000000)"
>
<g
id=
"编组"
transform=
"translate(1.000000, 0.000000)"
>
<g
id=
"img_no-data"
transform=
"translate(8.645833, 6.999500)"
>
<g
id=
"编组"
transform=
"translate(0.000000, 8.970200)"
>
<mask
id=
"mask-2"
fill=
"white"
>
<use
xlink:href=
"#path-1"
></use>
</mask>
<g
id=
"Clip-2"
></g>
<path
d=
"M49.3205762,0 L32.8806476,0 L16.440719,0 L0.257695238,26.488 C0.0897190476,26.764 -0.000197619048,27.081 -0.000197619048,27.405 L-0.000197619048,45.323 C-0.000197619048,45.689 1.28235,46.987 1.64498095,46.987 L32.8806476,46.987 L64.1173024,46.987 C64.4789452,46.987 65.7614929,45.689 65.7614929,45.323 L65.7614929,27.405 C65.7614929,27.081 65.6725643,26.764 65.5036,26.488 L49.3205762,0 Z"
id=
"Fill-1"
fill=
"url(#linearGradient-3)"
mask=
"url(#mask-2)"
></path>
</g>
<polygon
id=
"Fill-3"
fill=
"url(#linearGradient-4)"
points=
"32.880944 8.5034 16.4400274 8.5034 16.4400274 18.3434 32.880944 18.3434 49.3208726 18.3434 49.3208726 8.5034"
></polygon>
<path
d=
"M1.25705476,53.0815 L16.4401262,18.3435 L16.4401262,8.5035 L0.250185714,35.4635 C0.0861619048,35.7355 0.000197619048,36.0495 0.000197619048,36.3675 L0.000197619048,52.8125 C0.000197619048,53.5315 0.969519048,53.7385 1.25705476,53.0815"
id=
"Fill-5"
fill=
"url(#linearGradient-5)"
></path>
<path
d=
"M64.5048333,53.0815 L49.3207738,18.3435 L49.3207738,8.5035 L65.5117024,35.4635 C65.6747381,35.7355 65.7607024,36.0495 65.7607024,36.3675 L65.7607024,52.8125 C65.7607024,53.5315 64.791381,53.7385 64.5048333,53.0815"
id=
"Fill-7"
fill=
"url(#linearGradient-6)"
></path>
<g
id=
"编组"
transform=
"translate(0.000198, 35.880000)"
>
<mask
id=
"mask-9"
fill=
"white"
>
<use
xlink:href=
"#path-8"
></use>
</mask>
<use
id=
"形状结合"
fill=
"url(#linearGradient-7)"
xlink:href=
"#path-8"
></use>
</g>
<line
x1=
"13.3284167"
y1=
"4.812"
x2=
"10.3582024"
y2=
"0"
id=
"Stroke-13"
stroke=
"#C2DAFE"
stroke-width=
"2"
stroke-linecap=
"round"
stroke-linejoin=
"round"
></line>
<line
x1=
"16.1112881"
y1=
"4.5181"
x2=
"17.7248476"
y2=
"0.0531"
id=
"Stroke-15"
stroke=
"#C2DAFE"
stroke-width=
"2"
stroke-linecap=
"round"
stroke-linejoin=
"round"
></line>
<line
x1=
"11.8462738"
y1=
"7.2143"
x2=
"7.17357143"
y2=
"6.7233"
id=
"Stroke-17"
stroke=
"#C2DAFE"
stroke-width=
"2"
stroke-linecap=
"round"
stroke-linejoin=
"round"
></line>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/mocks/demo.ts
View file @
9cfc7e01
...
@@ -38,13 +38,15 @@ const demo = [
...
@@ -38,13 +38,15 @@ const demo = [
icon
:
""
,
icon
:
""
,
element
:
"ProjectSetting"
,
element
:
"ProjectSetting"
,
show
:
"true"
,
show
:
"true"
,
// children: [
},
// {
{
// id: "PROJECT_OVERIVEW_CREATE",
id
:
"PROJECT_DATA"
,
// type: "operation",
type
:
"page"
,
// name: "创建项目",
name
:
"项目管理"
,
// },
path
:
"/data"
,
// ],
icon
:
""
,
element
:
"ProjectData"
,
show
:
"true"
,
},
},
{
{
id
:
"PROJECT_OVERIVEW"
,
id
:
"PROJECT_OVERIVEW"
,
...
...
src/router/index.ts
View file @
9cfc7e01
...
@@ -14,7 +14,7 @@ import * as React from "react";
...
@@ -14,7 +14,7 @@ import * as React from "react";
import
NotFound
from
"@/views/404"
;
import
NotFound
from
"@/views/404"
;
import
Demo
from
"@/views/demo"
;
import
Demo
from
"@/views/demo"
;
import
ProjectSetting
from
"@/views/Project/ProjectSetting"
;
import
ProjectSetting
from
"@/views/Project/ProjectSetting"
;
import
ProjectData
from
"@/views/Project/ProjectData"
;
export
type
route
=
{
export
type
route
=
{
id
?:
string
;
id
?:
string
;
type
:
"page"
;
type
:
"page"
;
...
@@ -47,6 +47,7 @@ export const elements: {
...
@@ -47,6 +47,7 @@ export const elements: {
}
=
{
}
=
{
Demo
:
Demo
,
Demo
:
Demo
,
ProjectSetting
:
ProjectSetting
,
ProjectSetting
:
ProjectSetting
,
ProjectData
:
ProjectData
,
};
};
export
const
routes
:
Array
<
route
|
navigate
>
=
[
export
const
routes
:
Array
<
route
|
navigate
>
=
[
...
...
src/views/Project/ProjectData/index.module.css
0 → 100644
View file @
9cfc7e01
.projectData
{
position
:
relative
;
}
.projectDataStickyTop
{
padding
:
28px
24px
;
}
.projectDataTitle
{
font-size
:
18px
;
color
:
#1e2633
;
line-height
:
26px
;
font-weight
:
600
;
margin-bottom
:
24px
;
}
.projectDataButtonAndSearch
{
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
margin-bottom
:
16px
;
}
.projectDataSearch
{
padding-left
:
12px
;
padding-right
:
8px
;
border-radius
:
4px
;
border
:
1px
solid
#ebedf0
;
}
.projectDataPathAndTabs
{
display
:
flex
;
justify-content
:
space-between
;
align-items
:
center
;
margin-bottom
:
16px
;
}
.projectDataPath
{
font-size
:
14px
;
color
:
#1e2633
;
line-height
:
22px
;
font-weight
:
600
;
}
.projectDataTabsAndBtton
{
display
:
flex
;
justify-content
:
flex-end
;
align-items
:
center
;
}
.projectDataTabs
{
display
:
flex
;
justify-content
:
space-between
;
border
:
1px
solid
#e6e8eb
;
border-radius
:
4px
;
background-color
:
#e6e8eb
;
cursor
:
pointer
;
margin-right
:
12px
;
}
.projectDataTab
{
height
:
32px
;
box-sizing
:
border-box
;
font-size
:
14px
;
color
:
#565c66
;
border-radius
:
4px
;
line-height
:
20px
;
padding
:
3px
18px
;
background-color
:
#e6e8eb
;
display
:
flex
;
align-items
:
center
;
}
.projectDataTabActive
{
color
:
#1370ff
;
background-color
:
#fff
;
border
:
1px
solid
#e6e8eb
;
}
.folderIconBox
{
display
:
flex
;
justify-content
:
flex-start
;
align-items
:
center
;
}
.folderIcon
{
margin-right
:
12px
;
}
.projectDataStickyBox
{
height
:
64px
;
position
:
sticky
;
bottom
:
0
;
border-top
:
1px
solid
#ebedf0
;
z-index
:
100
;
background-color
:
#fff
;
display
:
flex
;
justify-content
:
flex-end
;
align-items
:
center
;
}
src/views/Project/ProjectData/index.tsx
0 → 100644
View file @
9cfc7e01
import
React
,
{
useState
}
from
"react"
;
import
style
from
"./index.module.css"
;
import
classnames
from
"classnames"
;
import
{
Button
,
InputBase
,
IconButton
}
from
"@mui/material"
;
import
{
createTheme
,
ThemeProvider
}
from
"@mui/material/styles"
;
import
SearchIcon
from
"@mui/icons-material/Search"
;
import
RefreshIcon
from
"@mui/icons-material/Refresh"
;
import
Table
from
"@/components/Material.Ui/Table"
;
import
bigFolderIcon
from
"@/assets/project/bigFolderIcon.svg"
;
import
dataSetIcon
from
"@/assets/project/dataSetIcon.svg"
;
import
fileIcon
from
"@/assets/project/fileIcon.svg"
;
import
folderIcon
from
"@/assets/project/folderIcon.svg"
;
import
noFile
from
"@/assets/project/noFile.svg"
;
const
theme
=
createTheme
({
palette
:
{
neutral
:
{
main
:
"#1370FF"
,
contrastText
:
"#fff"
,
},
},
});
declare
module
"@mui/material/styles"
{
interface
Palette
{
neutral
:
Palette
[
"primary"
];
}
// allow configuration using `createTheme`
interface
PaletteOptions
{
neutral
?:
PaletteOptions
[
"primary"
];
}
}
// Update the Button's color prop options
declare
module
"@mui/material/Button"
{
interface
ButtonPropsColorOverrides
{
neutral
:
true
;
}
}
const
ProjectData
=
()
=>
{
const
[
path
,
setPath
]
=
useState
(
"ProjectData"
);
const
[
activeTab
,
setActiveTab
]
=
useState
(
1
);
const
[
keyWord
,
setKeyWord
]
=
useState
(
""
);
const
handleKeyWordChange
=
(
e
:
any
)
=>
{
setKeyWord
(
e
.
target
.
value
);
};
const
[
selectIds
,
setSelectIds
]
=
useState
([]);
const
list
=
[
{
id
:
123
,
name
:
"name"
,
type
:
"directory"
,
mtime
:
new
Date
().
getTime
(),
},
{
id
:
9999
,
name
:
"name2"
,
type
:
"file"
,
size
:
6
,
mtime
:
new
Date
().
getTime
(),
},
];
const
versionsHeadCells
=
[
{
id
:
"checkbox"
},
{
id
:
"name"
,
numeric
:
false
,
label
:
"名称"
,
width
:
"25%"
},
{
id
:
"size"
,
numeric
:
false
,
label
:
"大小"
,
width
:
"25%"
},
{
id
:
"mtime"
,
numeric
:
false
,
label
:
"创建时间"
,
width
:
"25%"
},
{
id
:
"caozuo"
,
numeric
:
false
,
label
:
"操作"
,
width
:
"25%"
},
];
const
hanldeCheckbox
=
(
e
:
any
)
=>
{
console
.
log
(
e
);
setSelectIds
(
e
);
};
const
renderName
=
(
item
:
any
)
=>
{
if
(
item
.
type
===
"directory"
)
{
return
(
<
span
className=
{
style
.
folderIconBox
}
>
<
img
className=
{
style
.
folderIcon
}
src=
{
folderIcon
}
alt=
""
/>
{
item
.
name
}
</
span
>
);
}
else
{
return
(
<
span
className=
{
style
.
folderIconBox
}
>
<
img
className=
{
style
.
folderIcon
}
src=
{
fileIcon
}
alt=
""
/>
{
item
.
name
}
</
span
>
);
}
};
const
renderSize
=
(
item
:
any
)
=>
{
return
<
span
>
{
item
.
size
?
`${item.size}b`
:
"-"
}
</
span
>;
};
const
renderMtime
=
(
item
:
any
)
=>
{
return
<
span
>
{
item
.
mtime
}
</
span
>;
};
const
renderButtons
=
(
item
:
any
)
=>
{
return
(
<
span
>
<
Button
variant=
"text"
size=
"small"
>
下载
</
Button
>
<
Button
variant=
"text"
size=
"small"
>
移动至
</
Button
>
<
Button
variant=
"text"
size=
"small"
color=
"error"
>
删除
</
Button
>
</
span
>
);
};
return
(
<
ThemeProvider
theme=
{
theme
}
>
<
div
className=
{
style
.
projectData
}
>
<
div
className=
{
style
.
projectDataStickyTop
}
>
<
div
className=
{
style
.
projectDataTitle
}
>
项目数据
</
div
>
<
div
className=
{
style
.
projectDataHeader
}
>
<
div
className=
{
style
.
projectDataButtonAndSearch
}
>
<
div
className=
{
style
.
projectDataButtonBox
}
>
<
Button
color=
"neutral"
variant=
"contained"
size=
"small"
style=
{
{
marginRight
:
"12px"
}
}
>
上传文件
</
Button
>
<
Button
color=
"neutral"
variant=
"outlined"
size=
"small"
>
新建文件夹
</
Button
>
</
div
>
<
div
className=
{
style
.
projectDataSearch
}
>
<
InputBase
className=
{
style
.
searchInput
}
placeholder=
"输入关键词搜索"
inputProps=
{
{
"aria-label"
:
"输入关键词搜索"
}
}
value=
{
keyWord
}
onChange=
{
handleKeyWordChange
}
style=
{
{
width
:
"280px"
,
fontSize
:
"14px"
}
}
/>
<
IconButton
type=
"submit"
className=
{
style
.
searchButton
}
aria
-
label=
"search"
size=
"small"
style=
{
{
padding
:
"4px"
}
}
>
<
SearchIcon
className=
{
style
.
searchIcon
}
style=
{
{
color
:
"#999"
}
}
/>
</
IconButton
>
</
div
>
</
div
>
<
div
className=
{
style
.
projectDataPathAndTabs
}
>
<
div
className=
{
style
.
projectDataPath
}
>
{
path
}
</
div
>
<
div
className=
{
style
.
projectDataTabsAndBtton
}
>
<
div
className=
{
style
.
projectDataTabs
}
>
<
div
className=
{
classnames
({
[
style
.
projectDataTab
]:
true
,
[
style
.
projectDataTabActive
]:
activeTab
===
1
,
})
}
onClick=
{
()
=>
setActiveTab
(
1
)
}
>
文件
</
div
>
<
div
className=
{
classnames
({
[
style
.
projectDataTab
]:
true
,
[
style
.
projectDataTabActive
]:
activeTab
!==
1
,
})
}
onClick=
{
()
=>
setActiveTab
(
2
)
}
>
数据集
</
div
>
</
div
>
<
IconButton
aria
-
label=
"refreshIcon"
size=
"small"
>
<
RefreshIcon
/>
</
IconButton
>
</
div
>
{
/* RefreshIcon */
}
</
div
>
</
div
>
<
Table
checkboxData=
{
(
e
:
any
)
=>
{
hanldeCheckbox
(
e
);
}
}
rowHover=
{
true
}
stickyheader=
{
true
}
rows=
{
list
.
map
((
item
)
=>
({
...
item
,
name
:
renderName
(
item
),
size
:
renderSize
(
item
),
mtime
:
renderMtime
(
item
),
caozuo
:
renderButtons
(
item
),
}))
}
// load={loadding}
rowsPerPage=
{
"99"
}
headCells=
{
versionsHeadCells
}
nopadding=
{
true
}
footer=
{
false
}
// elevation1={classes.elevation1}
tableStyle=
{
{
minWidth
:
"auto"
}
}
borderBottom=
{
"none"
}
renderExpandPanel=
{
(
e
:
any
)
=>
<
div
>
111111
</
div
>
}
// headTableCellCheckbox={classes.HeadTableCell}
></
Table
>
</
div
>
{
selectIds
.
length
>
0
&&
(
<
div
className=
{
style
.
projectDataStickyBox
}
>
<
Button
color=
"error"
variant=
"outlined"
size=
"small"
style=
{
{
marginRight
:
"12px"
}
}
>
批量删除(
{
selectIds
.
length
}
)
</
Button
>
<
Button
color=
"neutral"
variant=
"contained"
size=
"small"
style=
{
{
marginRight
:
"24px"
}
}
>
批量移动(
{
selectIds
.
length
}
)
</
Button
>
</
div
>
)
}
</
div
>
</
ThemeProvider
>
);
};
export
default
ProjectData
;
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment