From 828e81d222ac15ceaead85c8f4912342b365963f Mon Sep 17 00:00:00 2001 From: WenC <450292408@qq.com> Date: Fri, 15 Mar 2024 18:18:29 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/head-right-bg.png | Bin 0 -> 3813 bytes src/components/arrow/Arrow.tsx | 23 ++++++ src/components/arrow/arrow.css | 30 +++++++ src/components/balance/balance-head.css | 3 +- src/components/card/CardProjDownload.tsx | 17 ++++ src/components/card/CardProjEdit.tsx | 8 +- src/components/card/CardProjJump.tsx | 17 ++++ src/components/card/CardProjLoading.tsx | 15 ++++ src/components/card/CardProjResult.tsx | 23 ++++++ src/components/card/card-proj-download.css | 25 ++++++ src/components/card/card-proj-edit.css | 7 +- src/components/card/card-proj-jump.css | 20 +++++ src/components/card/card-proj-loading.css | 25 ++++++ src/components/card/card-proj-result.css | 60 ++++++++++++++ src/components/step/StepProjEdit.tsx | 57 ++++++++++++- src/components/step/step-proj-edit.css | 92 ++++++++++++++++++--- src/index.css | 15 ++-- src/interfaces/arrow/IArrow.ts | 4 + src/interfaces/card/ICardProj.ts | 32 +++++++ src/interfaces/step/IStepProj.ts | 11 ++- src/layout/head/Head.tsx | 10 ++- src/layout/head/head.css | 17 ++-- src/route/proj/ProjEdit.tsx | 77 ++++++++++++++--- src/route/proj/proj-create.css | 1 + src/route/proj/proj-edit.css | 9 ++ src/route/proj/proj-new.css | 2 +- 26 files changed, 544 insertions(+), 56 deletions(-) create mode 100644 src/assets/head-right-bg.png create mode 100644 src/components/arrow/Arrow.tsx create mode 100644 src/components/arrow/arrow.css create mode 100644 src/components/card/CardProjDownload.tsx create mode 100644 src/components/card/CardProjJump.tsx create mode 100644 src/components/card/CardProjLoading.tsx create mode 100644 src/components/card/CardProjResult.tsx create mode 100644 src/components/card/card-proj-download.css create mode 100644 src/components/card/card-proj-jump.css create mode 100644 src/components/card/card-proj-loading.css create mode 100644 src/components/card/card-proj-result.css create mode 100644 src/interfaces/arrow/IArrow.ts create mode 100644 src/interfaces/card/ICardProj.ts diff --git a/src/assets/head-right-bg.png b/src/assets/head-right-bg.png new file mode 100644 index 0000000000000000000000000000000000000000..e8846342f9822d8d281c601c7188b6a92917bbee GIT binary patch literal 3813 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 WC--Ey { + const blockArray: ReactNode[] = []; + const size:number = parseInt(((props.width - 20) / 20).toFixed(0)); + for(let i = 0; i < size; i++) { + blockArray.push(
) + } + return blockArray; + } + + return ( +
+
{renderLineBlock()}
+
+
+ ) +} \ No newline at end of file diff --git a/src/components/arrow/arrow.css b/src/components/arrow/arrow.css new file mode 100644 index 0000000..1f275ab --- /dev/null +++ b/src/components/arrow/arrow.css @@ -0,0 +1,30 @@ +.arrow { + position: absolute; + top: 0; + left: 0; +} +.arrow .arrow-line { + position: absolute; + top: 10px; + height: 10px; + display: flex; +} +.arrow .arrow-line .arrow-line-block { + width: 15px; + height: 10px; + margin-right: 5px; +} +.arrow .arrow-head { + position: absolute; + top: 0; + right: 0; + width: 20px; + box-sizing: border-box; + border-style: solid; + border-top-width: 15px; + border-top-color: transparent; + border-left-width: 20px; + border-right-width: 0; + border-bottom-width: 15px; + border-bottom-color: transparent; +} \ No newline at end of file diff --git a/src/components/balance/balance-head.css b/src/components/balance/balance-head.css index 0a636eb..49eedae 100644 --- a/src/components/balance/balance-head.css +++ b/src/components/balance/balance-head.css @@ -6,6 +6,5 @@ } .balance-head .balance { - font-weight: bold; - font-size: 40px; + font-size: 20px; } \ No newline at end of file diff --git a/src/components/card/CardProjDownload.tsx b/src/components/card/CardProjDownload.tsx new file mode 100644 index 0000000..c38f6a7 --- /dev/null +++ b/src/components/card/CardProjDownload.tsx @@ -0,0 +1,17 @@ +import './card-proj-download.css'; +import {IProjDownload} from "../../interfaces/card/ICardProj.ts"; + +export default function CardProjDownload(props: IProjDownload) { + return ( +
+
{props.title}
+
请完善软件的介绍，详细介绍等基本信息
+ +
+ ) +} \ No newline at end of file diff --git a/src/components/card/CardProjEdit.tsx b/src/components/card/CardProjEdit.tsx index 48cc5fe..1f28fa5 100644 --- a/src/components/card/CardProjEdit.tsx +++ b/src/components/card/CardProjEdit.tsx @@ -1,13 +1,15 @@ import './card-proj-edit.css'; +import {IProjEdit} from "../../interfaces/card/ICardProj.ts"; -export default function CardProjEdit() { +export default function CardProjEdit(props: IProjEdit) { return (
-
软件基本信息
-
请完善软件的介绍，详细介绍等基本信息
+
{props.title}
+
{props.desc}
diff --git a/src/components/card/CardProjJump.tsx b/src/components/card/CardProjJump.tsx new file mode 100644 index 0000000..4a1b73e --- /dev/null +++ b/src/components/card/CardProjJump.tsx @@ -0,0 +1,17 @@ +import './card-proj-jump.css'; +import {ExportOutlined} from '@ant-design/icons'; +import {IProjJump} from "../../interfaces/card/ICardProj.ts"; + +export default function CardProjJump(props: IProjJump) { + return ( +
{ + props.handleJump(); + }}> +
+ {props.title} + +
+
{props.desc}
+
+ ) +} \ No newline at end of file diff --git a/src/components/card/CardProjLoading.tsx b/src/components/card/CardProjLoading.tsx new file mode 100644 index 0000000..9b03f92 --- /dev/null +++ b/src/components/card/CardProjLoading.tsx @@ -0,0 +1,15 @@ +import './card-proj-loading.css'; +import {Loading3QuartersOutlined} from '@ant-design/icons'; +import {IProjLoading} from "../../interfaces/card/ICardProj.ts"; + +export default function CardProjLoading(props:IProjLoading) { + return ( +
+
+ + {props.title} +
+
资料正在排队，预计等待600s
+
+ ) +} \ No newline at end of file diff --git a/src/components/card/CardProjResult.tsx b/src/components/card/CardProjResult.tsx new file mode 100644 index 0000000..4ba0a6d --- /dev/null +++ b/src/components/card/CardProjResult.tsx @@ -0,0 +1,23 @@ +import './card-proj-result.css'; +import {IProjResult} from "../../interfaces/card/ICardProj.ts"; + +export default function CardProjResult(props: IProjResult) { + return ( +
+
+ {props.title} + {props.isSuccess ? : } +
+ { + props.handleFeedback ? ( + + ) : <> + } +
+ ) +} \ No newline at end of file diff --git a/src/components/card/card-proj-download.css b/src/components/card/card-proj-download.css new file mode 100644 index 0000000..dfd6928 --- /dev/null +++ b/src/components/card/card-proj-download.css @@ -0,0 +1,25 @@ +.card-proj-download { + width: 224px; + padding: 10px 15px; +} + +.card-proj-download .title { + font-size: 18px; + font-weight: bold; +} + +.card-proj-download .desc { + margin: 5px 0 10px 0; + max-height: 36px; + line-height: 18px; + color: var(--color-note); +} + +.card-proj-download .option { + display: flex; + justify-content: space-between; +} + +.card-proj-download .option .edit { + color: var(--color-blue); +} \ No newline at end of file diff --git a/src/components/card/card-proj-edit.css b/src/components/card/card-proj-edit.css index 8536c4c..0cdf1e7 100644 --- a/src/components/card/card-proj-edit.css +++ b/src/components/card/card-proj-edit.css @@ -1,8 +1,6 @@ .card-proj-edit { width: 224px; - padding: 10px; - border-radius: 6px; - border: 1px solid var(--color-border); + padding: 10px 15px; } .card-proj-edit .title { @@ -12,8 +10,9 @@ .card-proj-edit .desc { margin: 5px 0 10px 0; - height: 36px; + max-height: 36px; line-height: 18px; + color: var(--color-note); } .card-proj-edit .option { diff --git a/src/components/card/card-proj-jump.css b/src/components/card/card-proj-jump.css new file mode 100644 index 0000000..a3bea68 --- /dev/null +++ b/src/components/card/card-proj-jump.css @@ -0,0 +1,20 @@ +.card-proj-jump { + width: 224px; + padding: 10px 15px; + cursor: pointer; +} + +.card-proj-jump .title { + font-size: 18px; + font-weight: bold; + display: flex; + justify-content: space-between; + align-items: center; +} + +.card-proj-jump .desc { + margin: 5px 0 10px 0; + max-height: 36px; + line-height: 18px; + color: var(--color-note); +} \ No newline at end of file diff --git a/src/components/card/card-proj-loading.css b/src/components/card/card-proj-loading.css new file mode 100644 index 0000000..e5096b7 --- /dev/null +++ b/src/components/card/card-proj-loading.css @@ -0,0 +1,25 @@ +.card-proj-loading { + width: 224px; + padding: 10px 15px; +} + +.card-proj-loading .title { + font-size: 18px; + font-weight: bold; +} + +.card-proj-loading .title .label { + margin-left: 10px; +} + +.card-proj-loading .desc { + margin-top: 5px; + max-height: 36px; + line-height: 18px; + color: var(--color-note); +} + +.card-proj-loading .option { + display: flex; + justify-content: space-between; +} \ No newline at end of file diff --git a/src/components/card/card-proj-result.css b/src/components/card/card-proj-result.css new file mode 100644 index 0000000..c0d4c23 --- /dev/null +++ b/src/components/card/card-proj-result.css @@ -0,0 +1,60 @@ +.card-proj-result { + width: 224px; + padding: 10px 15px; +} + +.card-proj-result .title { + font-size: 18px; + font-weight: bold; + display: flex; + justify-content: space-between; + align-items: center; +} + +.card-proj-result .title .success { + width: 13px; + height: 6px; + border-style: solid; + border-color: var(--color-green); + border-width: 4px; + transform: rotate(-45deg); + border-top: transparent; + border-right: transparent; +} + +.card-proj-result .title .failed { + width: 20px; + height: 20px; + position: relative; +} + +.card-proj-result .title .failed:before { + content: ''; + display: block; + width: 20px; + height: 4px; + background-color: var(--color-red); + transform: rotate(45deg); + position: absolute; + top: 9px; +} + +.card-proj-result .title .failed:after { + content: ''; + display: block; + width: 20px; + height: 4px; + background-color: var(--color-red); + transform: rotate(-45deg); + position: absolute; + top: 9px; +} + +.card-proj-result .option { + display: flex; + justify-content: space-between; +} + +.card-proj-result .option .edit { + color: var(--color-blue); +} diff --git a/src/components/step/StepProjEdit.tsx b/src/components/step/StepProjEdit.tsx index 4dc0703..478eb1e 100644 --- a/src/components/step/StepProjEdit.tsx +++ b/src/components/step/StepProjEdit.tsx @@ -1,14 +1,63 @@ import './step-proj-edit.css'; -import {IStepProj} from "../../interfaces/step/IStepProj.ts"; +import {IStepProj, Process} from "../../interfaces/step/IStepProj.ts"; +import {CheckOutlined} from "@ant-design/icons"; export default function StepProjEdit(props: IStepProj) { + + const height = window.innerHeight - 390; + + const renderStepNo = () => { + if (props.process == Process.COMPLETE) { + return ( +
+ +
+ ) + } else if (props.process == Process.PROCESSING) { + return
{props.step}
+ } + return ( +
+ {props.step} +
+ ) + } + + const renderStepDesc = () => { + if (props.process != Process.PENDING) { + return ( +
+
{props.descTitle}
+
{props.descDetail}
+
+ ) + } + return ( +
+
{props.descTitle}
+
{props.descDetail}
+
+ ) + } + + const renderStepLine = () => { + if (!props.hasNext) { + return <> + } + if (props.process == Process.COMPLETE) { + return
+ } + return
+ } + return (
-
{props.step}
-
{props.desc}
+ {renderStepNo()} + {renderStepDesc()} + {renderStepLine()}
-
+
{props.children}
diff --git a/src/components/step/step-proj-edit.css b/src/components/step/step-proj-edit.css index 60e4fa4..046f3e6 100644 --- a/src/components/step/step-proj-edit.css +++ b/src/components/step/step-proj-edit.css @@ -1,32 +1,90 @@ .step-proj { width: 300px; + position: relative; } .step-proj .step { + margin-top: 30px; display: flex; - flex-direction: column; + flex-direction: row; justify-content: center; - align-items: center; + align-items: start; + position: relative; } .step-proj .step .no { - background-color: var(--color-blue); - color: var(--color-light); - width: 66px; - height: 66px; + width: 38px; + height: 38px; border-radius: 50%; - font-size: 33px; + font-size: 16px; display: flex; align-items: center; justify-content: center; } +.step-proj .step .complete { + border: 1px solid var(--color-blue); + color: var(--color-blue); +} + +.step-proj .step .processing { + border: 1px solid var(--color-blue); + background-color: var(--color-blue); + color: var(--color-light); +} + +.step-proj .step .pending { + border: 1px solid var(--color-disabled); + color: var(--color-disabled); +} + .step-proj .step .desc { - margin-top: 5px; + margin-left: 15px; + width: 150px; + border: none; +} + +.step-proj .step .desc .title { + margin-top: 8px; + font-weight: bold; +} + +.step-proj .step .pending .title { + color: var(--color-text-disabled); +} + +.step-proj .step .desc .detail { + margin-top: 10px; + font-size: 12px; + width: 100%; + height: 32px; + line-height: 16px; + color: var(--color-note); + word-break: break-all; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; +} + +.step-proj .step-line { + position: absolute; + top: 18px; + left: 190px; + width: 150px; + border-top: 1px solid var(--color-disabled); +} + +.step-proj .step-line-complete { + border-color: var(--color-blue); } .step-proj .step-card { - margin-top: 15px; + margin-top: 40px; + padding: 10px 0; + border: 1px solid var(--color-border); + overflow: auto; } .step-proj .step-card .step-card-list { @@ -35,10 +93,18 @@ align-items: center; } -.step-proj .step-card .step-card-list .card-proj-edit { - margin-bottom: 15px; +.step-proj .step-card .step-card-list .card-proj-edit, +.step-proj .step-card .step-card-list .card-proj-loading, +.step-proj .step-card .step-card-list .card-proj-result, +.step-proj .step-card .step-card-list .card-proj-download, +.step-proj .step-card .step-card-list .card-proj-jump { + border-bottom: 1px solid var(--color-border); } -.step-proj .step-card .step-card-list .card-proj-edit:last-child { - margin-bottom: 0; +.step-proj .step-card .step-card-list .card-proj-edit:last-child, +.step-proj .step-card .step-card-list .card-proj-loading:last-child, +.step-proj .step-card .step-card-list .card-proj-result:last-child, +.step-proj .step-card .step-card-list .card-proj-download:last-child, +.step-proj .step-card .step-card-list .card-proj-jump:last-child { + border-bottom: none; } \ No newline at end of file diff --git a/src/index.css b/src/index.css index 2134b9f..83df3c2 100644 --- a/src/index.css +++ b/src/index.css @@ -1,15 +1,20 @@ :root { - --color-border: #d9d9d9; + --color-border: #BBBBBB; --color-box-shadow: rgba(0, 0, 0, 0.3); --color-red: #ff5722; --color-orange: #ffb800; - --color-green: #16baaa; - --color-blue: #1e9fff; + --color-green: rgba(129,179,55,1); + --color-blue: rgba(64,149,229,1); --color-purple: #a233c6; - --color-dark: #2f363c; + --color-dark: rgba(68,72,88,1); --color-light: #fafafa; --color-hover: #eeeeee; - --font-size-head: 16px; + --color-text-disabled: rgba(68,72,88,0.5); + --color-text-header-left: #FFBF6B; + --color-text-header-right: #101010; + --color-note: rgba(68,72,88,0.5); + --color-disabled: #D9D9D9; + --font-size-head: 14px; --width-workspace: 1280px; --height-head: 60px; --height-foot: 30px; diff --git a/src/interfaces/arrow/IArrow.ts b/src/interfaces/arrow/IArrow.ts new file mode 100644 index 0000000..91dc75f --- /dev/null +++ b/src/interfaces/arrow/IArrow.ts @@ -0,0 +1,4 @@ +export interface IArrow { + width: number; + color: string; +} \ No newline at end of file diff --git a/src/interfaces/card/ICardProj.ts b/src/interfaces/card/ICardProj.ts new file mode 100644 index 0000000..1be4c5d --- /dev/null +++ b/src/interfaces/card/ICardProj.ts @@ -0,0 +1,32 @@ +export interface IProjEdit { + title: string; + desc?: string; + + handleEdit(): void; +} + +export interface IProjLoading { + title: string; + desc?: string; +} + +export interface IProjResult { + title: string; + isSuccess: boolean; + + handleFeedback?(): void; +} + +export interface IProjDownload { + title: string; + desc: string; + + handleDownload(): void; +} + +export interface IProjJump { + title: string; + desc: string; + + handleJump(): void; +} \ No newline at end of file diff --git a/src/interfaces/step/IStepProj.ts b/src/interfaces/step/IStepProj.ts index 08c5451..58396cf 100644 --- a/src/interfaces/step/IStepProj.ts +++ b/src/interfaces/step/IStepProj.ts @@ -1,7 +1,16 @@ import {ReactNode} from "react"; +export enum Process { + COMPLETE, + PROCESSING, + PENDING +} + export interface IStepProj { step: number; - desc: string; + process: Process; + descTitle: string; + descDetail?: string; + hasNext?: boolean; children: ReactNode } \ No newline at end of file diff --git a/src/layout/head/Head.tsx b/src/layout/head/Head.tsx index 362f5b5..3f0ee23 100644 --- a/src/layout/head/Head.tsx +++ b/src/layout/head/Head.tsx @@ -3,17 +3,19 @@ import Dropdown from '../../components/dropdown/Dropdown.tsx'; import BalanceHead from '../../components/balance/BalanceHead.tsx'; import RechargeHead from '../../components/recharge/RechargeHead.tsx'; import MessageHead from '../../components/message/MessageHead.tsx'; +import headRightBg from '../../assets/head-right-bg.png' +import {Divider} from "antd"; export default function Head() { - const logo: string = 'vite.svg'; return (
- 加载失败 - AI软件著作权管理系统 + AI引擎软著 + + 软件著作权一站式服务平台
-
+
diff --git a/src/layout/head/head.css b/src/layout/head/head.css index 60fd137..27565c8 100644 --- a/src/layout/head/head.css +++ b/src/layout/head/head.css @@ -4,10 +4,10 @@ position: fixed; top: 0; left: 0; - background-color: var(--color-dark); + background-color: var(--color-light); box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3); z-index: 0; - color: var(--color-light) + color: var(--color-dark); } .head .center { @@ -23,8 +23,9 @@ height: 100%; display: flex; align-items: center; - font-size: 20px; + font-size: 18px; font-weight: 800; + color: var(--color-text-header-left); } .head .center .left .logo { @@ -32,12 +33,16 @@ height: 38px; } -.head .center .left .sys-title { - margin-left: 5px; +.head .center .left .sys-title {} + +.head .center .left .sys-title-sub { + font-size: 14px; + font-weight: unset; } .head .center .right { height: 100%; + padding-left: 60px; display: flex; justify-content: right; } @@ -47,7 +52,7 @@ display: flex; justify-content: center; align-items: center; - padding: 0 15px; + padding: 0 10px; font-size: var(--font-size-head); cursor: pointer; position: relative; diff --git a/src/route/proj/ProjEdit.tsx b/src/route/proj/ProjEdit.tsx index 42c27a6..c777a44 100644 --- a/src/route/proj/ProjEdit.tsx +++ b/src/route/proj/ProjEdit.tsx @@ -1,12 +1,18 @@ import './proj-edit.css'; -import {Link} from "react-router-dom"; -import {Breadcrumb} from "antd"; +import {Link, useNavigate} from "react-router-dom"; +import {Breadcrumb, Button} from "antd"; import StepProjEdit from "../../components/step/StepProjEdit.tsx"; import CardProjEdit from "../../components/card/CardProjEdit.tsx"; +import {Process} from "../../interfaces/step/IStepProj.ts"; +import CardProjLoading from "../../components/card/CardProjLoading.tsx"; +import CardProjResult from "../../components/card/CardProjResult.tsx"; +import CardProjDownload from "../../components/card/CardProjDownload.tsx"; +import CardProjJump from "../../components/card/CardProjJump.tsx"; export default function ProjEdit() { - const height = window.innerHeight - 150; + const nav = useNavigate(); + const height = window.innerHeight - 240; return ( <> -
-
- - - - - - - -
+
+ + { + + }} + /> + + + { + + }} + /> + + + { + console.log('编辑') + }} + /> + + { + console.log('反馈') + }} + /> + + + { + console.log('下载') + }} + /> + { + console.log('跳转'); + }} + /> + +
+
+
) diff --git a/src/route/proj/proj-create.css b/src/route/proj/proj-create.css index b710067..e0c671a 100644 --- a/src/route/proj/proj-create.css +++ b/src/route/proj/proj-create.css @@ -1,4 +1,5 @@ .proj-create { + min-height: 100%; background-color: var(--color-light); display: flex; justify-content: center; diff --git a/src/route/proj/proj-edit.css b/src/route/proj/proj-edit.css index 8121741..356c730 100644 --- a/src/route/proj/proj-edit.css +++ b/src/route/proj/proj-edit.css @@ -1,4 +1,13 @@ .proj-edit { background-color: var(--color-light); padding: 15px; + display: flex; + justify-content: space-between; +} + +.btn-container { + width: 100%; + padding: 5px 0 15px 0; + text-align: center; + background-color: var(--color-light); } \ No newline at end of file diff --git a/src/route/proj/proj-new.css b/src/route/proj/proj-new.css index 73a3d37..3fc8933 100644 --- a/src/route/proj/proj-new.css +++ b/src/route/proj/proj-new.css @@ -1,5 +1,5 @@ .proj-new { - height: 100%; + min-height: 100%; background-color: var(--color-light); display: flex; flex-direction: column;