diff --git a/src/pages/Team/deploy/Container/HistoryLog.tsx b/src/pages/Team/deploy/Container/HistoryLog.tsx new file mode 100644 index 0000000..1405f39 --- /dev/null +++ b/src/pages/Team/deploy/Container/HistoryLog.tsx @@ -0,0 +1,81 @@ +import { theme } from '@/style/theme'; +import { getStageLog } from '@/utils/apis/container'; +import styled from '@emotion/styled'; +import { useEffect, useState } from 'react'; +import { useParams } from 'react-router-dom'; + +export const TeamDeployContainerHistoryLog = () => { + const { pipelineName, pipelineCounter, stageName } = useParams(); + const [data, setData] = useState(); + + useEffect(() => { + if (pipelineName && pipelineCounter && stageName) { + getStageLog(pipelineName, pipelineCounter, stageName).then((res) => { + setData(res.data); + }); + } + }, [pipelineName, pipelineCounter, stageName]); + + return ( + + + stage + {stageName && {stageName}} + + {data && ( + + {data.split('\n').map((ele, idx) => { + return
{ele}
; + })} +
+ )} +
+ ); +}; + +const Wrapper = styled.div` + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + gap: 30px; +`; + +const TitleContainer = styled.div` + width: 100%; + max-width: 1120px; + display: flex; + flex-direction: column; + gap: 4px; +`; + +const TeamName = styled.div` + font-size: 20px; + font-weight: 500; + color: ${theme.color.gray5}; +`; + +const Title = styled.div` + font-size: 30px; + font-weight: 600; + color: ${theme.color.gray8}; + display: flex; + align-items: center; + gap: 14px; +`; + +const BuildLog = styled.div` + width: 100%; + max-width: 1120px; + height: 100%; + background-color: #333333; + border-radius: 8px; + padding: 30px; + > div { + word-wrap: break-word; + font-family: 'JetBrains Mono'; + font-weight: 600; + font-size: 12px; + color: ${theme.color.gray1}; + } +`; diff --git a/src/utils/apis/container.ts b/src/utils/apis/container.ts index 49a790f..457ab9f 100644 --- a/src/utils/apis/container.ts +++ b/src/utils/apis/container.ts @@ -1,20 +1,65 @@ -import { ContainerEnvType } from '../types/containerType'; +import { ConfigPostType, ContainerEnvType } from '../types/containerType'; import { instance } from './axios'; -const router = 'v1/container'; +const v1Router = 'v1/container'; +const v2Router = 'v2/container'; export const getAllContainer = async (deployUUID: string) => { - return await instance.get(`${router}?deployId=${deployUUID}`); + return await instance.get(`${v1Router}?deployId=${deployUUID}`); }; export const getDetailContainer = async (deployUUID: string, env: string) => { - return await instance.get(`${router}/details?deployId=${deployUUID}&environment=${env}`); + return await instance.get(`${v1Router}/details?deployId=${deployUUID}&environment=${env}`); }; -export const getCPU = async (deployUUID: string, env: ContainerEnvType) => { - return await instance.get(`${router}/cpu?deployId=${deployUUID}&environment=${env}`); +export const getCPU = async (deployUUID: string, env: string) => { + return await instance.get(`${v1Router}/cpu?deployId=${deployUUID}&environment=${env}`); }; -export const getMemory = async (deployUUID: string, env: ContainerEnvType) => { - return await instance.get(`${router}/memory?deployId=${deployUUID}&environment=${env}`); +export const getMemory = async (deployUUID: string, env: string) => { + return await instance.get(`${v1Router}/memory?deployId=${deployUUID}&environment=${env}`); +}; + +export const writeContainerConfig = async (deployUUID: string, data: ConfigPostType) => { + return await instance.post(`${v2Router}/config?deployId=${deployUUID}`, data); +}; + +export const writeContainerGradle = async ( + deployUUID: string, + env: string, + data: { + jdk_version: string; + output_dir: string; + build_commands: string[]; + }, +) => { + return await instance.post(`${v2Router}/gradle?deployId=${deployUUID}&environment=${env}`, data); +}; + +export const writeContainerNode = async ( + deployUUID: string, + env: string, + data: { + node_version: string; + command: string; + build_commands: string[]; + }, +) => { + return await instance.post(`${v2Router}/gradle?deployId=${deployUUID}&environment=${env}`, data); +}; + +export const writeContainerNginx = async ( + deployUUID: string, + env: string, + data: { + node_version: string; + output_dir: string; + build_commands: string[]; + }, +) => { + return await instance.post(`${v2Router}/gradle?deployId=${deployUUID}&environment=${env}`, data); +}; + +export const getStageLog = async (pipelineName: string, pipelineCounter: string, stageName: string) => { + return await instance.get(`${v2Router}/${pipelineName}/${pipelineCounter}/stage/${stageName}`); }; diff --git a/src/utils/types/containerType.ts b/src/utils/types/containerType.ts index a850836..defb159 100644 --- a/src/utils/types/containerType.ts +++ b/src/utils/types/containerType.ts @@ -21,3 +21,11 @@ export type ContainerDetailType = { container_name: string; is_v2: boolean; }; + +type ConfigType = { + branch: string; + container_port: string; + domain: string; +}; + +export type ConfigPostType = { stag: ConfigType; prod: ConfigType; language: string }; diff --git a/src/utils/types/historyType.ts b/src/utils/types/historyType.ts index 1f07e2d..eca8bd0 100644 --- a/src/utils/types/historyType.ts +++ b/src/utils/types/historyType.ts @@ -9,4 +9,6 @@ export type HistoryType = { scheduled_date: number; commit_message: string; stages: StageType[]; + pipeline_name: string; + pipeline_counter: number; };