Skip to content

Commit 6fde955

Browse files
committed
ajax in exercise table monitor pages
1 parent 9ff7bbf commit 6fde955

File tree

6 files changed

+101
-35
lines changed

6 files changed

+101
-35
lines changed

backend/src/main/java/webapp3/webapp3/controller/MemberController.java

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,6 @@ public String getExerciseTablePage(Model model, @PathVariable int page){
9898
model.addAttribute("list", exerTabPage.toList());
9999

100100
return "USRMEM_01ExerciseTableAJAX";
101-
102101
}
103102

104103
@GetMapping("/MEMeditProfile/{id}")
@@ -227,4 +226,5 @@ public String seeActivityInfo(Model model, @PathVariable long id, HttpServletReq
227226
model.addAttribute("activity", activity.orElseThrow());
228227
return "USRMON_08SeeActivityInfo";
229228
}
229+
230230
}

backend/src/main/java/webapp3/webapp3/controller/MonitorController.java

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
import org.springframework.beans.factory.annotation.Autowired;
66
import org.springframework.core.io.ClassPathResource;
77
import org.springframework.core.io.InputStreamResource;
8+
import org.springframework.data.domain.Page;
89
import org.springframework.http.HttpHeaders;
910
import org.springframework.http.ResponseEntity;
1011
import org.springframework.core.io.Resource;
@@ -127,7 +128,6 @@ public String profile(Model model, HttpServletRequest request) {
127128

128129
//edit profile page
129130
@GetMapping("/MONeditProfile")
130-
131131
public String editProfile(Model model, HttpServletRequest request) {
132132
String emailName = request.getUserPrincipal().getName();
133133
Optional<User> mon = monServ.findByEmail(emailName);
@@ -187,8 +187,11 @@ public String addEditedMonitor(Model model, HttpServletRequest request,
187187
@GetMapping("/MONexerciseTable")
188188
public String exerciseTable(Model model, HttpServletRequest request) {
189189
List<ExerciseTable> all = exerciseTableServ.findAll();
190+
Page<ExerciseTable> exerTabPage = exerciseTableServ.findPage(0);
190191
model.addAttribute("exerciseTableList", all);
191192
model.addAttribute("monitor", monServ.findByEmail(request.getUserPrincipal().getName()).orElseThrow());
193+
model.addAttribute("listMON", exerTabPage.toList());
194+
model.addAttribute("last", exerTabPage.getTotalPages());
192195
return "USRMON_03ExerciseTable";
193196
}
194197

@@ -203,6 +206,15 @@ public String seeExerciseTableInfo(Model model, @PathVariable long id, HttpServl
203206
return "USRMON_03ExerciseTable";
204207
}
205208

209+
//ajax
210+
@GetMapping("/MONexerciseTable/page/{page}")
211+
public String getExerciseTablePageMonitor(Model model, @PathVariable int page){
212+
Page<ExerciseTable> exerTabPage = exerciseTableServ.findPage(page);
213+
model.addAttribute("listMON", exerTabPage.toList());
214+
215+
return "USRMON_03ExerciseTableAJAX";
216+
}
217+
206218
@GetMapping("/MONexerciseTable/{id}/image")
207219
public ResponseEntity<Object> downloadExerciseImage(@PathVariable long id) throws SQLException {
208220
Optional<ExerciseTable> optExerTab = exerciseTableServ.findById(id);
@@ -303,7 +315,6 @@ public String deleteExerciseTable(Model model, @PathVariable long id) {
303315
return "redirect:/exerciseTable";
304316
}
305317

306-
307318
//grupal activities page
308319
@GetMapping("/MONactivities")
309320
public String activities(Model model, HttpServletRequest request) {
@@ -339,5 +350,4 @@ public ResponseEntity<Object> downloadImage(@PathVariable long id) throws SQLExc
339350
return ResponseEntity.notFound().build();
340351
}
341352

342-
343353
}

backend/src/main/java/webapp3/webapp3/service/ExerciseTableService.java

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,6 @@ public ByteArrayOutputStream generatePDF(Long userId, Long tableEx) throws Docum
109109
return baos;
110110
}
111111

112-
113112
public Page<ExerciseTable> findPage(int page){
114113
return exerciseTabRep.findAll(PageRequest.of(page, 8));
115114
}

backend/src/main/resources/templates/USRMON_03ExerciseTable.html

Lines changed: 53 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,8 @@ <h4 class="page-title">Tablas de ejercicios Subidas</h4>
3232
</button>
3333
</div>
3434
</div>
35-
<div class="row el-element-overlay">
36-
{{#exerciseTableList}}
35+
<div class="row el-element-overlay page">
36+
{{#listMON}}
3737
<div class="col-lg-3 col-md-6 col-6">
3838
<div class="card">
3939
<div class="el-card-item">
@@ -42,16 +42,18 @@ <h4 class="page-title">Tablas de ejercicios Subidas</h4>
4242
src="/MONexerciseTable/{{id}}/image" alt=" "/>
4343
<div class="el-overlay">
4444
<ul class="list-style-none el-info">
45-
<li class="el-item">
45+
<!-- <li class="el-item">
4646
<button class="btn default btn-outline el-link colorOrangeText"
47-
onclick='location.href="/MONexerciseTable/{{id}}"'><i class="mdi mdi-eye"></i>
47+
onclick='location.href="/MONexerciseTable/{{id}}"'><i class="mdi mdi-eye"></i>
4848
</button>
49-
</li>
50-
<li class="el-item">
51-
<button class="btn default btn-outline el-link colorOrangeText"
52-
onclick='location.href="/MONeditExerciseTable/{{id}}"'><i
53-
class="mdi mdi-pencil"></i></button>
54-
</li>
49+
</li> -->
50+
<li class="el-item"><a class="btn default btn-outline el-link" href="/MONexerciseTable/{{id}}"><i class="mdi mdi-eye"></i></a></li>
51+
<!-- <li class="el-item">
52+
<button class="btn default btn-outline el-link colorOrangeText"
53+
onclick='location.href="/MONeditExerciseTable/{{id}}"'><i
54+
class="mdi mdi-pencil"></i></button>
55+
</li> -->
56+
<li class="el-item"><a class="btn default btn-outline el-link" href="/MONeditExerciseTable/{{id}}"><i class="mdi mdi-pencil"></i></a></li>
5557
</ul>
5658
</div>
5759
</div>
@@ -61,11 +63,12 @@ <h4 class="m-b-0">{{name}}</h4>
6163
</div>
6264
</div>
6365
</div>
64-
{{/exerciseTableList}}
65-
66-
66+
{{/listMON}}
6767
</div>
68-
68+
<button class="btn default btn-outline el-link selector2 colorWhiteText" type="button" id="loadMore">
69+
Cargar más
70+
<i class="" id="spinner"></i>
71+
</button>
6972

7073
<!-- ============================================================== -->
7174
<!-- End PAge Content -->
@@ -95,29 +98,49 @@ <h4 class="m-b-0">{{name}}</h4>
9598
<!-- ============================================================== -->
9699
<!-- All Jquery -->
97100
<!-- ============================================================== -->
98-
<script src="/assets/libs/jquery/dist/jquery.min.js"></script>
101+
<script src="assets/libs/jquery/dist/jquery.min.js"></script>
99102
<!-- Bootstrap tether Core JavaScript -->
100-
<script src="/assets/libs/popper.js/dist/umd/popper.min.js"></script>
101-
<script src="/assets/libs/bootstrap/dist/js/bootstrap.min.js"></script>
102-
<script src="/assets/libs/perfect-scrollbar/dist/perfect-scrollbar.jquery.min.js"></script>
103-
<script src="/assets/extra-libs/sparkline/sparkline.js"></script>
103+
<script src="assets/libs/popper.js/dist/umd/popper.min.js"></script>
104+
<script src="assets/libs/bootstrap/dist/js/bootstrap.min.js"></script>
105+
<script src="assets/libs/perfect-scrollbar/dist/perfect-scrollbar.jquery.min.js"></script>
106+
<script src="assets/extra-libs/sparkline/sparkline.js"></script>
104107
<!--Wave Effects -->
105-
<script src="/dist/js/waves.js"></script>
108+
<script src="dist/js/waves.js"></script>
106109
<!--Menu sidebar -->
107-
<script src="/dist/js/sidebarmenu.js"></script>
110+
<script src="dist/js/sidebarmenu.js"></script>
108111
<!--Custom JavaScript -->
109-
<script src="/dist/js/custom.min.js"></script>
112+
<script src="dist/js/custom.min.js"></script>
110113
<!--This page JavaScript -->
111114
<!-- <script src="dist/js/pages/dashboards/dashboard1.js"></script> -->
112115
<!-- Charts js Files -->
113-
<script src="/assets/libs/flot/excanvas.js"></script>
114-
<script src="/assets/libs/flot/jquery.flot.js"></script>
115-
<script src="/assets/libs/flot/jquery.flot.pie.js"></script>
116-
<script src="/assets/libs/flot/jquery.flot.time.js"></script>
117-
<script src="/assets/libs/flot/jquery.flot.stack.js"></script>
118-
<script src="/assets/libs/flot/jquery.flot.crosshair.js"></script>
119-
<script src="/assets/libs/flot.tooltip/js/jquery.flot.tooltip.min.js"></script>
120-
<script src="/dist/js/pages/chart/chart-page-init.js"></script>
116+
<script src="assets/libs/flot/excanvas.js"></script>
117+
<script src="assets/libs/flot/jquery.flot.js"></script>
118+
<script src="assets/libs/flot/jquery.flot.pie.js"></script>
119+
<script src="assets/libs/flot/jquery.flot.time.js"></script>
120+
<script src="assets/libs/flot/jquery.flot.stack.js"></script>
121+
<script src="assets/libs/flot/jquery.flot.crosshair.js"></script>
122+
<script src="assets/libs/flot.tooltip/js/jquery.flot.tooltip.min.js"></script>
123+
<script src="dist/js/pages/chart/chart-page-init.js"></script>
124+
<script>
125+
var contPage = 1;
126+
$( "#loadMore" ).click(function() {
127+
$.ajax({
128+
url: "/MONexerciseTable/page/" + contPage,
129+
method: "get",
130+
beforeSend: ()=>{
131+
$("#spinner").addClass("fa fa-circle-notch fa-spin");
132+
}
133+
}).done(function (answer) {
134+
$(".page").last().after(answer);
135+
contPage += 1;
136+
$("#spinner").removeClass("fa fa-circle-notch fa-spin");
137+
if(contPage === {{last}}){
138+
$("#loadMore").off("click");
139+
$("#loadMore").remove();
140+
}
141+
});
142+
});
143+
</script>
121144

122145
</body>
123146

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<div class="row el-element-overlay page">
2+
{{#listMON}}
3+
<div class="col-lg-3 col-md-6 col-6">
4+
<div class="card">
5+
<div class="el-card-item">
6+
<div class="el-card-avatar el-overlay-1"><img
7+
style="width:200px; height:280px; object-fit:cover; margin: auto"
8+
src="/MONexerciseTable/{{id}}/image" alt=" "/>
9+
<div class="el-overlay">
10+
<ul class="list-style-none el-info">
11+
<!-- <li class="el-item">
12+
<button class="btn default btn-outline el-link colorOrangeText"
13+
onclick='location.href="/MONexerciseTable/{{id}}"'><i class="mdi mdi-eye"></i>
14+
</button>
15+
</li> -->
16+
<li class="el-item"><a class="btn default btn-outline el-link" href="/MONexerciseTable/{{id}}"><i class="mdi mdi-eye"></i></a></li>
17+
<!-- <li class="el-item">
18+
<button class="btn default btn-outline el-link colorOrangeText"
19+
onclick='location.href="/MONeditExerciseTable/{{id}}"'><i
20+
class="mdi mdi-pencil"></i></button>
21+
</li> -->
22+
<li class="el-item"><a class="btn default btn-outline el-link" href="/MONeditExerciseTable/{{id}}"><i class="mdi mdi-pencil"></i></a></li>
23+
</ul>
24+
</div>
25+
</div>
26+
<div class="el-card-content">
27+
<h4 class="m-b-0">{{name}}</h4>
28+
</div>
29+
</div>
30+
</div>
31+
</div>
32+
{{/listMON}}
33+
</div>

backend/src/main/resources/templates/USRMON_Header.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
<!-- Custom CSS -->
1717
<link href="/dist/css/style.min.css" rel="stylesheet">
1818
<link href="/dist/css/icons/material-design-iconic-font/css/materialdesignicons.min.css" rel="stylesheet">
19+
<link href="/dist/css/icons/font-awesome/css/fontawesome-all.css" rel="stylesheet">
1920
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
2021
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
2122
<!--[if lt IE 9]>

0 commit comments

Comments
 (0)