m-cmp · raccoon-mh · Nov 3, 2024 · Nov 3, 2024 · Nov 3, 2024 · Nov 4, 2024
diff --git a/conf/getapiyaml.sh b/conf/getapiyaml.sh
@@ -4,7 +4,7 @@ FILE="./api.yaml"
 read -p "MCIAM USE? (y/n): " MCIAM_USE 
 
 case "$MCIAM_USE" in
-    y|Y ) URL="https://raw.githubusercontent.com/MZC-CSC/mc-admin-cli/develop/conf/api.yaml";; # m-cmp/mc-admin-cli
+    y|Y ) URL="https://raw.githubusercontent.com/m-cmp/mc-admin-cli/refs/heads/main/conf/api.yaml";; # m-cmp/mc-admin-cli
     n|N ) URL="https://raw.githubusercontent.com/cloud-barista/cm-mayfly/main/conf/api.yaml";; # cloud-barista/cm-mayfly
 esac
 

diff --git a/front/assets/css/application.scss b/front/assets/css/application.scss
@@ -13,6 +13,9 @@
 // tomselect Custom CSS
 @import "./tomselect_for_tabler.scss";
 
+// xtermjs
+@import "~@xterm/xterm/css/xterm.css";
+
 .section {
   display: none;
 }

diff --git a/front/assets/js/common/api/services/monitoring_api.js b/front/assets/js/common/api/services/monitoring_api.js
@@ -345,7 +345,7 @@ export async function getMonitoringLog(nsId, mciId, targetId, keyword) {
   data.request = request;
 
 
-  var controller = "/api/" + "mc-observability/" + "GET_OpensearchLogs";
+  var controller = "/api/" + "mc-observability/" + "GETOpensearchLogs";
   const response = await webconsolejs["common/api/http"].commonAPIPost(
     controller,
     data
@@ -428,7 +428,6 @@ export async function getTargetsNsMci(nsId, mciId) {
     controller,
     data
   )
-
   // target이 있다는 이야기는 agent가 설치되었다는 뜻으로 보면 되는가? maybe
   var respMeasureMent = response.data.responseData;
 

diff --git a/front/assets/js/common/api/services/remotecmd_api.js b/front/assets/js/common/api/services/remotecmd_api.js
@@ -0,0 +1,173 @@
+import { Terminal } from 'xterm';
+import { FitAddon } from '@xterm/addon-fit';
+
+let terminalInstance = null;
+
+export async function initTerminal(id, nsId, mciId, vmid) {
+	console.log("Trying to connect to " + nsId + " / " + mciId);
+
+	// 기존 터미널이 존재한다면 삭제
+	if (terminalInstance) {
+		terminalInstance.dispose();
+		terminalInstance = null;
+	}
+
+	// 새 터미널 및 FitAddon 생성
+	const term = new Terminal({
+		theme: {
+			background: '#1e1e1e',
+			foreground: '#ffffff',
+			cursor: '#ffcc00'
+		},
+		cursorBlink: true
+	});
+	const fitAddon = new FitAddon();
+	term.loadAddon(fitAddon);
+
+	// 터미널을 지정된 컨테이너에 열기
+	const container = document.getElementById(id);
+	term.open(container);
+
+	terminalInstance = term;
+
+	const ipcmd = "client_ip=$(echo $SSH_CLIENT | awk '{print $1}'); echo SSH client IP is: $client_ip";
+	await processCommand(nsId, mciId, vmid, ipcmd, term, () => {
+		// console.log("done get ip")
+	});
+
+	function prompt() {
+		term.write('\r\n $ ');
+	}
+	prompt();
+
+	let userInput = '';
+
+	term.onData(async (data) => {
+		if (data === '\r') { 
+			const command = userInput; 
+			userInput = ''; 
+			term.write(`\r\n`); 
+
+			await processCommand(nsId, mciId, vmid, command, term, () => {
+				prompt();
+			});
+		} else if (data === '\u007f') {
+			if (userInput.length > 0) {
+				term.write('\b \b');
+				userInput = userInput.slice(0, -1);
+			}
+		} else {
+			if (/^[a-zA-Z0-9 !@#$%^&*()_\-+=\[\]{}|;:'",.<>/?]$/.test(data)) {
+				term.write(data);
+				userInput += data;
+			}
+		}
+	});
+}
+
+async function processCommand(nsid, mciid, vmid, command, term, callback) {
+	const loadingSymbols = ['|', '/', '-', '\\'];
+	let loadingIndex = 0;
+
+	const loadingInterval = setInterval(() => {
+		term.write(`\r${loadingSymbols[loadingIndex]} Processing...`);
+		loadingIndex = (loadingIndex + 1) % loadingSymbols.length;
+	}, 250);
+
+	try {
+		// API 호출 및 결과 받기
+		const result = await postcmdmci(nsid, mciid, vmid, [command]);
+
+		clearInterval(loadingInterval); // 로딩 애니메이션 중지
+		term.write('\r                     \r'); // 로딩 텍스트 지우기
+
+		const response = result.results[0];
+		const stdout = response.stdout;
+		const stderr = response.stderr;
+
+		// STDOUT 출력
+		if (stdout && Object.values(stdout).some(value => value.trim() !== '')) {
+			term.write('\r\nSTDOUT:\r\n');
+			Object.values(stdout).forEach(value => {
+				const lines = value.split('\n');
+				lines.forEach(line => {
+					writeAutoWrap(term, line);
+				});
+			});
+		} else {
+			term.write('\r\nSTDOUT: (No output)\r\n');
+		}
+
+		// STDERR 출력
+		if (stderr && Object.values(stderr).some(value => value.trim() !== '')) {
+			term.write('\r\nSTDERR:\r\n');
+			Object.values(stderr).forEach(value => {
+				const lines = value.split('\n');
+				lines.forEach(line => {
+					if (line.trim() !== "") { 
+						writeAutoWrap(term, line);
+					}
+				});
+			});
+		}
+
+		callback(); // 완료 콜백 호출
+
+	} catch (error) {
+		clearInterval(loadingInterval); // 에러 발생 시 로딩 애니메이션 중지
+		term.write('\r                     \r'); // 로딩 텍스트 지우기
+		term.write(`Error: ${error.message}\r\n`); // 에러 메시지 전달
+		callback();
+	}
+}
+
+// 자동 줄바꿈 처리 함수
+function writeAutoWrap(term, text) {
+	const cols = term.cols;
+	console.log("@@@@@@@@@@ cols", cols)
+	let currentLine = '';
+
+	for (let i = 0; i < text.length; i++) {
+		const char = text[i];
+
+		if (char === '\n') {
+			term.write(currentLine + '\r\n');
+			currentLine = '';
+			continue;
+		}
+
+		currentLine += char;
+		if (currentLine.length >= cols) {
+			term.write(currentLine + '\r\n');
+			currentLine = '';
+		}
+	}
+
+	if (currentLine) {
+		term.write(currentLine);
+	}
+}
+
+export async function postcmdmci(nsid, mciid, vmid, cmdarr) {
+	const data = {
+		pathParams: {
+			nsId: nsid,
+			mciId: mciid
+		},
+		queryParams: {
+			vmId: vmid
+		},
+		Request: {
+			command: cmdarr,
+			userName: "cb-user"
+		}
+	}
+	const controller = "/api/" + "mc-infra-manager/" + "Postcmdmci";
+	const response = await webconsolejs["common/api/http"].commonAPIPost(
+		controller,
+		data
+	);
+	console.log("lookup disk info response : ", response);
+	const responseData = response.data.responseData;
+	return responseData;
+}
diff --git a/front/assets/js/pages/operation/analytics/monitoringconfig.js b/front/assets/js/pages/operation/analytics/monitoringconfig.js
@@ -99,54 +99,53 @@ $("#workloadlist").on('change', async function () {
 
   // 1. mci의 vm 목록 조회(install 여부를 위해 필요.)
   try {
-      var response = await webconsolejs["common/api/services/mci_api"].getMci(currentNsId, currentWorkloadId);
-      var aMci = response.responseData
-      console.log("aMci ", aMci)
-      for (var vmIndex in aMci.vm) {
-        var aVm = aMci.vm[vmIndex]
-        aVm.workloadType = "MCI";// [MCI/PMK]
-        aVm.workloadName = currentWorkloadName;
-        aVm.monAgentStatus = "Not Installed";
-        //console.log("aVm ", aVm)
-        vmMap.set(aVm.id, aVm);
-      }
-      console.log(vmMap)
+    var response = await webconsolejs["common/api/services/mci_api"].getMci(currentNsId, currentWorkloadId);
+    var aMci = response.responseData
+    console.log("aMci ", aMci)
+    for (var vmIndex in aMci.vm) {
+      var aVm = aMci.vm[vmIndex]
+      aVm.workloadType = "MCI"; // [MCI/PMK]
+      aVm.workloadName = currentWorkloadName;
+
+      aVm.monAgentStatus = "Not Installed";
+      vmMap.set(aVm.id, aVm);
+    }
+    console.log(vmMap)
     // 2. mci에 agent 설치된 목록 조회
     var monitorTargetList = await webconsolejs["common/api/services/monitoring_api"].getTargetsNsMci(currentNsId, currentWorkloadId)
+    console.log("monitorTargetList",monitorTargetList )
     console.log("monitorTargetList",monitorTargetList.data )
     for (var i in monitorTargetList.data) {
-      console.log("monitorTargetList.data[i].id", monitorTargetList.data[i].id)
-      // [
-      //   {
-      //       "alias_name": "77+9",
-      //       "description": "77+9bQ==",
-      //       "id": "g1-1-1",
-      //       "mci_id": "mci01",
-      //       "name": "g1-1-1",
-      //       "ns_id": "ns01",
-      //       "state": "ACTIVE"
-      //   }
-      // ]      
-      //var findVm = vmMap.get(monitorTargetList.data[i].id)
-      var findVm = vmMap.get("vm01-1")
-      console.log("findVm", findVm)
-      if( findVm){
-        console.log("findVm2", findVm)
-        //findVm.workloadType = "MCI";
-
+      console.log("monitorTargetList.data[i].id", i, monitorTargetList.data[i].id)
+
+      //   [
+      //     {
+      //         "alias_name": null,
+      //         "description": "dm0x",
+      //         "id": "vm-1",
+      //         "mci_id": "mci01",
+      //         "name": null,
+      //         "ns_id": "ns01",
+      //         "state": "ACTIVE"
+      //     }
+      // ]
+
+      // FIXME : 하드코드 for demo
+      var findVm = vmMap.get(monitorTargetList.data[i].id)
+      if(findVm){
         findVm.monAgentStatus = monitorTargetList.data[i].state;// [ACTIVE/INACTIVE]
         vmMap.set(findVm.id, findVm);
       }
     }
   }catch(e){
     console.log(e)
   }
-  // 3. mci에 log 설정??
 
+  // 3. mci에 log 설정??
   console.log("vmMap", Array.from(vmMap.values()))
+
   // 4. table에 필요한 data set
   monitorConfigListTable.setData(Array.from(vmMap.values()));
-
 })
 
 // getMciList 호출 성공 시
@@ -166,41 +165,44 @@ function getSelectedMonitorConfigData(servernodeId) {
     console.log("return ", servernodeId)
     return;
   }
-
-  // 
-  // Toggle Monitoring Config Info
-  // 기본은 detailTab : monitoringconfig_info 
-  // var div = document.getElementById("monitoringconfig_info");//monitoring_configuration
-  // console.log("monitoringconfig_info ", div)
-  // webconsolejs["partials/layout/navigatePages"].toggleElement(div)
-
+  console.log("selectedServerNode.id", selectedServerNode.id)
   setMonitorConfigInfoData();
 
 }
 
 // 클릭한 mci의 info값 세팅
-function setMonitorConfigInfoData() {
+async function setMonitorConfigInfoData() {
 
   // var row = monitorConfigListTable.getRow(currentServernodeId);  
   // console.log(row)
   // console.log("setMonitorConfigInfoData", monitorConfigData)
 
   //selectedServerNode 안에 현재 선택한 rowData가 들어있음
   console.log("setMonitorConfigInfoData ", selectedServerNode)
+
+
+
+  var htmlCardIdPrefix = "#monitoringconfig_info_"
   try {
-    // var mciID = mciData.id;
-    // var mciName = mciData.name;
-    // var mciDescription = mciData.description;
-    // var mciStatus = mciData.status;
-    // console.log("setMciInfoData ", mciStatus)
-    // var mciDispStatus = webconsolejs["common/api/services/mci_api"].getMciStatusFormatter(mciStatus);
-    // var mciStatusIcon = webconsolejs["common/api/services/mci_api"].getMciStatusIconFormatter(mciDispStatus);
-    // var mciProviderNames = webconsolejs["common/api/services/mci_api"].getMciInfoProviderNames(mciData); //MCIS에 사용 된 provider
-    // var totalvmCount = mciData.vm.length; //mci의 vm개수
-
-    // console.log("totalvmCount", totalvmCount)
-
-    // $("#mci_info_text").text(" [ " + mciName + " ]")
+    const generateOnOffIndicator = (result, status) => `<label class="form-check form-switch">
+      <input class="form-check-input" type="checkbox" checked="${result}">
+      <span class="form-check-label">${status}</span>
+    </label>`;
+    const generateStatusIndicator = (result, status) => `<span class="badge bg-${result} me-1"></span>${status}`;
+    console.log("selectedServerNode.label", selectedServerNode.label)
+    var response = await webconsolejs["common/api/services/monitoring_api"].getMonitoringLog(
+      selectedServerNode.label["sys.namespace"], 
+      selectedServerNode.label["sys.mciId"], 
+      selectedServerNode.label["sys.id"], 
+      "", 
+      );
+      console.log(response)
+    $(htmlCardIdPrefix+"name").text(selectedServerNode.name+" / "+selectedServerNode.id)
+    $(htmlCardIdPrefix+"desc").text(selectedServerNode.description)
+    $(htmlCardIdPrefix+"workload").text(selectedServerNode.workloadType+" / "+selectedServerNode.workloadName)
+    $(htmlCardIdPrefix+"monitor").html(generateOnOffIndicator(selectedServerNode.monAgentStatus === "ACTIVE" ? "true" : "false", selectedServerNode.monAgentStatus === "ACTIVE" ? "On" : "Off"))
+    $(htmlCardIdPrefix+"agent_status").html(generateStatusIndicator(selectedServerNode.monAgentStatus === "ACTIVE" ? "success" : "waring", selectedServerNode.monAgentStatus === "ACTIVE" ? "Running" : "Stopped"))
+    $(htmlCardIdPrefix+"collect_status").html(generateStatusIndicator(selectedServerNode.monAgentStatus === "ACTIVE" ? "success" : "waring", selectedServerNode.monAgentStatus === "ACTIVE" ? "running" : "waring"))
     // $("#mci_server_info_status").empty();
     // $("#mci_server_info_status").text(" [ " + mciName + " ]")
     // $("#mci_server_info_count").text(" Server(" + totalvmCount + ")")
@@ -623,9 +625,8 @@ function initMonitorConfigTable() {
     // 상세 정보 표시 여부
     if (tempServernodeId === currentServernodeId) {
       webconsolejs["partials/layout/navigatePages"].deactiveElement(document.getElementById("monitoring_configuration"))
-
-      this.deselectRow();
-      return
+      this.dese
+      returnlectRow();
     } else {
       webconsolejs["partials/layout/navigatePages"].activeElement(document.getElementById("monitoring_configuration"))
       this.deselectRow();

diff --git a/front/assets/js/pages/operation/manage/mci.js b/front/assets/js/pages/operation/manage/mci.js
@@ -1054,4 +1054,21 @@ document.getElementById("filter-clear").addEventListener("click", function () {
 });
 /////////////////////////Tabulator Filter END/////////////////////////
 
-////////////////////////////////////////////////////// END TABULATOR ///////////////////////////////////////////////////
+////////////////////////////////////////////////////// END TABULATOR ///////////////////////////////////////////////////
+
+
+
+
+
+
+/////////////////// TEST TERMINAL MODAL /////////////////////////
+
+export async function initremotecmdModal(){
+  const nsId = webconsolejs["common/api/services/workspace_api"].getCurrentProject().NsId
+  await webconsolejs["common/api/services/remotecmd_api"].initTerminal('xterm-container',nsId,currentMciId,selectedVmId) // vmStatus 별로 상태 색상 set
+  const modalElement = document.getElementById('cmdtestmodal');
+  const modalInstance = new bootstrap.Modal(modalElement);
+  modalInstance.show();
+}
+
+