R11/release11-tools-mocked-services
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

your messages table with update, delete buttons

Browse Source
This commit is contained in:
Szakalakamaka
2020-09-11 10:01:30 +02:00
parent 13dd0642ab
commit 790f34a5e1
38 changed files with 310 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
target/classes/static/css/styles.css
View File

@@ -45,9 +45,7 @@ button:focus {
margin: 1px;
}
button[name="allMessagesClicked"] {
color: #00b3b3;
}
#pagination-wrapper button {
background: none;
@@ -56,6 +54,23 @@ button[name="allMessagesClicked"] {
transition: background-color 0.3s, color 0.3s;
}
button[name="removeMessage"]{
background: none;
border: none;
cursor: pointer;
transition: background-color 0.3s, color 0.3s;
}
button[name="updateMessage"]{
background: none;
border: none;
cursor: pointer;
transition: background-color 0.3s, color 0.3s;
}
button[name="allMessagesClicked"] {
color: #00b3b3;
}
button[name="removeHeader"] {
position: absolute;

24
target/classes/static/js/paggination.js
View File

@@ -1,5 +1,5 @@
var state = {
'querySet': ["dupa1", "sra", "na", "leb"],
'querySet': [{"clientUUID":"436c4774-038f-4540-9c18-2691ca9b53d4","mockedResponseId":1908998,"mediaType":"application/xml","messageBody":"body","httpHeaders":null,"httpStatus":200}],
'page': 1,
'rows': 10,
@@ -10,6 +10,7 @@ state.querySet = mockedMessageDtoList;
buildTable();
function pagination(querySet, page, rows) {
var trimStart = (page - 1) * rows
var trimEnd = trimStart + rows
var trimmedData = querySet.slice(trimStart, trimEnd)
@@ -75,7 +76,6 @@ function buildTable() {
var data = pagination(state.querySet, state.page, state.rows)
var myList = data.querySet
for(var i = 1; i<=myList.length; i++){
var j = i + (state.page-1) * 10;
if(i%2 === 0){
@@ -84,6 +84,16 @@ function buildTable() {
<td>${myList[i-1].mockedResponseId}</td>
<td>${myList[i-1].mediaType}</td>
<td>${myList[i-1].httpStatus}</td>
<td>
<button type="submit" name="updateMessage" value="${myList[i-1].mockedResponseId}">
<img src="/img/update-button.png" style="width: 20px;"/>
</button>
</td>
<td>
<button type="submit" name="removeMessage" value="${myList[i-1].mockedResponseId}">
<img src="/img/icons8-cancel-64.png" style="width: 20px;"/>
</button>
</td>
`
}else{
var row = `<tr bgcolor="#e6ffff">
@@ -91,6 +101,16 @@ function buildTable() {
<td>${myList[i-1].mockedResponseId}</td>
<td>${myList[i-1].mediaType}</td>
<td>${myList[i-1].httpStatus}</td>
<td>
<button type="submit" name="updateMessage" value="${myList[i-1].mockedResponseId}">
<img src="/img/update-button.png" style="width: 20px;"/>
</button>
</td>
<td>
<button type="submit" name="removeMessage" value="${myList[i-1].mockedResponseId}">
<img src="/img/icons8-cancel-64.png" style="width: 20px;"/>
</button>
</td>
`
}