From 8232a5601c9d1060493164bed26c6923dd3fb7bf Mon Sep 17 00:00:00 2001
From: YongJae <sdc689@gmail.com>
Date: Sun, 24 Nov 2019 21:00:50 +0900
Subject: [PATCH] Add front - actual SignUp.vue
---
frontend/src/components/login/SignUp.vue | 99 ++++++++++++++++++++++++
1 file changed, 99 insertions(+)
create mode 100644 frontend/src/components/login/SignUp.vue
diff --git a/frontend/src/components/login/SignUp.vue b/frontend/src/components/login/SignUp.vue
new file mode 100644
index 0000000..499aef0
--- /dev/null
+++ b/frontend/src/components/login/SignUp.vue
@@ -0,0 +1,99 @@
+<template>
+ <div>
+ <md-card class="md-layout-item md-size-50 md-small-size-100">
+ <md-card-header>
+ <div class="md-title"> Sign Up</div>
+ </md-card-header>
+
+ <md-card-content>
+ <md-field>
+ <label for="name">Name</label>
+ <md-input name="name" v-model="user.name" />
+ </md-field>
+
+ <md-field>
+ <label for="id">ID</label>
+ <md-input name="id" v-model="user.id" />
+ </md-field>
+
+ <md-field :md-toggle-password="true">
+ <label for="password">Password</label>
+ <md-input name="password" v-model="user.password" type="password"/>
+ </md-field>
+
+ <md-field>
+ <label for="email">Email</label>
+ <md-input name="email" v-model="user.email" />
+ </md-field>
+ </md-card-content>
+
+ <md-card-actions>
+ <md-button class="md-raised md-primary" v-on:click="signUp">Sign Up</md-button>
+ </md-card-actions>
+ </md-card>
+ </div>
+</template>
+
+<style>
+
+.md-card {
+ margin: auto;
+}
+
+.md-primary {
+ background-color: blue;
+ color:white;
+}
+</style>
+
+<script>
+import Vue from 'vue'
+
+import VueMaterial from 'vue-material'
+import 'vue-material/dist/vue-material.min.css'
+import 'vue-material/dist/theme/default.css'
+Vue.use(VueMaterial)
+
+// import {MdField, MdButton, MdCard, MdInput} from 'vue-material/dist/components'
+// import 'vue-material/dist/vue-material.min.css'
+// import 'vue-material/dist/theme/default.css'
+
+// Vue.use(MdField)
+// Vue.use(MdButton)
+// Vue.use(MdCard)
+// Vue.use(MdInput)
+
+export default {
+ data: function () {
+ return {
+ user: {
+ id: '',
+ password: '',
+ name: '',
+ email: '',
+ isLoggedIn: false
+ },
+ sending: false
+ }
+ },
+ methods: {
+ signUp: function (event) {
+ this.$http.post('/api/login/signUp', { //axios 사용
+ user: this.user
+ })
+ .then((response) => {
+ if (response.data.result === 0) {
+ alert('Error, please, try again')
+ }
+ if (response.data.result === 1) {
+ alert('Success')
+ this.$router.push('/') // Home 페이지로 보내줌
+ }
+ })
+ .catch(function (error) {
+ alert('error')
+ })
+ }
+ }
+}
+</script>
\ No newline at end of file
--
GitLab