monaco 관련 수정

This commit is contained in:
yunjy
2022-02-14 10:35:06 +09:00
parent f6ce3f545e
commit e1f0867df9
2 changed files with 114 additions and 11 deletions
@@ -54,9 +54,15 @@ public class ApiInfo implements Serializable {
@Positive
private Integer sleepSeconds;
@Column(length = 50)
private String syntaxResponseBody1;
@Column(length = 5000)
private String responseBody1;
@Column(length = 50)
private String syntaxResponseBody2;
@Column(length = 5000)
private String responseBody2;
@@ -156,12 +162,39 @@ public class ApiInfo implements Serializable {
this.responseBody2 = responseBody2;
}
public String getSyntaxResponseBody1() {
return syntaxResponseBody1;
}
public void setSyntaxResponseBody1(String syntaxResponseBody1) {
this.syntaxResponseBody1 = syntaxResponseBody1;
}
public String getSyntaxResponseBody2() {
return syntaxResponseBody2;
}
public void setSyntaxResponseBody2(String syntaxResponseBody2) {
this.syntaxResponseBody2 = syntaxResponseBody2;
}
@Override
public String toString() {
return "ApiInfo [id=" + id + ", apiGroupName=" + apiGroupName + ", apiName=" + apiName + ", url=" + url
+ ", serviceValue=" + serviceValue + ", method=" + method + ", responseContentType="
+ responseContentType + ", responseHeaders=" + responseHeaders + ", responseStatusCode="
+ responseStatusCode + ", sleepSeconds=" + sleepSeconds + ", responseBody1=" + responseBody1
+ ", responseBody2=" + responseBody2 + "]";
return "ApiInfo{" +
"id=" + id +
", apiGroupName='" + apiGroupName + '\'' +
", apiName='" + apiName + '\'' +
", url='" + url + '\'' +
", serviceValue='" + serviceValue + '\'' +
", method='" + method + '\'' +
", responseContentType='" + responseContentType + '\'' +
", responseHeaders='" + responseHeaders + '\'' +
", responseStatusCode=" + responseStatusCode +
", sleepSeconds=" + sleepSeconds +
", syntaxResponseBody1='" + syntaxResponseBody1 + '\'' +
", responseBody1='" + responseBody1 + '\'' +
", syntaxResponseBody2='" + syntaxResponseBody2 + '\'' +
", responseBody2='" + responseBody2 + '\'' +
'}';
}
}
@@ -27,7 +27,7 @@
<!-- Main content -->
<section class="content">
<div class="container-fluid">
<form class="inputForm" action="#" th:action="@{/manage/saveApi}"
<form id="form" class="inputForm" action="#" th:action="@{/manage/saveApi}"
th:object="${apiInfo}" method="post">
<div class="card card-default">
<div class="card-header">
@@ -153,13 +153,40 @@
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group row">
<label class="col-sm-3 col-form-label">Syntax 응답 Body1</label>
<div class="col-sm-9">
<select th:field="*{syntaxResponseBody1}" th:value="*{syntaxResponseBody1}">
<option th:value="'plaintext'" th:text="TEXT"></option>
<option th:value="'json'" th:text="JSON"></option>
<option th:value="'xml'" th:text="XML"></option>
</select>
</div>
</div>
</div>
<div class="col-md-6">
<div class="form-group row">
<label class="col-sm-3 col-form-label">Syntax 응답 Body2</label>
<div class="col-sm-9">
<select th:field="*{syntaxResponseBody2}" th:value="*{syntaxResponseBody2}">
<option th:value="'plaintext'" th:text="TEXT"></option>
<option th:value="'json'" th:text="JSON"></option>
<option th:value="'xml'" th:text="XML"></option>
</select>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group row">
<label class="col-sm-3 col-form-label">응답 Body1</label>
<div class="col-sm-9">
<textarea class="form-control" th:field="*{responseBody1}"
rows="3"></textarea>
<div id="responseBody1" style="height:400px"></div>
<!-- <textarea class="form-control" th:field="*{responseBody1}"-->
<!-- rows="3"></textarea>-->
</div>
</div>
</div>
@@ -167,8 +194,9 @@
<div class="form-group row">
<label class="col-sm-3 col-form-label">응답 Body2</label>
<div class="col-sm-9">
<textarea class="form-control" th:field="*{responseBody2}"
rows="3"></textarea>
<!-- <textarea class="form-control" th:field="*{responseBody2}"-->
<!-- rows="3"></textarea>-->
<div id="responseBody2" style="height:400px"></div>
</div>
</div>
</div>
@@ -186,8 +214,50 @@
</div>
<th:block layout:fragment="script">
<link rel="stylesheet" data-name="vs/editor/editor.main"
th:href="@{/plugins/vs/editor/editor.main.css}">
<script>var require = { paths: { 'vs': '../../plugins/vs' } };</script>
<script th:src="@{/plugins/vs/loader.js}"></script>
<script th:src="@{/plugins/vs/editor/editor.main.nls.js}"></script>
<script th:src="@{/plugins/vs/editor/editor.main.js}"></script>
<script th:inline="javascript">
var urlForSidebar = "/manage/findAllApis";
function setMonaco(elementId, selectId, initValue){
var targetDivElement = document.getElementById(elementId);
var lang = $("#"+selectId+" option:selected").val();
var editor = monaco.editor.create(targetDivElement, {
value: initValue,
language: lang,
minimap: {
enabled: false
},
wordWrap: 'on',
wrappingStrategy: 'simple',
wordWrapBreakAfterCharacters: '',
wordWrapBreakBeforeCharacters: '',
wrappingIndent: 'none',
automaticLayout: true
});
$("#"+selectId).change(function(){
var selectLang = $("#"+selectId+" option:selected").val();
monaco.editor.setModelLanguage(editor.getModel(), selectLang);
});
$('#form').submit(function(eventObj) {
$("<input />").attr("type", "hidden")
.attr("name", elementId)
.attr("value", editor.getValue())
.appendTo("#form");
return true;
});
}
setMonaco('responseBody1', 'syntaxResponseBody1', [[${apiInfo.responseBody1}]]);
setMonaco('responseBody2', 'syntaxResponseBody2', [[${apiInfo.responseBody2}]]);
</script>
</th:block>
</html>