Clean frontend code
This commit is contained in:
@@ -37,7 +37,7 @@ public class RequestHistoryController {
|
||||
@PostMapping
|
||||
public ResponseEntity<List<RequestHistoryDTO>> filterHistory(@RequestBody HistoryRequestModel historyRequestModel){
|
||||
return ResponseEntity.ok(
|
||||
service.getHistoryRecordsBetweenDatesAndByUUIDAndMessageId(historyRequestModel)
|
||||
service.getHistoryRecordsBetweenDatesAndByUUID(historyRequestModel)
|
||||
.stream()
|
||||
.map(mapper::requestHistoryToRequestHistoryDTO)
|
||||
.collect(Collectors.toList())
|
||||
@@ -49,11 +49,11 @@ public class RequestHistoryController {
|
||||
* @param uuid unique id of message list
|
||||
* @return list of {@link RequestHistory}
|
||||
*/
|
||||
@GetMapping(path = "/{uuid}/{messageId}")
|
||||
@GetMapping(path = "/{uuid}")
|
||||
public ResponseEntity<List<RequestHistoryDTO>> getLastDay(@PathVariable UUID uuid){
|
||||
LocalDateTime requestTime = LocalDateTime.now();
|
||||
LocalDateTime dayBeforeRequest = requestTime.minusDays(1L);
|
||||
List<RequestHistoryDTO> requestHistory = service.getHistoryRecordsBetweenDatesAndByUUIDAndMessageId(
|
||||
List<RequestHistoryDTO> requestHistory = service.getHistoryRecordsBetweenDatesAndByUUID(
|
||||
HistoryRequestModel.builder()
|
||||
.localDateTimeFrom(dayBeforeRequest)
|
||||
.localDateTimeTo(requestTime)
|
||||
|
||||
@@ -18,6 +18,6 @@ public interface RequestHistoryService {
|
||||
* @param historyRequestModel object containing required data for request
|
||||
* @return list of {@link RequestHistory}
|
||||
*/
|
||||
List<RequestHistory> getHistoryRecordsBetweenDatesAndByUUIDAndMessageId(HistoryRequestModel historyRequestModel);
|
||||
List<RequestHistory> getHistoryRecordsBetweenDatesAndByUUID(HistoryRequestModel historyRequestModel);
|
||||
void saveRequest(RequestHistoryDTO requestDTO);
|
||||
}
|
||||
|
||||
@@ -32,7 +32,7 @@ public class RequestHistoryServiceImpl implements RequestHistoryService {
|
||||
* @return list of {@link RequestHistory}
|
||||
*/
|
||||
@Override
|
||||
public List<RequestHistory> getHistoryRecordsBetweenDatesAndByUUIDAndMessageId(HistoryRequestModel historyRequestModel) {
|
||||
public List<RequestHistory> getHistoryRecordsBetweenDatesAndByUUID(HistoryRequestModel historyRequestModel) {
|
||||
List<RequestHistory> history = repository.findAllByClientUUID(
|
||||
historyRequestModel.getClientUUID().toString()
|
||||
);
|
||||
|
||||
@@ -2,16 +2,11 @@ var clientUUID = '';
|
||||
var advancedDisplayed = false;
|
||||
var json = {};
|
||||
var jsonIndex = 0;
|
||||
var lastId = 1;
|
||||
var htable_row = 0;
|
||||
var host = window.location.protocol + "//" + window.location.hostname + ":8097";
|
||||
var dataModified = false;
|
||||
const addMessageName = 'addMessage';
|
||||
const loadMessageName = 'changeMessage';
|
||||
const removeMessageName = 'removeMessage';
|
||||
|
||||
const C_UUID = 'mock-uuid';
|
||||
const C_ID = 'last-displayed-id';
|
||||
const C_ADV = 'advanced-mode';
|
||||
|
||||
const color_red = "#ff8f8f";
|
||||
@@ -30,24 +25,29 @@ const getUpdate = function(){
|
||||
const dataRefresh = function(){
|
||||
getData();
|
||||
}
|
||||
$('#btn-newtile').click(function(){callAddMessage()});
|
||||
// $('#btn-addRow').click(function(){addRow()});
|
||||
// $('#btn-save').click(getUpdate);
|
||||
|
||||
function getData(){
|
||||
$.getJSON(host + '/api/mock/'+clientUUID, function(data) {
|
||||
console.log(data)
|
||||
json = data;
|
||||
checkUuid();
|
||||
|
||||
|
||||
refreshData();
|
||||
initializeUUID();
|
||||
loadMessage();
|
||||
});
|
||||
}
|
||||
|
||||
function loadCookies(){
|
||||
clientUUID = getCookie(C_UUID);
|
||||
advancedDisplayed = getCookie(C_ADV) == 'true';
|
||||
}
|
||||
|
||||
function checkUuid(){
|
||||
function setCookie(){
|
||||
document.cookie = C_UUID + '=' +clientUUID;
|
||||
document.cookie = C_ADV + '=' + advancedVisibility;
|
||||
}
|
||||
|
||||
function initializeUUID(){
|
||||
if(clientUUID == null || clientUUID == undefined || clientUUID == ''){
|
||||
clientUUID = json[0].clientUUID;
|
||||
clientUUID = json.clientUUID;
|
||||
setCookie();
|
||||
}
|
||||
}
|
||||
@@ -86,43 +86,6 @@ function setDataOrigin(){
|
||||
$('#btn-save').off();
|
||||
}
|
||||
|
||||
const idToDisplay = function(){
|
||||
let defaultId = json[0].mockedResponseId;
|
||||
if(lastId == undefined || lastId == null) return defaultId;
|
||||
for(let i=0; i<json.length; i++){
|
||||
if(json[i].mockedResponseId == lastId){
|
||||
return lastId;
|
||||
}
|
||||
}
|
||||
if(jsonIndex <= json.length && jsonIndex > 0){
|
||||
jsonIndex -= 1;
|
||||
return json[jsonIndex].mockedResponseId;
|
||||
}
|
||||
return defaultId;
|
||||
}
|
||||
|
||||
function refreshData(){
|
||||
$("#uuid-input").val(clientUUID);
|
||||
fillMessageList();
|
||||
|
||||
let id = idToDisplay();
|
||||
|
||||
loadMessage(id);
|
||||
|
||||
}
|
||||
|
||||
function setCookie(){
|
||||
document.cookie = C_UUID + '=' +clientUUID;
|
||||
document.cookie = C_ID + '=' + lastId;
|
||||
document.cookie = C_ADV + '=' + advancedVisibility;
|
||||
}
|
||||
|
||||
function loadCookies(){
|
||||
clientUUID = getCookie(C_UUID);
|
||||
lastId = getCookie(C_ID);
|
||||
advancedDisplayed = getCookie(C_ADV) == 'true';
|
||||
}
|
||||
|
||||
function getCookie(cname) {
|
||||
var name = cname + '=';
|
||||
var decodedCookie = decodeURIComponent(document.cookie);
|
||||
@@ -139,28 +102,11 @@ function getCookie(cname) {
|
||||
return '';
|
||||
}
|
||||
|
||||
function callMethodByName(methodObject){
|
||||
let name = methodObject.name;
|
||||
let id = methodObject.id;
|
||||
switch(name){
|
||||
case addMessageName:
|
||||
addMessage();
|
||||
break;
|
||||
case loadMessageName:
|
||||
loadMessage(id);
|
||||
break;
|
||||
case removeMessageName:
|
||||
removeMessage(id);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function updateData(){
|
||||
var updatedJson = generateJson();
|
||||
const dataSaved = function () {
|
||||
setDataOrigin();
|
||||
refreshData();
|
||||
loadMessage();
|
||||
savedModalDisplay();
|
||||
}
|
||||
$.ajax({
|
||||
@@ -171,156 +117,33 @@ function updateData(){
|
||||
}).done(dataSaved);
|
||||
}
|
||||
|
||||
function callAddMessage(){
|
||||
if(dataModified){
|
||||
setMethodToCall(addMessageName, null);
|
||||
dataLossModalDisplay();
|
||||
}
|
||||
else {
|
||||
addMessage();
|
||||
}
|
||||
}
|
||||
|
||||
function addMessage(){
|
||||
$.ajax({
|
||||
url: host + '/api/mock/'+clientUUID,
|
||||
type: 'POST',
|
||||
}).done(dataRefresh);
|
||||
}
|
||||
|
||||
function callRemoveMessage(id){
|
||||
if(dataModified){
|
||||
setMethodToCall(removeMessageName, id);
|
||||
dataLossModalDisplay();
|
||||
}
|
||||
else {
|
||||
removeMessage(id);
|
||||
}
|
||||
}
|
||||
|
||||
function removeMessage(id){
|
||||
var jsonObject = findJsonById(id);
|
||||
$.ajax({
|
||||
url: host + '/api/mock/'+clientUUID + '/' + id,
|
||||
type: 'DELETE',
|
||||
}).done(dataRefresh);
|
||||
}
|
||||
|
||||
|
||||
function clearMock(){
|
||||
fillStaticFields('','','','');
|
||||
htable_row = 0;
|
||||
$('#httpStatusValues').html('');
|
||||
}
|
||||
|
||||
function initializeMock(index){
|
||||
function initializeMock(){
|
||||
clearMock();
|
||||
fillStaticFields(json[index].clientUUID
|
||||
, json[index].mockedResponseId
|
||||
, json[index].contentType
|
||||
, json[index].messageBody
|
||||
, json[index].httpStatus);
|
||||
fillHeaderTable(json[index].httpHeaders);
|
||||
fillStaticFields(
|
||||
json.clientUUID,
|
||||
json.contentType,
|
||||
json.messageBody,
|
||||
json.httpStatus);
|
||||
fillHeaderTable(json.httpHeaders);
|
||||
}
|
||||
|
||||
function fillStaticFields(uuid, id, contentType, body, httpStatus){
|
||||
let link = createLink(uuid,id);
|
||||
function fillStaticFields(uuid, contentType, body, httpStatus){
|
||||
let link = createLink(uuid);
|
||||
let linkHtml = '<a class="hyperlink" target="_blank" href="'+link+'">'+link+'</a>';
|
||||
$('#messageLink').html(linkHtml);
|
||||
$('#httpStatus').val(httpStatus);
|
||||
$('#uuid-input').val(uuid);
|
||||
$('#typeSelector').val(contentType);
|
||||
$('#bodyEditor').val(body);
|
||||
$('#mockedMessageId').html(id);
|
||||
|
||||
}
|
||||
|
||||
function changeEditionOfUUID(element){
|
||||
|
||||
var inputFieldId= "#uuid-input"
|
||||
var inputFieldDiv = "#uuid-edit-field"
|
||||
if(element.checked){
|
||||
$(inputFieldId).removeAttr('disabled');
|
||||
$(inputFieldDiv).removeClass('disabled');
|
||||
} else{
|
||||
$(inputFieldId).attr('disabled', true);
|
||||
$(inputFieldDiv).addClass('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
function copyUUIDToClipboard(){
|
||||
navigator.clipboard.writeText( document.getElementById('uuid-input').value );
|
||||
}
|
||||
|
||||
|
||||
async function fetchUUIDCheck(givenUUID , strategy){
|
||||
var newUUID = "UUID" ;
|
||||
url = host + "/api/mock/check/";
|
||||
|
||||
switch(strategy){
|
||||
case "new":{
|
||||
await fetch(url + givenUUID+ "/", { method : "GET" })
|
||||
.then ( response => response.text() )
|
||||
.then ( data => {
|
||||
newUUID = data;
|
||||
|
||||
} )
|
||||
break;
|
||||
}
|
||||
case "restore":{
|
||||
await fetch(url + givenUUID + "/" + clientUUID + "/" , { method: "GET" })
|
||||
.then (response => response.text() )
|
||||
.then (data => {
|
||||
newUUID = data;
|
||||
|
||||
} )
|
||||
break;
|
||||
}
|
||||
}
|
||||
return newUUID ;
|
||||
}
|
||||
|
||||
function checkUUIDChars(uuid) {
|
||||
uuid.replace(/ /g,'')
|
||||
const regex = new RegExp("^[A-z0-9-]+$");
|
||||
|
||||
if(regex.test(uuid) && uuid != ""){
|
||||
return uuid ;
|
||||
}
|
||||
return "invalid";
|
||||
}
|
||||
|
||||
function changeUUID(element){
|
||||
|
||||
const uuidStrategy = $('input[name="uuid-validation-type"]:checked').val();
|
||||
const givenUUID = checkUUIDChars(element.value);
|
||||
|
||||
if( givenUUID == clientUUID ){
|
||||
$("#uuid-input").attr("disabled", true);
|
||||
uuidChangeModalDisplay("noChg");
|
||||
return;
|
||||
}
|
||||
|
||||
var newUUID = fetchUUIDCheck(givenUUID , uuidStrategy);
|
||||
var changeMessage = uuidStrategy;
|
||||
newUUID
|
||||
.then( data => {
|
||||
if (givenUUID == data) {
|
||||
changeMessage = "success";
|
||||
}
|
||||
clientUUID = data;
|
||||
$("#editable").attr("checked", false);
|
||||
|
||||
uuidChangeModalDisplay(changeMessage);
|
||||
document.cookie = C_UUID + '=' + data ;
|
||||
} )
|
||||
loadCookies();
|
||||
refreshData();
|
||||
}
|
||||
|
||||
|
||||
function createLink(uuid, id){
|
||||
var link = host + '/api/mock/r/'+uuid+'/'+id;
|
||||
function createLink(uuid){
|
||||
var link = host + '/api/mock/r/'+uuid;
|
||||
return link;
|
||||
}
|
||||
|
||||
@@ -396,105 +219,19 @@ function buildRowHtml(key, value){
|
||||
'</tr>';
|
||||
}
|
||||
|
||||
|
||||
function fillMessageList(){
|
||||
$("#listItems").html('');
|
||||
var innerHTML = '';
|
||||
for(let i=0; i<json.length; i++){
|
||||
innerHTML += generateMessageTileHtml(json[i].mockedResponseId, json[i].httpStatus, json[i].contentType);
|
||||
}
|
||||
$("#listItems").append(innerHTML);
|
||||
$('.tile').click(function(e) {
|
||||
var element = $(this);
|
||||
var button = element.find('.btn-tile').children().get(0);
|
||||
|
||||
if(!(button == e.target)){
|
||||
|
||||
callLoadMessage(parseInt($(this).attr('tileid')));
|
||||
}
|
||||
});
|
||||
$('.btn-tile').click(function(){
|
||||
//
|
||||
callRemoveMessage($(this).closest('.tile').attr('tileId'));
|
||||
})
|
||||
}
|
||||
|
||||
function findJsonById(id){
|
||||
return json[findJsonIndexById(id)];
|
||||
}
|
||||
|
||||
function findJsonIndexById(id){
|
||||
for(let i=0; i<json.length; i++)
|
||||
if(id == json[i].mockedResponseId) return i;
|
||||
}
|
||||
|
||||
function callLoadMessage(id){
|
||||
if(dataModified) {
|
||||
setMethodToCall(loadMessageName, id);
|
||||
dataLossModalDisplay();
|
||||
}
|
||||
else {
|
||||
loadMessage(id);
|
||||
}
|
||||
}
|
||||
|
||||
function loadMessage(id){
|
||||
if(id == null || id == undefined){
|
||||
|
||||
return;
|
||||
}
|
||||
lastId = id;
|
||||
function loadMessage(){
|
||||
setCookie();
|
||||
setDataOrigin();
|
||||
for(let i=0; i<json.length; i++){
|
||||
|
||||
if(id == json[i].mockedResponseId){
|
||||
jsonIndex = i;
|
||||
|
||||
initializeMock(jsonIndex);
|
||||
|
||||
selectMessage(id);
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
initializeMock();
|
||||
selectMessage();
|
||||
}
|
||||
|
||||
|
||||
function selectMessage(id){
|
||||
const tiles = $('.tile');
|
||||
|
||||
tiles.removeClass("active");
|
||||
|
||||
$('.tile[tileid="'+id+'"]').addClass("active");
|
||||
|
||||
function selectMessage(){
|
||||
initializeHistory();
|
||||
refreshHeaderTable(document.innerHTML);
|
||||
}
|
||||
|
||||
|
||||
|
||||
function generateMessageTileHtml(id, httpStatus, contentType){
|
||||
var innerHTML = '' +
|
||||
'<div tileid="' + id + '" class="tile">' +
|
||||
'<div class="content">' +
|
||||
'<div class="display-space-between">' +
|
||||
'<div class="centered-vertically">' +
|
||||
'<p>Id: ' + id + '</p>' +
|
||||
'<p>Status: ' + httpStatus + '</p>' +
|
||||
'</div>' +
|
||||
'<div>' +
|
||||
'<button class="modification-button btn-tile"><i class="icon-cancel"></i></button>' +
|
||||
'</div>' +
|
||||
'</div>' +
|
||||
'</div>' +
|
||||
'</div>';
|
||||
return innerHTML;
|
||||
}
|
||||
|
||||
|
||||
|
||||
const onbuild = function(){
|
||||
loadCookies();
|
||||
getData();
|
||||
@@ -509,12 +246,10 @@ function sleep(ms) {
|
||||
return new Promise(resolve => setTimeout(resolve, ms));
|
||||
}
|
||||
|
||||
|
||||
|
||||
function generateJson(){
|
||||
var newJson =
|
||||
{
|
||||
clientUUID: json[jsonIndex].clientUUID,
|
||||
clientUUID: json.clientUUID,
|
||||
contentType: $('#typeSelector').val(),
|
||||
messageBody: $('#bodyEditor').val(),
|
||||
httpStatus: $('#httpStatus').val(),
|
||||
@@ -522,7 +257,7 @@ function generateJson(){
|
||||
};
|
||||
newJson['httpHeaders'] = convertTableToJson();
|
||||
|
||||
json[jsonIndex] = newJson;
|
||||
json = newJson;
|
||||
return newJson;
|
||||
}
|
||||
|
||||
@@ -537,4 +272,4 @@ function convertTableToJson(){
|
||||
obj[key] = rows.eq(i).children().eq(1).children().eq(0).val();
|
||||
}
|
||||
return obj;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -17,10 +17,9 @@ $('#btn-searchHistory').click(startSearch);
|
||||
function loadHistory(dateFrom, dateTo){
|
||||
|
||||
var eventRequest = {
|
||||
clientUUID : json[jsonIndex].clientUUID,
|
||||
clientUUID : json.clientUUID,
|
||||
localDateTimeFrom : dateFrom,
|
||||
localDateTimeTo : dateTo,
|
||||
mockedResponseId : json[jsonIndex].mockedResponseId
|
||||
};
|
||||
$.ajax({
|
||||
url: host + '/api/event',
|
||||
@@ -34,7 +33,7 @@ function loadHistory(dateFrom, dateTo){
|
||||
}
|
||||
|
||||
function getLast24hHistoryData(){
|
||||
$.getJSON(host + '/api/event/' + clientUUID + '/' + lastId, function(data){
|
||||
$.getJSON(host + '/api/event/' + clientUUID, function(data){
|
||||
historyJson = data;
|
||||
displayHistory();
|
||||
});
|
||||
|
||||
@@ -60,9 +60,9 @@ function showHeaders(){
|
||||
$('#headersTab').off('click');
|
||||
}
|
||||
|
||||
function showHeadersHistory(element){
|
||||
function showHeadersHistory(record){
|
||||
historyTable = '';
|
||||
headers = parseHeaders(element.id)
|
||||
headers = parseHeaders(record.id)
|
||||
headers.forEach(
|
||||
(value,key) => {
|
||||
historyTable +=
|
||||
|
||||
@@ -68,7 +68,6 @@
|
||||
<option value="404">
|
||||
<option value="500">
|
||||
</datalist>
|
||||
|
||||
</div>
|
||||
<!-- content type -->
|
||||
<div class="max-width small-vertical-margin">
|
||||
@@ -187,30 +186,6 @@
|
||||
<p>To save message, the message must be changed!</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-vertical-margin">
|
||||
<div id="btn-newTileTip" class="tip">
|
||||
<h3>Add new message</h3>
|
||||
<p>This button adds new message.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-vertical-margin">
|
||||
<div id="UUIDFieldTip" class="tip">
|
||||
<h3>UUID</h3>
|
||||
<p>UUID is an Unique ID that represents you in API. By UUID your messages is saved in database. You can change it to access your previous configuration of mocked messages</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-vertical-margin">
|
||||
<div id="UUIDValidationStrategyTip" class="tip">
|
||||
<h3>UUID Checking Strategy</h3>
|
||||
<p>When you provide invalid UUID you can choose what do with it. You can generate new UUID or restore previous.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="large-vertical-margin">
|
||||
<div id="UUIDEditionTip" class="tip">
|
||||
<h3>UUID Edition</h3>
|
||||
<p>Unlocks you ability to edit UUID</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="large-vertical-margin">
|
||||
<div id="messagesTip" class="tip">
|
||||
@@ -258,16 +233,6 @@
|
||||
</div>
|
||||
</div>
|
||||
<div id="overlay"></div>
|
||||
<div id="modal-uuidChanged" class="modal">
|
||||
<div class="header">
|
||||
<div>Change UUID info<i class="r-exclamation"></i></div>
|
||||
<button onclick="window.location.reload();">×</button>
|
||||
</div>
|
||||
<div id="changeUUIDSuccess" class="body hiddable uuid-modal-body">Your message UUID has been changed successfully.</div>
|
||||
<div id="newUUID" class="body hiddable uuid-modal-body">You provided wrong UUID! <br> New UUID has been generated!</div>
|
||||
<div id="restoredUUID" class="body hiddable uuid-modal-body">You provided wrong UUID! <br> Old UUID has been restored!</div>
|
||||
<div id="noChgUUID" class="body hiddable uuid-modal-body">You doesn't provide any change to UUID!</div>
|
||||
</div>
|
||||
<div id="modal-confirm" class="modal">
|
||||
<div class="header">
|
||||
<div>Message saved<i class="r-exclamation"></i></div>
|
||||
@@ -282,9 +247,7 @@
|
||||
</div>
|
||||
<div class="body">You haven't saved your message!<br> Do you want to save it?</div>
|
||||
<div class="function">
|
||||
|
||||
<button type = "button" onclick = "updateData()" value = "Display">Save</button>
|
||||
|
||||
<button>No</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user