djb-eapim/elink-test-master
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Socket Client UI 기본 골격 작성

Browse Source
This commit is contained in:
현성필
2024-04-17 22:03:02 +09:00
parent 95924af31a
commit 7d97628d38
27 changed files with 2244 additions and 570 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ApiTestManager/src/APITester.js
+74 -499
View File
@@ -1,9 +1,10 @@
import * as monaco from 'monaco-editor';
import APIClient from './APIClient';
import EditableInput from './components/EditableInput';
import {createPopper} from '@popperjs/core/lib/popper-lite';
import PropertyTable from './components/PropertyTable';
import VariableSnippet from './components/VariableSnippet';
import HTTPClientView from './components/HTTPClientView';
import TCPClientView from './components/TCPClientView';
import ServerManager from './components/ServerManager';
class APITester {
@@ -25,6 +26,7 @@ class APITester {
this.popperContent = document.getElementById('popperContent');
this.popperInstance = null;
this.contextPath = contextPath || '/';
}
getCollectionListURL() {
@@ -51,281 +53,6 @@ class APITester {
return this.contextPath + `mgmt/collections/${collectionId}/apis/delete.do`;
}
renderServers(selectedServer) {
const optionsHtml = this.servers.map(server => `<option value="${server.id}" ${selectedServer === server.id ? 'selected' : ''} data-path="${server.basePath}">${server.name}</option>`).join('');
return `<select class="form-select server" name="server" style="width: 180px; border-radius: 0;" required>
<option value="">서버 선택</option>
${optionsHtml}</select>`;
}
basePath(serverId) {
if (serverId === undefined || serverId === null || serverId === '') {
return '';
}
return this.servers.filter(server => server.id == serverId)[0].basePath; // == : 타입 비교 없이 값만 비교
}
httpApiRequestTemplate(apiRequest, index) {
return `
<div class="tab-pane fade mt-1 api_request" id="api_request_${apiRequest.id}" style="height: 100%;">
<div><span class="collection_name">${apiRequest.collectionName}</span> &gt; <span class="api_name">${apiRequest.name}</span></div>
<div class="d-flex api_request_info">
<div class="form-floating">
<select name="method" class="form-select method" style="width: 90px; border-bottom-right-radius: 0;border-top-right-radius: 0;">
<option value="POST" ${apiRequest.method === 'POST' ? 'selected' : ''}>POST</option>
<option value="GET" ${apiRequest.method === 'GET' ? 'selected' : ''}>GET</option>
<option value="PUT" ${apiRequest.method === 'PUT' ? 'selected' : ''}>PUT</option>
<option value="DELETE" ${apiRequest.method === 'DELETE' ? 'selected' : ''}>DELETE</option>
<option value="CONNECT" ${apiRequest.method === 'CONNECT' ? 'selected' : ''}>CONNECT</option>
<option value="HEAD" ${apiRequest.method === 'HEAD' ? 'selected' : ''}>HEAD</option>
<option value="OPTIONS" ${apiRequest.method === 'OPTIONS' ? 'selected' : ''}>OPTIONS</option>
<option value="TRACE" ${apiRequest.method === 'TRACE' ? 'selected' : ''}>TRACE</option>
<option value="PATCH" ${apiRequest.method === 'PATCH' ? 'selected' : ''}>PATCH</option>
</select>
<label class="form-label must">Method</label>
</div>
<div class="form-floating">
${this.renderServers(apiRequest.server)}
<label class="form-label must">Server</label>
</div>
<div class="form-floating">
<input type="text" name="basePath" class="form-control" style="width: 180px; border-radius: 0" value="${this.basePath(apiRequest.server)}" readonly>
<label class="must">기본 경로</label>
</div>
<div class="form-floating editableInput me-1 path" data-name="path" data-label="Path">
<label>Path</label>
</div>
<button class="btn btn-primary send me-1">Send</button>
<button class="btn btn-primary save" data-index="${index}" style="height: 58px;">저장</button>
</div>
<div class="api_request d-flex flex-column" style="height:100%;">
<div class="api_request_body">
<ul class="nav nav-tabs mt-1" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link btn_request_body_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="requestBody" data-bs-target="#requestBodyTab_${apiRequest.id}"
aria-selected="false">Body
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link btn_request_param_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="paramTab" data-bs-target="#requestParamTab_${apiRequest.id}"
aria-selected="true">Param
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link btn_request_header_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="requestHeader" data-bs-target="#requestHeaderTab_${apiRequest.id}"
aria-selected="false">Header
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link btn_prerequest_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="preScrit" data-bs-target="#preRequestTab_${apiRequest.id}"
aria-selected="false">Pre-Request
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link btn_postrequest_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="postScript" data-bs-target="#postRequestTab_${apiRequest.id}"
aria-selected="false">Post-Request
</button>
</li>
</ul>
<div class="tab-content" style="height: 100%;">
<div class="tab-pane fade show request_param_tab" role="tabpanel" id="requestParamTab_${apiRequest.id}" aria-labelledby="requestParams-tab">
<div class="query_params">
</div>
</div>
<div class="tab-pane fade request_header_tab" role="tabpanel" id="requestHeaderTab_${apiRequest.id}"
aria-labelledby="requestHeader-tab">
<div class="request_headers">
</div>
</div>
<div class="tab-pane fade request_body_tab" role="tabpanel" id="requestBodyTab_${apiRequest.id}" aria-labelledby="requestBody-tab">
<div class="d-flex flex-column">
<select class="form-select mt-1 request_body_type" name="request_type">
<option value="json">json</option>
<option value="xml">xml</option>
<option value="">text/plain</option>
</select>
<div class="request_body mt-1" style="width:100%;height: 300px; border:1px solid grey;"></div>
</div>
</div>
<div class="tab-pane fade pre_script_tab" role="tabpanel" id="preRequestTab_${apiRequest.id}" aria-labelledby="preScrit-tab">
<div class="d-flex flex-row">
<div style="width:calc(100% - 200px);">
<div class="pre-request mt-1" style="height:300px;border:1px solid grey;"></div>
</div>
<div style="width: 200px;">
<div class="pre-request-variable">
</div>
</div>
</div>
</div>
<div class="tab-pane fade post_script_tab" role="tabpanel" id="postRequestTab_${apiRequest.id}"
aria-labelledby="postScrit-tab">
<div class="d-flex flex-row">
<div style="width:calc(100% - 200px);">
<div class="post-request mt-1" style="height:300px;border:1px solid grey;"></div>
</div>
<div style="width: 200px;">
<div class="post-request-variable">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="api_response" style="flex: 1">
<div class="mt-1">
<span>Response</span>
<span class="response_status"></span>
<span class="response_time"></span>
<span class="response_size"></span>
</div>
<ul class="nav nav-tabs mt-1" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" data-bs-toggle="tab" data-bs-target="#responseBodyTab_${apiRequest.id}" type="button" role="tab" aria-controls="responseBody" aria-selected="false">Body</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#responseHeaderTab_${apiRequest.id}" type="button" role="tab" aria-controls="responseHeader" aria-selected="false">Header</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#consoleTab_${apiRequest.id}" type="button" role="tab" aria-controls="consoleTab" aria-selected="false">Console</button>
</li>
</ul>
<div class="tab-content border-bottom" style="min-height: 250px;">
<div class="tab-pane fade show active" id="responseBodyTab_${apiRequest.id}" role="tabpanel"
aria-labelledby="responseParams-tab">
<div class="response_body mt-1" style="width:100%;height:250px;border:1px solid grey;"></div>
</div>
<div class="tab-pane fade" id="responseHeaderTab_${apiRequest.id}" role="tabpanel"
aria-labelledby="responseParams-tab">
<table class="table">
<thead>
<tr>
<th scope="col">이름</th>
<th scope="col">값</th>
</tr>
</thead>
<tbody class="response_headers">
</tbody>
</table>
</div>
<div class="tab-pane fade" id="consoleTab_${apiRequest.id}" role="tabpanel"
aria-labelledby="console-tab">
<div class="console mt-1" style="width:100%;height:250px;border:1px solid grey;"></div>
</div>
</div>
</div>
</div>
</div>
`;
}
tcpApiRequestTemplate(apiRequest, index) {
return `
<div class="tab-pane fade mt-1 api_request" id="api_request_${apiRequest.id}" style="height: 100%;">
<div><span class="collection_name">${apiRequest.collectionName}</span> &gt; <span class="api_name">${apiRequest.name}</span></div>
<div class="d-flex api_request_info">
<div class="form-floating">
${this.renderServers(apiRequest.server)}
<label class="form-label must">Server</label>
</div>
<button class="btn btn-primary send me-1">Send</button>
<button class="btn btn-primary save" data-index="${index}" style="height: 58px;">저장</button>
</div>
<div class="api_request d-flex flex-column" style="height:100%;">
<div class="api_request_body">
<ul class="nav nav-tabs mt-1" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link btn_request_body_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="requestBody" data-bs-target="#requestBodyTab_${apiRequest.id}"
aria-selected="false">Body
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link btn_prerequest_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="preScrit" data-bs-target="#preRequestTab_${apiRequest.id}"
aria-selected="false">Pre-Request
</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link btn_postrequest_tab" data-bs-toggle="tab"
type="button" role="tab" aria-controls="postScript" data-bs-target="#postRequestTab_${apiRequest.id}"
aria-selected="false">Post-Request
</button>
</li>
</ul>
<div class="tab-content" style="height: 100%;">
<div class="tab-pane fade request_body_tab" role="tabpanel" id="requestBodyTab_${apiRequest.id}" aria-labelledby="requestBody-tab">
<div class="d-flex flex-column">
<select class="form-select mt-1 request_body_type" name="request_type">
<option value="">text/plain</option>
</select>
<div class="request_body mt-1" style="width:100%;height: 300px; border:1px solid grey;"></div>
</div>
</div>
<div class="tab-pane fade pre_script_tab" role="tabpanel" id="preRequestTab_${apiRequest.id}" aria-labelledby="preScrit-tab">
<div class="d-flex flex-row">
<div style="width:calc(100% - 200px);">
<div class="pre-request mt-1" style="height:300px;border:1px solid grey;"></div>
</div>
<div style="width: 200px;">
<div class="pre-request-variable">
</div>
</div>
</div>
</div>
<div class="tab-pane fade post_script_tab" role="tabpanel" id="postRequestTab_${apiRequest.id}"
aria-labelledby="postScrit-tab">
<div class="d-flex flex-row">
<div style="width:calc(100% - 200px);">
<div class="post-request mt-1" style="height:300px;border:1px solid grey;"></div>
</div>
<div style="width: 200px;">
<div class="post-request-variable">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="api_response" style="flex: 1">
<div class="mt-1">
<span>Response</span>
<span class="response_status"></span>
<span class="response_time"></span>
<span class="response_size"></span>
</div>
<ul class="nav nav-tabs mt-1" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" data-bs-toggle="tab" data-bs-target="#responseBodyTab_${apiRequest.id}" type="button" role="tab" aria-controls="responseBody" aria-selected="false">Body</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#consoleTab_${apiRequest.id}" type="button" role="tab" aria-controls="consoleTab" aria-selected="false">Console</button>
</li>
</ul>
<div class="tab-content border-bottom" style="min-height: 250px;">
<div class="tab-pane fade show active" id="responseBodyTab_${apiRequest.id}" role="tabpanel"
aria-labelledby="responseParams-tab">
<div class="response_body mt-1" style="width:100%;height:250px;border:1px solid grey;"></div>
</div>
<div class="tab-pane fade" id="consoleTab_${apiRequest.id}" role="tabpanel"
aria-labelledby="console-tab">
<div class="console mt-1" style="width:100%;height:250px;border:1px solid grey;"></div>
</div>
</div>
</div>
</div>
</div>
`;
}
headerTemplate(header, index) {
return `
<tr data-index="${index}">
@@ -402,6 +129,7 @@ class APITester {
$('.toast').toast('show');
}
}
this.serverManager = new ServerManager(this.servers);
this.bindEvents();
this.loadCollections();
}
@@ -424,8 +152,7 @@ class APITester {
{selector: '.delete_api_request', action: this.showDeleteApiRequestModal.bind(this)},
{selector: '.open_api_request', action: this.openApiRequest.bind(this)},
{selector: '.confirm_delete_api', action: this.deleteApiRequest.bind(this)},
{selector: '.close_tab', action: this.closeTab.bind(this)}
];
{selector: '.close_tab', action: this.closeTab.bind(this)}];
for (let event of events) {
$(document).on('click', event.selector, event.action);
@@ -601,7 +328,7 @@ class APITester {
const tabIndex = $('#apiRequestTabContent').children().index($(event.currentTarget).closest('.api_request'));
let model = this.apiRequests[tabIndex];
let target = $('#api_request_' + model.id);
target.find('input[name="basePath"]').val(this.basePath(model.server));
target.find('input[name="basePath"]').val(this.serverManager.basePath(model.server));
}
renderHeaders(headers) {
@@ -633,12 +360,10 @@ class APITester {
placement: 'bottom', // Popper below the element
modifiers: [
{
name: 'offset',
options: {
name: 'offset', options: {
offset: [0, 8] // Adjust the position if needed
}
}
]
}]
});
}
@@ -655,87 +380,36 @@ class APITester {
let apiRequestTabContent = $(this.apiTabContentTarget);
let model = this.apiRequests[index];
if (model.type ==='HTTP'){
apiRequestTabContent.append(this.httpApiRequestTemplate(model, index));
let editableInput = new EditableInput({
name: 'path',
value: model.path
});
let queryParamTable = new PropertyTable({
propertyName: 'queryParams',
properties: model.queryParams
});
let headerTable = new PropertyTable({
propertyName: 'headers',
properties: model.headers
});
apiRequestTabContent.find(`#api_request_${model.id}`).find('.api_request_info').find('.path').each(function() {
editableInput.init(this, (value) => {
model.path = value;
model.queryParams = me.parseParam(model.path);
queryParamTable.setProperties(model.queryParams);
$('span.variable').off('mouseover');
$('span.variable').off('mouseout');
document.querySelectorAll('span.variable').forEach(element => {
let text = element.innerText;
element.addEventListener('mouseover', () => me.showPopper(element, text));
element.addEventListener('mouseout', () => me.hidePopper(element));
});
});
$(this).append(`<label>Path</label>`);
$('span.variable').off('mouseover');
$('span.variable').off('mouseout');
});
queryParamTable.init(apiRequestTabContent.find(`#api_request_${model.id}`).find('.query_params')[0], (properties) => {
model.queryParams = properties;
console.log(model.queryParams);
this.buildPath(model);
editableInput.setValue(model.path);
$('span.variable').off('mouseover');
$('span.variable').off('mouseout');
document.querySelectorAll('span.variable').forEach(element => {
let text = element.innerText;
element.addEventListener('mouseover', () => me.showPopper(element, text));
element.addEventListener('mouseout', () => me.hidePopper(element));
});
});
headerTable.init(apiRequestTabContent.find(`#api_request_${model.id}`).find('.request_headers')[0], (properties) => {
model.headers = properties;
$('span.variable').off('mouseover');
$('span.variable').off('mouseout');
document.querySelectorAll('span.variable').forEach(element => {
let text = element.innerText;
element.addEventListener('mouseover', () => me.showPopper(element, text));
element.addEventListener('mouseout', () => me.hidePopper(element));
});
});
}
if (model.type ==='TCP'){
apiRequestTabContent.append(this.tcpApiRequestTemplate(model, index));
}
document.querySelectorAll('.variable').forEach(element => {
let text = element.innerText;
element.addEventListener('mouseover', () => me.showPopper(element, text));
element.addEventListener('mouseout', () => me.hidePopper(element));
});
let language = model.type === 'HTTP' ? 'json' : 'text';
this.openTab(model.id);
let target = $('#api_request_' + model.id);
let language = model.type ==='TCP'? 'text': 'json';
let target = null;
let requestBodyEditor = null;
let requestBodyEditor = monaco.editor.create(target.find('.request_body')[0], {
value: model.requestBody,
language: language,
automaticLayout: true
});
if (model.type === 'HTTP') {
let httpClientView = new HTTPClientView(me, this.serverManager, apiRequestTabContent, model);
httpClientView.init();
this.openTab(model.id);
target = $('#api_request_' + model.id);
requestBodyEditor = monaco.editor.create(target.find('.request_body')[0], {
value: model.requestBody, language: 'json', automaticLayout: true
});
}
if (model.type === 'TCP') {
const tcpClientView = new TCPClientView(me, this.serverManager, apiRequestTabContent, model);
tcpClientView.init();
this.openTab(model.id);
target = $('#api_request_' + model.id);
requestBodyEditor = monaco.editor.create(target.find('.request_body')[0], {
value: model.requestBody, language: 'text', automaticLayout: false
});
tcpClientView.setRequestBodyEditor(requestBodyEditor);
}
requestBodyEditor.onMouseMove((e) => {
let position = e.target.position;
@@ -768,27 +442,19 @@ class APITester {
});
let responseBodyEditor = monaco.editor.create(target.find('.response_body')[0], {
value: '',
language: language,
automaticLayout: true,
quickSuggestions: false
value: '', language: language, automaticLayout: true, quickSuggestions: false
});
me.responseEditors.push(responseBodyEditor);
let consoleEditor = monaco.editor.create(target.find('.console')[0], {
value: '',
automaticLayout: true,
quickSuggestions: false
value: '', automaticLayout: true, quickSuggestions: false
});
me.consoleEditors.push(consoleEditor);
let preRequestEditor = monaco.editor.create(target.find('.pre-request')[0], {
value: model.preRequestScript,
language: 'javascript',
automaticLayout: true,
quickSuggestions: false
value: model.preRequestScript, language: 'javascript', automaticLayout: true, quickSuggestions: false
});
const snippet1 = new VariableSnippet();
@@ -804,10 +470,7 @@ class APITester {
});
let postRequestEditor = monaco.editor.create(target.find('.post-request')[0], {
value: model.postRequestScript,
language: 'javascript',
automaticLayout: true,
quickSuggestions: false
value: model.postRequestScript, language: 'javascript', automaticLayout: true, quickSuggestions: false
});
const snippet2 = new VariableSnippet();
@@ -874,12 +537,10 @@ class APITester {
}
$('li .api_request_sortable').draggable({
helper: this.customHelper,
start: function(event, ui) {
helper: this.customHelper, start: function(event, ui) {
// You can add any additional data or styles you want when dragging starts
$(this).addClass('dragging');
},
stop: function(event, ui) {
}, stop: function(event, ui) {
// Clean up, e.g., remove styles or data
$(this).removeClass('dragging');
}
@@ -907,9 +568,7 @@ class APITester {
const tabIndex = $('#apiRequestTabContent').children().index($(event.currentTarget).closest('.api_request'));
let model = this.apiRequests[tabIndex];
model.headers.push({
enabled: true,
key: '',
value: ''
enabled: true, key: '', value: ''
});
this.renderHeaderView(tabIndex);
}
@@ -938,32 +597,14 @@ class APITester {
let queryParam = queryParamArray[i].split('=');
queryParams.push({
enabled: true,
key: queryParam[0],
value: (queryParam[1] === undefined ? '' : queryParam[1])
enabled: true, key: queryParam[0], value: (queryParam[1] === undefined ? '' : queryParam[1])
});
}
}
console.log(queryParams);
return queryParams;
}
buildPath(model) {
let queryString = model.path.split('?')[0];
if (model.queryParams.length > 0) {
queryString += '?';
}
for (let i = 0; i < model.queryParams.length; i++) {
if (!model.queryParams[i].enabled) {
continue;
}
queryString += model.queryParams[i].key + '=' + model.queryParams[i].value;
if (i < model.queryParams.length - 1) {
queryString += '&';
}
}
model.path = queryString;
}
showLoadingOverlay() {
$('#loading-overlay').show();
}
@@ -998,11 +639,7 @@ class APITester {
model.responseModel.time = endTime - startTime;
} else {
model.responseModel = {
status: 0,
time: 0,
size: 0,
headers: [],
body: ''
status: 0, time: 0, size: 0, headers: [], body: ''
};
}
@@ -1022,10 +659,7 @@ class APITester {
message = JSON.stringify(message, null, 2);
}
var op = {
identifier: id,
range: range,
text: message + '\n',
forceMoveMarkers: true
identifier: id, range: range, text: message + '\n', forceMoveMarkers: true
};
console.executeEdits('my-source', [op]);
}
@@ -1033,23 +667,18 @@ class APITester {
loadCollections() {
const me = this;
this.currentAjaxRequest = $.ajax({
url: this.getCollectionListURL(),
type: 'GET',
contentType: 'application/json',
success: function(data) {
url: this.getCollectionListURL(), type: 'GET', contentType: 'application/json', success: function(data) {
me.collections = data.map(collection => {
if (collection.apis) {
collection.apis = collection.apis.map(api => ({...api, collectionId: collection.id}));
}
return collection;
});
},
error: function(response, textStatus, errorThrown) {
}, error: function(response, textStatus, errorThrown) {
me.hideLoadingOverlay();
$('.toast-body').text(response.responseJSON.error);
$('.toast').toast('show');
},
complete: function() {
}, complete: function() {
me.renderCollections();
me.hideLoadingOverlay();
}
@@ -1061,16 +690,11 @@ class APITester {
const me = this;
me.showLoadingOverlay();
this.currentAjaxRequest = $.ajax({
url: this.getCollectionCreateURL(),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({name: name}),
error: function(response, textStatus, errorThrown) {
url: this.getCollectionCreateURL(), type: 'POST', contentType: 'application/json', data: JSON.stringify({name: name}), error: function(response, textStatus, errorThrown) {
me.hideLoadingOverlay();
$('.toast-body').text(response.responseJSON.error);
$('.toast').toast('show');
},
complete: function() {
}, complete: function() {
me.loadCollections();
me.hideLoadingOverlay();
$('#new_collection_modal').modal('hide');
@@ -1082,16 +706,11 @@ class APITester {
const me = this;
me.showLoadingOverlay();
this.currentAjaxRequest = $.ajax({
url: this.getCollectionUpdateURL(),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({id: id, name: name}),
error: function(response, textStatus, errorThrown) {
url: this.getCollectionUpdateURL(), type: 'POST', contentType: 'application/json', data: JSON.stringify({id: id, name: name}), error: function(response, textStatus, errorThrown) {
me.hideLoadingOverlay();
$('.toast-body').text(response.responseJSON.error);
$('.toast').toast('show');
},
complete: function() {
}, complete: function() {
me.loadCollections();
me.hideLoadingOverlay();
$('#new_collection_modal').modal('hide');
@@ -1104,18 +723,12 @@ class APITester {
const me = this;
me.showLoadingOverlay();
this.currentAjaxRequest = $.ajax({
url: this.getCollectionDeleteURL(),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({id: collectionId}),
success: function() {
},
error: function(response, textStatus, errorThrown) {
url: this.getCollectionDeleteURL(), type: 'POST', contentType: 'application/json', data: JSON.stringify({id: collectionId}), success: function() {
}, error: function(response, textStatus, errorThrown) {
me.hideLoadingOverlay();
$('.toast-body').text(response.responseJSON.error);
$('.toast').toast('show');
},
complete: function() {
}, complete: function() {
me.loadCollections();
me.hideLoadingOverlay();
$('#confirm_delete_modal').modal('hide');
@@ -1127,21 +740,15 @@ class APITester {
const me = this;
me.showLoadingOverlay();
this.currentAjaxRequest = $.ajax({
url: this.getAPISaveURL(model.collectionId),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(model),
success: function(data) {
url: this.getAPISaveURL(model.collectionId), type: 'POST', contentType: 'application/json', data: JSON.stringify(model), success: function(data) {
let message = '저장되었습니다.';
$('.toast-body').text(message);
$('.toast').toast('show');
},
error: function(response, textStatus, errorThrown) {
}, error: function(response, textStatus, errorThrown) {
me.hideLoadingOverlay();
$('.toast-body').text(response.responseJSON.error);
$('.toast').toast('show');
},
complete: function() {
}, complete: function() {
me.hideLoadingOverlay();
}
});
@@ -1154,21 +761,15 @@ class APITester {
me.showLoadingOverlay();
this.currentAjaxRequest = $.ajax({
url: this.getAPISaveURL(model.collectionId),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(model),
success: function(data) {
url: this.getAPISaveURL(model.collectionId), type: 'POST', contentType: 'application/json', data: JSON.stringify(model), success: function(data) {
let message = '저장되었습니다.';
$('.toast-body').text(message);
$('.toast').toast('show');
},
error: function(response, textStatus, errorThrown) {
}, error: function(response, textStatus, errorThrown) {
me.hideLoadingOverlay();
$('.toast-body').text(response.responseJSON.error);
$('.toast').toast('show');
},
complete: function() {
}, complete: function() {
me.hideLoadingOverlay();
}
});
@@ -1190,42 +791,26 @@ class APITester {
})[0];
let me = this;
let newApi = {
id: '',
server: null,
method: 'GET',
name: newApiName,
path: '',
type : newApiType,
headers: [],
queryParams: [],
requestBody: '',
preRequestScript: '',
postRequestScript: '',
collectionId: collectionId,
responseModel: {
status: 0,
time: 0,
size: 0,
headers: [],
ody: ''
id: '', server: null, method: 'GET', name: newApiName, path: '', type: newApiType, headers: [], queryParams: [], requestBody: '', preRequestScript: '', postRequestScript: '', collectionId: collectionId, responseModel: {
status: 0, time: 0, size: 0, headers: [], ody: ''
}
};
newApi.collectionName = collection.name;
if (newApiType === 'TCP') {
newApi.layout = [];
newApi.layout.push({layoutItems: []});
}
this.currentAjaxRequest = $.ajax({
url: this.getAPISaveURL(collectionId),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(newApi),
success: function(data) {
url: this.getAPISaveURL(collectionId), type: 'POST', contentType: 'application/json', data: JSON.stringify(newApi), success: function(data) {
newApi.id = data;
},
error: function(response, textStatus, errorThrown) {
}, error: function(response, textStatus, errorThrown) {
me.hideLoadingOverlay();
$('.toast-body').text(response.responseJSON.error);
$('.toast').toast('show');
},
complete: function() {
}, complete: function() {
me.loadCollections();
me.apiRequests.push(newApi);
me.currentIndex = me.apiRequests.length - 1;
@@ -1271,11 +856,7 @@ class APITester {
if (!selectedApi.responseModel) {
selectedApi.responseModel = {
status: 0,
time: 0,
size: 0,
headers: [],
body: ''
status: 0, time: 0, size: 0, headers: [], body: ''
};
}
@@ -1305,17 +886,11 @@ class APITester {
}
const me = this;
this.currentAjaxRequest = $.ajax({
url: this.getAPIDeleteURL(collectionId),
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({id: apiId}),
success: function(data) {
},
error: function(response, textStatus, errorThrown) {
url: this.getAPIDeleteURL(collectionId), type: 'POST', contentType: 'application/json', data: JSON.stringify({id: apiId}), success: function(data) {
}, error: function(response, textStatus, errorThrown) {
$('.toast-body').text(response.responseJSON.error);
me.hideLoadingOverlay();
},
complete: function() {
}, complete: function() {
me.hideLoadingOverlay();
me.loadCollections();
$('#confirm_delete_api_modal').modal('hide');