feat: 完成提交任务头部样式

src/views/Project/ProjectSubmitWork/index.module.css

@@ -14,7 +14,35 @@
   height: 56px;
   background-color: #fff;
   box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.04);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0 24px;
+}
+.swHeaderLeft {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+}
+.swTemplateTitle {
+  margin: 0 19px 0 8px;
+  line-height: 22px;
+  font-size: 14px;
+  color: rgba(30, 38, 51, 1);
+  font-weight: 600;
+  padding-right: 20px;
+  border-right: 1px solid rgba(235, 237, 240, 1);
+}
+.swHeaderLable {
+  color: rgba(138, 144, 153, 1);
+  font-size: 12px;
+}
+.swHeaderValue {
+  color: rgba(30, 38, 51, 1);
+  font-size: 12px;
+  margin-right: 24px;
 }
+
 .swContent {
   display: flex;
 }

src/views/Project/ProjectSubmitWork/index.tsx

@@ -3,13 +3,54 @@ import styles from "./index.module.css";
 import { templateConfigJson } from "./mock";
 import ConfigForm from "./ConfigForm";
 import WorkFlow from "./WorkFlow";
+import ButtonComponent from "@/components/mui/Button";
+import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
+import IconButton from "@mui/material/IconButton";
 
 const ProjectSubmitWork = () => {
   const [templateConfigInfo, setTemplateConfigInfo] =
     useState(templateConfigJson);
+
   return (
     <div className={styles.swBox}>
-      <div className={styles.swHeader}>头部</div>
+      <div className={styles.swHeader}>
+        <div className={styles.swHeaderLeft}>
+          <IconButton
+            color="primary"
+            aria-label="upload picture"
+            component="span"
+            size="small"
+          >
+            <ArrowBackIosNewIcon
+              sx={{
+                color: "rgba(194, 198, 204, 1)",
+                width: "12px",
+                height: "12px",
+              }}
+            />
+          </IconButton>
+
+          <div className={styles.swTemplateTitle}>
+            {templateConfigInfo.title}
+          </div>
+          <div className={styles.swTemplateVersionBox}>
+            <span className={styles.swHeaderLable}>版本：</span>
+            <span className={styles.swHeaderValue}>
+              {templateConfigInfo.version}
+            </span>
+          </div>
+          <div className={styles.swTemplateUpdateTimeBox}>
+            <span className={styles.swHeaderLable}>更新时间：</span>
+            <span className={styles.swHeaderValue}>
+              {templateConfigInfo.updateTime}
+            </span>
+          </div>
+          <div className={styles.swHeaderGoback}></div>
+        </div>
+        <div className={styles.swHeaderRight}>
+          <ButtonComponent text="提交任务"></ButtonComponent>
+        </div>
+      </div>
       <div className={styles.swContent}>
         <div className={styles.swFormBox}>
           <ConfigForm />