feat:查看日志修改

src/views/Project/ProjectJobDetail/LogView/index.module.css

@@ -20,38 +20,72 @@
 }
 
 .logViewTop {
-	/* height: 30px; */
+	position: relative;
 	width: 100vw;
 	background-color: #1d2126;
-	/* border-radius: 8px 8px 0 0; */
 	display: flex;
 	font-size: 12px;
 	color: #8a9099;
-	/* overflow: overlay; */
+	overflow: hidden;
 }
 
-.logViewTop::-webkit-scrollbar-track {
-	background-color: #282c34;
+.leftButton {
+	width: 48px;
+	height: 32px;
+	flex-shrink: 0;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	cursor: pointer;
+	border-right: 1px solid #10141A;
+	background-color: #1d2126;
+}
+
+.rightButton {
+	width: 48px;
+	height: 32px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	cursor: pointer;
+	border-left: 1px solid #10141A;
+	background-color: #1d2126;
+}
+
+.middleFixed {
+	width: calc(100vw - 98px);
+	position: relative;
+	overflow: hidden;
+}
+
+.middleDynamic{
+	display: flex;
+	position: absolute;
+	left: 0;
 }
 
 .logTitle {
 	display: flex;
-	/* width: 0; */
-	/* max-width: 200px; */
 	overflow: hidden;
 	white-space: nowrap;
 	text-overflow: ellipsis;
-	/* flex: 1; */
+	flex-shrink: 0;
 	align-items: center;
 	height: 32px;
 	line-height: 20px;
-	padding: 0 32px;
+	padding: 0 20px;
 	cursor: pointer;
 	border-right: 1px solid #10141A;
 }
 
+.logName {
+	max-width: 90px;
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+
 .logTitleSelected {
-	flex-shrink: 0;
 	background: #282c34;
 	color: #ffffff;
 }

src/views/Project/ProjectJobDetail/LogView/index.tsx

@@ -8,17 +8,17 @@ import CloudEController from "@/api/fileserver/CloudEController";
 import { useStores } from "@/store";
 import { toJS } from "mobx";
 import FullScreenDrawer from "@/components/CommonComponents/FullScreenDrawer";
+import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
+import ChevronRightIcon from '@mui/icons-material/ChevronRight';
 
 
 type LogViewProps = {
-    isshow: boolean;
-    handleClose: () => void;
     logs: any[];
-    setShowAddTemplate: any;
+    setShowLogView: any;
 };
 
 const LogView = (props: LogViewProps) => {
-    const { isshow, handleClose, logs, setShowAddTemplate } = props;
+    const { logs, setShowLogView } = props;
     const { currentProjectStore } = useStores();
     const fileToken = toJS(currentProjectStore.currentProjectInfo.filetoken);
     const projectId = toJS(currentProjectStore.currentProjectInfo.id);
@@ -65,10 +65,13 @@ const LogView = (props: LogViewProps) => {
     }
 
     return (
-        <FullScreenDrawer handleClose={setShowAddTemplate} zIndex={1002}>
+        <FullScreenDrawer handleClose={setShowLogView} zIndex={1002}>
             <div className={style.logViewBox}>
                 <div className={style.logViewContentMask}></div>
                 <div className={style.logViewTop}>
+                    <div className={style.leftButton}><ChevronLeftIcon /></div>
+                    <div className={style.middleFixed}>
+                        <div className={style.middleDynamic}>
                             {logs.map((item: any, index: number) => {
                                 return <div
                                     key={index}
@@ -78,10 +81,13 @@ const LogView = (props: LogViewProps) => {
                                         [style.logTitleSelected]: index === logCurrent,
                                     })}>
                                     <InsertDriveFileOutlinedIcon className={style.fileIcon} />
-                            <span>{item.logName}</span>
+                                    <span className={style.logName}>{item.logName}</span>
                                 </div>
                             })}
                         </div>
+                    </div>
+                    <div className={style.rightButton}><ChevronRightIcon /></div>
+                </div>
                 <div className={style.logViewContent}>
                     {logText}
                 </div>

src/views/Project/ProjectJobDetail/index.tsx

@@ -780,10 +780,8 @@ const ProjectSubmitWork = observer(() => {
 			)}
 			{showLogView && (
 				<LogView
-					isshow={showLogView}
-					handleClose={handleClose}
 					logs={logs}
-					setShowAddTemplate={handleClose}
+					setShowLogView={handleClose}
 				/>
 			)}
 		</div>