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

탭 UI 변경

Browse Source
This commit is contained in:
현성필
2023-05-09 10:33:47 +09:00
parent a5e6541579
commit 6f6b9cde1d
1 changed files with 22 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/templates/page/routes/mockRouteEdit.html
+22 -30
View File
@@ -47,19 +47,7 @@
<label for="pathPattern" class="must">Path</label>
</div>
</div>
</div>
</div>
<div class="card mt-2">
<div class="card-header">
<div class="d-flex justify-content-between">
<h5>응답</h5>
<button type="button" class="btn btn-sm btn-primary btn_add_case"><i
class="fa-sharp fa-solid fa-plus"></i>케이스 추가
</button>
</div>
</div>
<div class="card-body" >
<div id="responses">
<div id="responses" class="mt-1">
<div class="row" th:each="response, status: *{responses}">
<input type="number" th:field="*{responses[__${status.index}__].statusCode}" required/>
<textarea th:field="*{responses[__${status.index}__].body}"></textarea>
@@ -86,8 +74,6 @@
</div>
</div>
<ul class="nav nav-tabs" id="responseTabTitle" role="tablist">
<li class="nav-item" role="presentation">
</li>
</ul>
<div class="tab-content" id="responseTabContent">
</div>
@@ -102,17 +88,6 @@
</form>
<div id="template" style="visibility: hidden; height: 0;">
<div class="tab-pane" role="tabpanel">
<!-- <div class="card mt-1">-->
<!-- <div class="card-header">-->
<!-- <div class="d-flex justify-content-between">-->
<!-- <span class="condition_name"></span>-->
<!-- <button type="button" class="btn btn-secondary btn-sm btn_remove_case">제거</button>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="card-body">-->
<!-- -->
<!-- </div>-->
<!-- </div>-->
<div class="row mt-1">
<div class="col-md condition">
<div class="card">
@@ -246,6 +221,12 @@
controller.addResponse();
});
$('#responseTabTitle').on('click', 'button', function () {
if ($(this).hasClass('btn_add_case')) {
controller.addResponse();
}
});
$('#responseTabContent').on('click', 'button', function () {
if ($(this).hasClass('btn_remove_case')) {
controller.removeResponse($(this).attr("data-id"));
@@ -410,10 +391,19 @@
$('#responseTabContent').append(nodeCopy);
}
console.log('#responseTabTitle li:eq(' + view.currentIdx + ') a');
console.log("render: " + view.currentIdx);
let tabButton = $('<button>').attr('class', 'nav-link btn_add_case')
.attr('type', 'button')
.attr('aria-selected', 'false')
.text("케이스 추가");
let li = $('<li>').attr('class', 'nav-item')
.attr('role','presentation')
.append(tabButton);
$('#responseTabTitle').append(li);
$('#responseTabTitle li:eq(' + view.currentIdx + ') a').tab('show');
// console.log(model);
}
};
@@ -429,6 +419,8 @@
body: '',
conditions: [],
});
view.currentIdx = model.responses.length - 1;
view.render();
},
removeResponse: function (idx) {
@@ -437,7 +429,7 @@
return;
}
model.responses.splice(idx, 1);
view.currentIdx = 0;
view.currentIdx = idx - 1;
view.render();
},
addResponseCondition: function (idx) {