bsm-lab
/
dfxconsole
1
0
Fork 0
Code Issues 7 Pull Requests Packages Projects Releases Wiki Activity

에이전트 설정 일반 부분 로직 진행중

Browse Source
main
icksishu@gmail.com 1 month ago
parent c4b3fd1b72
commit bda3207d19
2 changed files with 205 additions and 50 deletions
Show Stats Download Patch File Download Diff File

229
src/main/front/src/components/AgentConfigView.vue
Unescape View File

@ -47,6 +47,14 @@ const agentConfig = reactive({
postmanList: [],
},
})
let originalDtoString = ''
const agentConfigDeleted = {
knownAgentList: [],
dataSourceConfig: [],
logging: {
packages: [],
},
}
onMounted(() => {
if (modalEl.value) {
@ -59,35 +67,135 @@ onMounted(() => {
})
onBeforeUnmount(() => {
if (bsModal) {
bsModal.hide()
// Bootstrap v5에서는 dispose 지원
if (typeof bsModal.dispose === 'function') {
bsModal.dispose()
if (!bsModal) return
const instance = bsModal
const el = instance._element || modalEl.value
if (el) {
el.addEventListener(
'hidden.bs.modal',
() => {
if (typeof instance.dispose === 'function') {
instance.dispose()
}
bsModal = null
},
{ once: true },
)
instance.hide()
}
bsModal = null
})
// 부모 컴포넌트에서 AgentConfigView 팝업 호출(defineExpose에 추가됨)
function open() {
if (bsModal) {
if (props.dto) {
originalDtoString = JSON.stringify(props.dto)
Object.assign(agentConfig, props.dto)
}
bsModal.show()
}
}
// 부모 컴포넌트에서 AgentConfigView 팝업 닫기(defineExpose에 추가됨)
function close() {
if (bsModal) {
bsModal.hide()
}
}
// props.dto 기준으로 agentConfig reload
function configReload() {
Object.assign(agentConfig, JSON.parse(originalDtoString))
}
// agentConfig의 내용을 json 파일로 다운로드
function configExport() {}
// agentConfig의 내용을 서버에 전송하여 저장
function configSave() {}
// knownAgent 한 줄 추가
function addKnownAgent() {
const knownAgent = {
hostId: '',
hostName: '',
listenPort: '',
dropBoxIdList: [],
routingHostIdList: [],
added: true,
}
agentConfig.knownAgentList.push(knownAgent)
}
// 선택된 knownAgent 삭제
function deleteKnownAgent() {
for (let i = agentConfig.knownAgentList.length - 1; i >= 0; i--) {
if (agentConfig.knownAgentList[i].selected) {
let splicedList = agentConfig.knownAgentList.splice(i, 1)
if (Object.keys(splicedList[0]).indexOf('added') == -1) {
agentConfigDeleted.knownAgentList.push(splicedList)
}
}
}
}
// dataSource 한 줄 추가
function addDataSource() {
const dataSource = {
dataSourceId: '',
driverClassName: '',
url: '',
username: '',
password: '',
initialSize: 10,
minIdle: 10,
maxIdle: 30,
maxTotal: 300,
maximumRowForTransaction: 1000,
added: true,
}
agentConfig.dataSourceConfig.push(dataSource)
}
// 선택된 dataSource 삭제
function deleteDataSource() {
for (let i = agentConfig.dataSourceConfig.length - 1; i >= 0; i--) {
if (agentConfig.dataSourceConfig[i].selected) {
let splicedList = agentConfig.dataSourceConfig.splice(i, 1)
if (Object.keys(splicedList[0]).indexOf('added') == -1) {
agentConfigDeleted.dataSourceConfig.push(splicedList)
}
}
}
}
function addLoggingPackage() {
agentConfig.logging.packages.push({ '': 'INFO' })
}
function deleteLoggingPackage() {
for (let i = agentConfig.dataSourceConfig.length - 1; i >= 0; i--) {
if (agentConfig.dataSourceConfig[i].selected) {
let splicedList = agentConfig.dataSourceConfig.splice(i, 1)
if (Object.keys(splicedList[0]).indexOf('added') == -1) {
agentConfigDeleted.dataSourceConfig.push(splicedList)
}
}
}
}
function changeLoggingPackageName(loggingPackageObject, loggingPackageName, newLoggingPackageName) {
newLoggingPackageName = newLoggingPackageName.trim()
if (!newLoggingPackageName || loggingPackageName === newLoggingPackageName) {
return
}
if (Object.prototype.hasOwnProperty.call(loggingPackageObject, newLoggingPackageName)) {
return
}
loggingPackageObject[newLoggingPackageName] = loggingPackageObject[loggingPackageName]
delete loggingPackageObject[loggingPackageName]
}
defineExpose({
open,
close,
@ -102,6 +210,7 @@ defineExpose({
<div class="modal-header justify-content-between">
<h1 class="modal-title fs-5 pt-0" :id="props.modalId + 'Label'">에이전트 설정</h1>
<div class="d-flex align-items-center gap-2">
<button type="button" class="btn btn-info btn-sm" @click="configReload">Reload</button>
<button type="button" class="btn btn-success btn-sm" @click="configExport">Export</button>
<button type="button" class="btn btn-primary btn-sm" @click="configSave">Save</button>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
@ -124,31 +233,31 @@ defineExpose({
<div class="tab-pane fade show active tab-pane-scroll" id="general-tab-pane" role="tabpanel" aria-labelledby="general-tab" tabindex="0">
<div class="row mb-2">
<div class="col-md-12">
<h5>Agent General</h5>
<h5>일반 설정(Agent General)</h5>
</div>
</div>
<div class="row mb-2">
<div class="input-group">
<span class="input-group-text" id="agent-config-description-label">description</span>
<span class="input-group-text" id="agent-config-description-label">에이전트 설명(description)</span>
<input type="text" class="form-control" id="agent-config-description-input" aria-describedby="agent-config-description-label agent-config-description-input" v-model="agentConfig.description" />
</div>
</div>
<div class="row mb-2">
<div class="col-md-3">
<div class="input-group">
<span class="input-group-text" id="agent-config-my-host-id-label">myHostId</span>
<span class="input-group-text" id="agent-config-my-host-id-label">에이전트 아이디(myHostId)</span>
<input type="text" class="form-control" id="agent-config-my-host-id-input" aria-describedby="agent-config-my-host-id-label agent-config-my-host-id-input" v-model="agentConfig.myHostId" readonly />
</div>
</div>
<div class="col-md-3">
<div class="input-group">
<span class="input-group-text" id="agent-config-hecker-console-host-name-label">myHostName</span>
<span class="input-group-text" id="agent-config-hecker-console-host-name-label">에이전트 호스트(myHostName)</span>
<input type="text" class="form-control" id="agent-config-my-host-name-input" aria-describedby="agent-config-my-host-name-label agent-config-my-host-name-input" v-model="agentConfig.myHostName" readonly />
</div>
</div>
<div class="col-md-3">
<div class="input-group">
<span class="input-group-text" id="agent-config-my-listen-port-label">myListenPort</span>
<span class="input-group-text" id="agent-config-my-listen-port-label">에이전트 포트(myListenPort)</span>
<input type="number" class="form-control" id="agent-config-my-listen-port-input" aria-describedby="agent-config-my-listen-port-label agent-config-my-listen-port-input" v-model="agentConfig.myListenPort" readonly />
</div>
</div>
@ -156,26 +265,34 @@ defineExpose({
<hr />
<div class="row m-1">
<div class="card p-0">
<div class="card-header"><h5>knownAgentList</h5></div>
<div class="card-header d-flex">
<h5 class="mb-0">상대 에이전트 목록(knownAgentList)</h5>
<div class="ms-auto">
<button type="button" class="btn btn-sm btn-success" @click.prevent="addKnownAgent">추가</button>
<button type="button" class="btn btn-sm btn-danger ms-2" @click.prevent="deleteKnownAgent">삭제</button>
</div>
</div>
<div class="card-body">
<table class="table table-striped table-bordered align-middle">
<thead>
<tr>
<th scope="col" class="text-center">hostId</th>
<th scope="col" class="text-center">hostName</th>
<th scope="col" class="text-center">listenPort</th>
<th scope="col" class="text-center">routingHostIdList</th>
<th scope="col" class="text-center">선택</th>
<th scope="col" class="text-center">에이전트 아이디(hostId)</th>
<th scope="col" class="text-center">에이전트 호스트(hostName)</th>
<th scope="col" class="text-center">에이전트 포트(listenPort)</th>
<th scope="col" class="text-center">연결 경로(routingHostIdList)</th>
</tr>
</thead>
<tbody class="table-group-divider">
<tr v-if="agentConfig.knownAgentList.length > 0" v-for="knownAgent in agentConfig.knownAgentList" :key="knownAgent.hostId">
<td scope="row">{{ knownAgent.hostId }}</td>
<td>{{ knownAgent.hostName }}</td>
<td>{{ knownAgent.listenPort }}</td>
<td>{{ knownAgent.routingHostIdList }}</td>
<td scope="row" class="text-center"><input type="checkbox" class="form-check-input" v-model="knownAgent.selected" /></td>
<td><input type="text" class="form-control" v-model="knownAgent.hostId" /></td>
<td><input type="text" class="form-control" v-model="knownAgent.hostName" /></td>
<td><input type="number" class="form-control" v-model="knownAgent.listenPort" /></td>
<td><input type="text" class="form-control" v-model="knownAgent.routingHostIdList" /></td>
</tr>
<tr v-else>
<td scope="row" class="text-center" colspan="3">no agent.</td>
<td scope="row" class="text-center" colspan="5">no agent.</td>
</tr>
</tbody>
</table>
@ -220,11 +337,18 @@ defineExpose({
<!-- dataSource Configuration-->
<div class="row m-1">
<div class="card p-0">
<div class="card-header"><h5>dataSourceConfig</h5></div>
<div class="card-header d-flex">
<h5 class="mb-0">데이터소스 설정(dataSourceConfig)</h5>
<div class="ms-auto">
<button type="button" class="btn btn-sm btn-success" @click.prevent="addDataSource">추가</button>
<button type="button" class="btn btn-sm btn-danger ms-2" @click.prevent="deleteDataSource">삭제</button>
</div>
</div>
<div class="card-body">
<table class="table table-striped table-bordered align-middle">
<thead>
<tr>
<th scope="col" class="text-center">선택</th>
<th scope="col" class="text-center">dataSourceId</th>
<th scope="col" class="text-center">driverClassName</th>
<th scope="col" class="text-center">url</th>
@ -239,19 +363,20 @@ defineExpose({
</thead>
<tbody class="table-group-divider">
<tr v-if="agentConfig.dataSourceConfig.length > 0" v-for="dataSource in agentConfig.dataSourceConfig" :key="dataSource.dataSourceId">
<td scope="row">{{ dataSource.dataSourceId }}</td>
<td>{{ dataSource.driverClassName }}</td>
<td>{{ dataSource.url }}</td>
<td>{{ dataSource.username }}</td>
<td>{{ dataSource.password }}</td>
<td>{{ dataSource.initialSize }}</td>
<td>{{ dataSource.minIdle }}</td>
<td>{{ dataSource.maxIdle }}</td>
<td>{{ dataSource.maxTotal }}</td>
<td>{{ dataSource.maximumRowForTransaction }}</td>
<td scope="row" class="text-center"><input type="checkbox" class="form-check-input" v-model="dataSource.selected" /></td>
<td><input type="text" class="form-control" v-model="dataSource.dataSourceId" /></td>
<td><input type="text" class="form-control" v-model="dataSource.driverClassName" /></td>
<td><input type="text" class="form-control" v-model="dataSource.url" /></td>
<td><input type="text" class="form-control" v-model="dataSource.username" /></td>
<td><input type="password" class="form-control" v-model="dataSource.password" /></td>
<td><input type="number" class="form-control" v-model="dataSource.initialSize" /></td>
<td><input type="number" class="form-control" v-model="dataSource.minIdle" /></td>
<td><input type="number" class="form-control" v-model="dataSource.maxIdle" /></td>
<td><input type="number" class="form-control" v-model="dataSource.maxTotal" /></td>
<td><input type="number" class="form-control" v-model="dataSource.maximumRowForTransaction" /></td>
</tr>
<tr v-else>
<td scope="row" class="text-center" colspan="10">no dataSource.</td>
<td scope="row" class="text-center" colspan="11">no dataSource.</td>
</tr>
</tbody>
</table>
@ -303,18 +428,42 @@ defineExpose({
</div>
</div>
</div>
<h6>logging packages</h6>
<table class="table table-striped table-bordered align-middle" v-for="loggingPackages in agentConfig.logging.packages">
<div class="d-flex">
<h6 class="mb-0">logging packages</h6>
<div class="ms-auto">
<button type="button" class="btn btn-sm btn-success" @click.prevent="addLoggingPackage">추가</button>
<button type="button" class="btn btn-sm btn-danger ms-2" @click.prevent="deleteLoggingPackage">삭제</button>
</div>
</div>
<table class="table table-striped table-bordered align-middle">
<thead>
<tr>
<th>package</th>
<th>level</th>
<th scope="col" class="text-center">선택</th>
<th scope="col" class="text-center">package</th>
<th scope="col" class="text-center">level</th>
</tr>
</thead>
<tbody class="table-group-divider">
<tr v-for="(value, key) in loggingPackages">
<td>{{ key }}</td>
<td>{{ value }}</td>
<tr v-if="agentConfig.logging.packages.length > 0" v-for="(loggingPackage, rowIndex) in agentConfig.logging.packages">
<td scope="row" class="text-center"><input type="checkbox" class="form-check-input" /></td>
<template v-for="(level, packageName) in loggingPackage" :key="packageName">
<td>
<input type="text" class="form-control" :value="packageName" @change="changeLoggingPackageName(loggingPackage, packageName, $event.target.value)" />
</td>
<td>
<select class="form-select" v-model="loggingPackage[packageName]">
<option value="TRACE">TRACE</option>
<option value="DEBUG">DEBUG</option>
<option value="INFO">INFO</option>
<option value="WARN">WARN</option>
<option value="ERROR">ERROR</option>
<option value="OFF">OFF</option>
</select>
</td>
</template>
</tr>
<tr v-else>
<td scope="row" class="text-center" colspan="3">no logging packages.</td>
</tr>
</tbody>
</table>

22
src/main/front/src/components/MessageDataView.vue
Unescape View File

@ -24,16 +24,22 @@ onMounted(() => {
})
onBeforeUnmount(() => {
if (bsModal) {
bsModal.hide()
dataList.value = []
columnList.value = []
// Bootstrap v5에서는 dispose 지원
if (typeof bsModal.dispose === 'function') {
bsModal.dispose()
if (!bsModal) return
const instance = bsModal
const el = instance._element || modalEl.value
if (el) {
el.addEventListener(
'hidden.bs.modal',
() => {
if (typeof instance.dispose === 'function') {
instance.dispose()
}
bsModal = null
},
{ once: true },
)
instance.hide()
}
bsModal = null
})
function open() {

Write Preview
Loading…
Cancel
Save