Compare revisions

b835e437 · b835e437 · b835e437 · b835e437 · b835e437 · b835e437
--- a/frontend/src/components/login/SignUp.vue
+++ b/frontend/src/components/login/SignUp.vue
+<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>
--- a/frontend/src/components/profile.vue
+++ b/frontend/src/components/profile.vue
+<template>
+  <!DOCTYPE html>
+  <html lang="en">
+    <head>
+      <meta charset="UTF-8" />
+      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+      <title>Majorbook</title>
+    </head>
+    <body>
+      <h1>My Page-2</h1>
+      dfsd
+      <button>수정하기</button>
+    </body>
+  </html>
+</template>
--- a/frontend/src/components/signup.vue
+++ b/frontend/src/components/signup.vue
+<template>
+    <h1> 회원가입 </h1>
+</template>
+
+<script>
+export default{
+    data() {
+        return{
+            name : '',
+            univ : '',
+            email : ''
+        }
+    },
+    computed:{
+    },
+    methods:{
+    }
+    }
+</script>
+
+<style lang='css'>
+
+
+</style>
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -3,15 +3,18 @@
 import Vue from 'vue'
 import App from './App'
 import router from './router'
-import axios from 'axios'

+import axios from 'axios'
+import Vuetify from 'vuetify'
+import 'vuetify/dist/vuetify.min.css'
+Vue.use(Vuetify)
 Vue.prototype.$http = axios
 Vue.config.productionTip = false
-
 /* eslint-disable no-new */
 new Vue({
  el: '#app',
  router,
  components: { App },
-  template: '<App/>'
+  template: '<App/>',
+  render: h => h(App)
 })
--- a/frontend/src/router/index.js
+++ b/frontend/src/router/index.js
-import Vue from 'vue'
-import Router from 'vue-router'
-
-
-Vue.use(Router)
-
-//import IndexPage from '@/components/IndexPage'
-import BookIndexPage from '@/components/BookIndexPage'
-import BookShowPage from '@/components/BookShowPage'
+import Vue from "vue";
+import Router from "vue-router";
+Vue.use(Router);
+import home from "@/components/home";
+import dashBoard from "@/components/dashBoard";
+import profile from "@/components/profile";
+import signup from "@/components/signup";
+import BookSearchPage from "@/components/BookSearchPage";
+import BookIndexPage from "@/components/BookIndexPage";
+import BookShowPage from "@/components/BookShowPage";
+import Login from "@/components/login/Login";
+import SignUp from "@/components/login/SignUp";

 export default new Router({
-  mode: 'history',
  routes: [
-    // {
-    //   path: '/',
-    //   name: 'IndexPage',
-    //   component: IndexPage
-    // },
-
    {
-      path: '/',
-      name: 'bookindex',
+      path: "/",
+      name: "home",
+      component: home
+    },
+    {
+      path: "/dashBoard",
+      name: "dashBoard",
+      component: dashBoard
+    },
+    {
+      path: "/profile",
+      name: "profile",
+      component: profile
+    },
+    {
+      path: "/signup",
+      name: "signup",
+      component: signup
+    },
+    {
+      path: "/BookIndexPage",
+      name: "bookindex",
      component: BookIndexPage
    },
    {
-      path: '/:id',
-      name: 'bookdetail',
+      path: "/BookIndexPage:id",
+      name: "bookdetail",
      component: BookShowPage
+    },
+    {
+      path: "/BookSearchPage",
+      name: "bookindex",
+      component: BookSearchPage
+    },
+    {
+      path: "/login",
+      name: "Login",
+      component: Login
+    },
+    {
+      path: "/login/signUp",
+      name: "SignUp",
+      component: SignUp
    }
  ]
-})
+});
--- a/frontend/static/img/img2.jpg
+++ b/frontend/static/img/img2.jpg
No results found