요청 관리 -> variable 적용
This commit is contained in:
@@ -682,8 +682,6 @@ a.btn.btn-primary {
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.pt-links {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 5rem;
|
||||
display: block !important;
|
||||
height: calc(100vh - 7rem);
|
||||
@@ -809,8 +807,6 @@ a.btn.btn-primary {
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.pt-toc {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 5rem;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -115,6 +115,12 @@
|
||||
aria-selected="false">Header
|
||||
</button>
|
||||
</li>
|
||||
<li class="nav-item" role="presentation">
|
||||
<button class="nav-link btn_variables_tab" data-bs-toggle="tab"
|
||||
type="button" role="tab" aria-controls="variables"
|
||||
aria-selected="false">Variables
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content border-bottom" style="min-height: 300px;">
|
||||
<div class="tab-pane fade show request_param_tab" role="tabpanel"
|
||||
@@ -126,8 +132,7 @@
|
||||
<th scope="col">이름</th>
|
||||
<th>값</th>
|
||||
<th>
|
||||
<button type="button" class="btn btn-secondary btn-sm btn_add_query">추가
|
||||
</button>
|
||||
<button type="button" class="btn btn-secondary btn-sm btn_add_query">추가</button>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@@ -144,8 +149,7 @@
|
||||
<th scope="col">이름</th>
|
||||
<th scope="col">값</th>
|
||||
<th scope="col">
|
||||
<button type="button" class="btn btn-secondary btn-sm btn_add_header">추가
|
||||
</button>
|
||||
<button type="button" class="btn btn-secondary btn-sm btn_add_header">추가</button>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@@ -153,6 +157,24 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade variables_tab" role="tabpanel"
|
||||
aria-labelledby="variables-tab">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">키</th>
|
||||
<th scope="col">값</th>
|
||||
<th scope="col">
|
||||
<button type="button" class="btn btn-secondary btn-sm btn_add_variables">추가
|
||||
</button>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="variables">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="tab-pane fade request_body_tab" role="tabpanel"
|
||||
aria-labelledby="requestBody-tab">
|
||||
<select class="form-select mt-1 request_body_type" name="request_type">
|
||||
@@ -171,17 +193,10 @@
|
||||
</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" type="button" role="tab" aria-controls="responseBody"
|
||||
aria-selected="false">Body
|
||||
</button>
|
||||
<button class="nav-link active" data-bs-toggle="tab" data-bs-target="#responseBodyTab" 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" type="button" role="tab"
|
||||
aria-controls="responseHeader"
|
||||
aria-selected="false">Header
|
||||
</button>
|
||||
<button class="nav-link" data-bs-toggle="tab" data-bs-target="#responseHeaderTab" type="button" role="tab" aria-controls="responseHeader" aria-selected="false">Header</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content border-bottom" style="min-height: 250px;">
|
||||
@@ -365,6 +380,32 @@
|
||||
target.find('.path').val(model.path);
|
||||
|
||||
},
|
||||
renderVariables: function (tabIdx) {
|
||||
let target = $('#api_request_' + tabIdx);
|
||||
target.find('.variables').empty();
|
||||
|
||||
let model = apiRequests[tabIdx];
|
||||
for (let i = 0; i < model.variables.length; i++) {
|
||||
let template = $('#inputTemplate').children().find('tr').clone();
|
||||
if (model.variables[i].enabled) {
|
||||
template.find('input[name="enabled"]').prop("checked", model.variables[i].enabled);
|
||||
}
|
||||
template.find('input[name="key"]').val(model.variables[i].key);
|
||||
template.find('input[name="value"]').val(model.variables[i].value);
|
||||
template.find('button').attr("data-id", i);
|
||||
|
||||
template.find('input[name="enabled"]').on('change', function () {
|
||||
model.variables[i].enabled = $(this).prop('checked');
|
||||
});
|
||||
template.find('input[name="key"]').on('input', function () {
|
||||
model.variables[i].key = $(this).val();
|
||||
});
|
||||
template.find('input[name="value"]').on('input', function () {
|
||||
model.variables[i].value = $(this).val();
|
||||
});
|
||||
target.find('.variables').append(template);
|
||||
}
|
||||
},
|
||||
renderHeaders: function (tabIdx) {
|
||||
let target = $('#api_request_' + tabIdx);
|
||||
target.find('.request_headers').empty();
|
||||
@@ -437,9 +478,11 @@
|
||||
template.attr('class', 'tab-pane fade mt-1' + (idx === this.currentIdx ? ' show active' : ''));
|
||||
template.find('.btn_request_param_tab').attr('data-bs-target', "#requestParamTab_" + idx);
|
||||
template.find('.btn_request_header_tab').attr('data-bs-target', "#requestHeaderTab_" + idx);
|
||||
template.find('.btn_variables_tab').attr('data-bs-target', "#variablesTab_" + idx);
|
||||
template.find('.btn_request_body_tab').attr('data-bs-target', "#requestBodyTab_" + idx);
|
||||
|
||||
template.find('.request_header_tab').attr('id', "requestHeaderTab_" + idx);
|
||||
template.find('.variables_tab').attr('id', "variablesTab_" + idx);
|
||||
template.find('.request_param_tab').attr('id', "requestParamTab_" + idx);
|
||||
template.find('.request_body_tab').attr('id', "requestBodyTab_" + idx);
|
||||
template.find('.api_name').text(model.name);
|
||||
@@ -455,6 +498,10 @@
|
||||
controller.addQueryParam(idx, '', '');
|
||||
});
|
||||
|
||||
target.find('.btn_add_variables').click(function () {
|
||||
controller.addVariable(idx, '', '');
|
||||
});
|
||||
|
||||
target.find('input[name="basePath"]').val(target.find('select[name="server"] option:selected').data('path'));
|
||||
target.find('select[name="server"]').val(model.server);
|
||||
target.find('select[name="server"]').on('change', function () {
|
||||
@@ -479,6 +526,12 @@
|
||||
}
|
||||
});
|
||||
|
||||
target.find('.variables').on('click', 'button', function () {
|
||||
if ($(this).hasClass('btn_remove')) {
|
||||
controller.removeVariable(idx, $(this).data("id"));
|
||||
}
|
||||
});
|
||||
|
||||
target.find('.path').on('input', function () {
|
||||
model.path = $(this).val();
|
||||
model.queryParams = [];
|
||||
@@ -536,6 +589,7 @@
|
||||
target.find('.method').val(model.method);
|
||||
this.renderParam(idx);
|
||||
this.renderHeaders(idx);
|
||||
this.renderVariables(idx);
|
||||
this.openTab(view.currentIdx);
|
||||
},
|
||||
render: function () {
|
||||
@@ -681,6 +735,20 @@
|
||||
});
|
||||
view.renderParam(tabIdx);
|
||||
},
|
||||
addVariable: function (tabIdx, key, value) {
|
||||
let model = apiRequests[tabIdx];
|
||||
model.variables.push({
|
||||
key: key,
|
||||
value: value
|
||||
});
|
||||
view.renderVariables(tabIdx);
|
||||
},
|
||||
removeVariable: function (tabIdx, idx) {
|
||||
let model = apiRequests[tabIdx];
|
||||
model.variables.splice(idx, 1);
|
||||
this.buildPath(tabIdx);
|
||||
view.renderVariables(tabIdx);
|
||||
},
|
||||
buildPath: function (tabIdx) {
|
||||
let model = apiRequests[tabIdx];
|
||||
let queryString = model.path.split('?')[0];
|
||||
@@ -861,6 +929,7 @@
|
||||
path: '',
|
||||
headers: [],
|
||||
queryParams: [],
|
||||
variables: [],
|
||||
requestBody: '',
|
||||
collectionId : collectionId,
|
||||
responseModel: {
|
||||
|
||||
Reference in New Issue
Block a user