Thymeleaf + Vue application

This commit is contained in:
Tom Hombergs
2020-06-08 21:51:46 +10:00
parent b8c0923f23
commit 5e0f15e4cc
34 changed files with 19241 additions and 0 deletions

View File

@@ -0,0 +1,39 @@
plugins {
id 'org.springframework.boot' version '2.3.0.RELEASE'
id 'io.spring.dependency-management' version '1.0.9.RELEASE'
id 'java'
}
group = 'io.reflectoring'
version = '0.0.1-SNAPSHOT'
sourceCompatibility = '1.8'
repositories {
mavenCentral()
}
dependencies {
project(':client')
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
implementation 'org.springframework.boot:spring-boot-starter-web'
testImplementation('org.springframework.boot:spring-boot-starter-test') {
exclude group: 'org.junit.vintage', module: 'junit-vintage-engine'
}
}
test {
useJUnitPlatform()
}
task copyJavascriptComponents(type: Copy) {
from '../client/dist'
include '**/*.umd.min.js'
into 'src/main/resources/static/js/vue-components'
}
task cleanJavascriptComponents(type: Delete) {
delete 'src/main/resources/static/js/vue-components'
}
processResources.dependsOn copyJavascriptComponents
clean.dependsOn cleanJavascriptComponents

View File

@@ -0,0 +1,22 @@
package io.reflectoring.thymeleafvue;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.servlet.ModelAndView;
import java.util.Arrays;
import java.util.HashMap;
import java.util.Map;
@Controller
class HelloVueController {
@GetMapping("/hello")
ModelAndView showHelloPage() {
Map<String, Object> model = new HashMap<>();
model.put("title", "Hello Vue!");
model.put("chartData", Arrays.asList(7,6,5,4,3,2,1));
return new ModelAndView("hello-vue.html", model);
}
}

View File

@@ -0,0 +1,13 @@
package io.reflectoring.thymeleafvue;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class ThymeleafVueApplication {
public static void main(String[] args) {
SpringApplication.run(ThymeleafVueApplication.class, args);
}
}

View File

@@ -0,0 +1,23 @@
<html>
<body>
<h1 th:text="${title}">This title will be replaced</h1>
<p> Here comes a Vue component!</p>
<div id="chart">
<chart th:v-bind:chart-data="${chartData}"></chart>
</div>
<script src="https://unpkg.com/vue"></script>
<script th:src="@{/js/vue-components/WeekChart/WeekChart.umd.min.js}"></script>
<script>
(function() {
new Vue({
components: {
chart: WeekChart
}
}).$mount('#chart')
})();
</script>
</body>
</html>

View File

@@ -0,0 +1,13 @@
package io.reflectoring.thymeleafvue;
import org.junit.jupiter.api.Test;
import org.springframework.boot.test.context.SpringBootTest;
@SpringBootTest
class ThymeleafVueApplicationTests {
@Test
void contextLoads() {
}
}