- default message for user testing,
- updating frontend
This commit is contained in:
		| @@ -18,33 +18,58 @@ | ||||
|             <div class="container"> | ||||
|                 <section class="page-section" id="main-section"> | ||||
|                     <div class="container"> | ||||
|                         <p>With this tool you can create mockups for http requests and use them for integration tests of your system.</p> | ||||
|                         <div class="row"> | ||||
|                             <div class="column"> | ||||
|  | ||||
|                         <p>With this tool you can create mockups for http requests and use them for integration tests of | ||||
|                             your system.</p> | ||||
|                         <div> | ||||
|                                 <br> | ||||
|                                 <p>In order to set mockup response please fill the form below:</p> | ||||
|                                 <p>You can test the mocked message using the url or the button below:</p> | ||||
|                                 <table> | ||||
|                                     <tr> | ||||
|                                         <td> | ||||
|                                             <p> | ||||
|                                                 http://[[${localhost}]]:8097/klaus/v1/get/[[${mockedMessageDto.clientUUID}]]/[[${mockedMessageDto.mockedResponseId}]]</p> | ||||
|                                         </td> | ||||
|                                         <td> | ||||
|                                             <form action="#" th:action="@{/home/getMockedResponse}" | ||||
|                                                   th:object="${mockedMessageDto}" | ||||
|                                                   method="get"> | ||||
|                                                 <input type="text" th:field="*{clientUUID}" hidden/> | ||||
|                                                 <input type="text" th:field="*{mockedResponseId}" hidden/> | ||||
|                                                 <input type="submit" value="Test your mock"/> | ||||
|                                             </form> | ||||
|                                         </td> | ||||
|                                     </tr> | ||||
|                                 </table> | ||||
|                                 <br> | ||||
|  | ||||
|                                 <table> | ||||
|                                     <p>In order to set or update mockup response please fill the form below and save | ||||
|                                         your message:</p> | ||||
|                                     <form action="#" th:action="@{/home/__${mockedMessageDto.clientUUID}__}" | ||||
|                                           th:object="${mockedMessageDto}" method="post"> | ||||
|                                         <input type="text" th:field="*{clientUUID}" hidden/> | ||||
|                                         <tr> | ||||
|                                             <td>Mocked response id:</td> | ||||
|                                             <td><input type="text" th:field="*{mockedResponseId}" th:value="*{mockedResponseId}"/></td> | ||||
|                                             <td th:if="${#fields.hasErrors('mockedResponseId')}" th:errors="*{mockedResponseId}">Id | ||||
|                                                 Error | ||||
|                                             </td> | ||||
|                                             <td>Media type:</td> | ||||
|                                             <td><select th:field="*{mediaType}"> | ||||
|                                                 <option value="application/xml">application/xml</option> | ||||
|                                                 <option value="application/json">application/json</option> | ||||
|                                                 <option value="text/xml">text/xml</option> | ||||
|                                             </select></td> | ||||
|                                         </tr> | ||||
|  | ||||
|                                         <tr> | ||||
|                                             <td>Mocked response body:</td> | ||||
|                                             <td><textarea rows="4" cols="30" th:field="*{messageBody}" | ||||
|                                                           placeholder="Your message body"></textarea></td> | ||||
|                                             <td th:if="${#fields.hasErrors('messageBody')}" th:errors="*{messageBody}">Body Error</td> | ||||
|                                             <td th:if="${#fields.hasErrors('messageBody')}" th:errors="*{messageBody}"> | ||||
|                                                 Body Error | ||||
|                                             </td> | ||||
|                                         </tr> | ||||
|                                         <tr> | ||||
|                                             <td>Mocked response http code status:</td> | ||||
|                                             <td><input type="text" th:field="*{httpStatus}" placeholder="200"></td> | ||||
|                                             <td th:if="${#fields.hasErrors('httpStatus')}" th:errors="*{httpStatus}">HttpStatus Error | ||||
|                                             <td th:if="${#fields.hasErrors('httpStatus')}" th:errors="*{httpStatus}"> | ||||
|                                                 HttpStatus Error | ||||
|                                             </td> | ||||
|                                         </tr> | ||||
|  | ||||
| @@ -53,30 +78,35 @@ | ||||
|                                             <td>Header value</td> | ||||
|                                         </tr> | ||||
|                                         <tr> | ||||
|                                             <td><input type="text" name="headerKey" id="headerKey" placeholder="myHeaderKey"/></td> | ||||
|                                             <td><input type="text" name="headerKey" id="headerKey" | ||||
|                                                        placeholder="myHeaderKey"/></td> | ||||
|                                             <td> | ||||
|                                                 <input type="text" name="headerValue" id="headerValue" placeholder="myHeaderValue"/> | ||||
|                                                 <input type="text" name="headerValue" id="headerValue" | ||||
|                                                        placeholder="myHeaderValue"/> | ||||
|                                                 <input type="image" name="addHeader" src="/img/icons8-plus-48.png" | ||||
|                                                        style="width: 20px;"/> | ||||
|                                             </td> | ||||
|                                         </tr> | ||||
|                                         <tr th:each="entry, stats : *{httpHeaders}" bgcolor="#b3ffff"> | ||||
|                                             <td><input type="text" name="value" th:value="${entry.key}" disabled="disabled"/></td> | ||||
|                                             <td><input type="text" name="value" th:value="${entry.key}" | ||||
|                                                        disabled="disabled"/></td> | ||||
|                                             <td> | ||||
|                                                 	 | ||||
|                                                 <input type="text" name="value" th:field="*{httpHeaders[__${entry.key}__]}"/> | ||||
|                                                 <input type="text" name="value" | ||||
|                                                        th:field="*{httpHeaders[__${entry.key}__]}"/> | ||||
|                                                 <button type="submit" name="removeHeader" th:value="${entry.key}"> | ||||
|                                                     <img src="/img/icons8-cancel-64.png" style="width: 20px;"/> | ||||
|                                                 </button> | ||||
|                                             </td> | ||||
|                                         </tr> | ||||
|                                         <tr> | ||||
|                                             <td>Media type:</td> | ||||
|                                             <td><select th:field="*{mediaType}"> | ||||
|                                                 <option value="application/xml">application/xml</option> | ||||
|                                                 <option value="application/json">application/json</option> | ||||
|                                                 <option value="text/xml">text/xml</option> | ||||
|                                             </select></td> | ||||
|                                             <td>Mocked response id:</td> | ||||
|                                             <td><input type="text" th:field="*{mockedResponseId}" | ||||
|                                                        th:value="*{mockedResponseId}"/></td> | ||||
|                                             <td th:if="${#fields.hasErrors('mockedResponseId')}" | ||||
|                                                 th:errors="*{mockedResponseId}">Id | ||||
|                                                 Error | ||||
|                                             </td> | ||||
|                                         </tr> | ||||
|                                         <tr> | ||||
|                                             <td><input type="submit" value="Save my message"/></td> | ||||
| @@ -97,60 +127,57 @@ | ||||
|                                                 <p><input type="submit" value="History"/></p> | ||||
|                                             </form> | ||||
|                                         </td> | ||||
|                                         <td> | ||||
|                                             <form action="#" th:action="@{/home/getMockedResponse}" th:object="${mockedMessageDto}" | ||||
|                                                   method="get"> | ||||
|                                                 <input type="text" th:field="*{clientUUID}" hidden/> | ||||
|                                                 <input type="text" th:field="*{mockedResponseId}" hidden/> | ||||
|                                                 <p th:if="${canTest}"><input type="submit" value="Test your mock"/></p> | ||||
|                                             </form> | ||||
|                                         </td> | ||||
|                                     </tr> | ||||
|                                 </table> | ||||
|                                 <p th:if="${mockSaved}">Mock has been saved</p> | ||||
|                             </div> | ||||
|                             <div class="column"> | ||||
|                                 <br> | ||||
|                                 <form action="#" th:action="@{/home/__${mockedMessageDto.clientUUID}__}" | ||||
|                                       th:object="${mockedMessageDto}" method="post"> | ||||
|                                     <table> | ||||
|                                         <thead> | ||||
|                                         <tr> | ||||
|                                             <th class="tr-pageable"> | ||||
|                                                 <p class="btn-sort" id="btn-sort-0">#</p> | ||||
|                                             </th> | ||||
|                                             <th class="tr-pageable"> | ||||
|                                                 <p class="btn-sort activeButton" id="btn-sort-1">MessageId</p> | ||||
|                                             </th> | ||||
|                                             <th class="tr-pageable"> | ||||
|                                                 <p class="btn-sort" id="btn-sort-2">Media Type</p> | ||||
|                                             </th> | ||||
|                                             <th class="tr-pageable"> | ||||
|                                                 <p class="btn-sort" id="btn-sort-3">Http Status</p> | ||||
|                                             </th> | ||||
|                                         </tr> | ||||
|                                         </thead> | ||||
|                                         <input type="text" th:field="*{clientUUID}" hidden/> | ||||
|                                         <tbody id="table-body"> | ||||
|                                         </tbody> | ||||
|                                     </table> | ||||
|                                 </form> | ||||
|                                 <div class="container "> | ||||
|                                     <div id="pagination-wrapper"></div> | ||||
|                                 </div> | ||||
|  | ||||
|                             </div> | ||||
|                         </div> | ||||
|                     </div> | ||||
|                 </section> | ||||
|                 <hr> | ||||
|             </div> | ||||
|  | ||||
|             <div> | ||||
|                 <p>Here you can see the interactive list of all your mocked messages. You can call all of them. Use the buttons to sort the list and also update or delete messages.</p> | ||||
|                 <form action="#" th:action="@{/home/__${mockedMessageDto.clientUUID}__}" | ||||
|                       th:object="${mockedMessageDto}" method="post"> | ||||
|                     <table> | ||||
|                         <thead> | ||||
|                         <tr> | ||||
|                             <th class="tr-pageable"> | ||||
|                                 <p class="btn-sort" id="btn-sort-0">#</p> | ||||
|                             </th> | ||||
|                             <th class="tr-pageable"> | ||||
|                                 <p class="btn-sort activeButton" id="btn-sort-1">MessageId</p> | ||||
|                             </th> | ||||
|                             <th class="tr-pageable"> | ||||
|                                 <p class="btn-sort" id="btn-sort-2">Media Type</p> | ||||
|                             </th> | ||||
|                             <th class="tr-pageable"> | ||||
|                                 <p class="btn-sort" id="btn-sort-3">Http Status</p> | ||||
|                             </th> | ||||
|                         </tr> | ||||
|                         </thead> | ||||
|                         <input type="text" th:field="*{clientUUID}" hidden/> | ||||
|                         <tbody id="table-body"> | ||||
|                         </tbody> | ||||
|                     </table> | ||||
|                 </form> | ||||
|                 <div class="container "> | ||||
|                     <div id="pagination-wrapper"></div> | ||||
|                 </div> | ||||
|             </div> | ||||
|             <hr> | ||||
|             <div> | ||||
|                 <br>If you are keen to use the mocking service with bigger amount of messages or automate the process by inserting | ||||
|                 high amount of random messages please consider using the tools below: | ||||
|                 <br>If you are keen to use the mocking service with bigger amount of messages or automate the process by | ||||
|                 inserting | ||||
|                 high amount of random messages please consider using swagger or send batch requests on the urls below: | ||||
|  | ||||
|                 <br><a href="http://[[${localhost}]]:8097/swagger-ui.html">http://[[${localhost}]]:8097/swagger-ui.html</a> | ||||
|                 <br><a | ||||
|                     href="http://[[${localhost}]]:8097/swagger-ui.html">http://[[${localhost}]]:8097/swagger-ui.html</a> | ||||
|                 <br> | ||||
|                 <br>http://[[${localhost}]]:8097/klaus/v1/delete/[[${mockedMessageDto.clientUUID}]]/{mockedResponseId} | ||||
|                 <br>http://[[${localhost}]]:8097/klaus/v1/set/[[${mockedMessageDto.clientUUID}]]/{mockedResponseId}?httpStatus={httpStatus} | ||||
| @@ -160,14 +187,15 @@ | ||||
|  | ||||
|             </div> | ||||
|             <hr> | ||||
|             </div> | ||||
|         </div> | ||||
|     </div> | ||||
|     <div id="foot"></div> | ||||
| </div> | ||||
| <div id="foot"></div> | ||||
| </div> | ||||
|  | ||||
| <script type="text/javascript" th:inline="javascript"> | ||||
| var listForPagination = /*[[${mockedMessageDtoList}]]*/; | ||||
|  | ||||
| </script> | ||||
| <script src="/js/paggination.js"></script> | ||||
| <script> | ||||
| @@ -181,6 +209,7 @@ $.get("https://raw.githubusercontent.com/Szakalakamaka/viewpresenter/master/src/ | ||||
|     $("#foot").html(data); | ||||
| }); | ||||
|  | ||||
|  | ||||
| </script> | ||||
|  | ||||
| </body> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 Szakalakamaka
					Szakalakamaka