Skip to content
Snippets Groups Projects
Commit d4cfa0e2 authored by LEEYOONGU's avatar LEEYOONGU Committed by LeeYongJae
Browse files

프론트엔드책목록받아오기

parent 50b6241d
No related branches found
No related tags found
No related merge requests found
......@@ -5,7 +5,7 @@ var autoInc = require("mongoose-auto-increment");
const BookSchema = new Schema({
_id: { type: Number },
title: { type: String },
grade: { type: Number },
grade: { type: String },
major: { type: String },
type: { type: String },
src: { type: String },
......
......@@ -434,6 +434,11 @@
}
}
},
"extend": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
"integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
},
"finalhandler": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-1.1.1.tgz",
......@@ -684,6 +689,14 @@
}
}
},
"mongoose-auto-increment": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/mongoose-auto-increment/-/mongoose-auto-increment-5.0.1.tgz",
"integrity": "sha1-gn4FHZzDcdq+i/8acEQx00HLed8=",
"requires": {
"extend": "^3.0.0"
}
},
"mongoose-legacy-pluralize": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/mongoose-legacy-pluralize/-/mongoose-legacy-pluralize-1.0.2.tgz",
......
This diff is collapsed.
......@@ -3,8 +3,8 @@
<div class="select">
<multiselect
style="float: left; marginLeft: 15%; width: 20%;"
v-model="grade"
:options="option1"
v-model.number="grade"
:options="option1"
></multiselect>
<multiselect
style="float: left; marginLeft: 0.5%; width: 20%;"
......@@ -26,15 +26,15 @@
>
<!-- ==================================================================== -->
<div v-if="SearchResult === true">
<div v-for="Book in Books" :key="Book._id">
<div v-if="SearchResult === true ">
<div v-for="Book in Books" :key="Book._id" v-if="Book.grade.includes(grade) && Book.major.includes(major)" >
<md-card
style="width: 50%; margin: 4px;marginTop:100px; display: inline-block; vertical-align: top;"
>
<md-card-header>
<md-card-header-text>
<div class="md-title">
{{ Book.title }}
{{ Book.title }}
<br />
<br />
</div>
......@@ -133,7 +133,7 @@ export default {
type: null,
option1: ["1학년", "2학년", "3학년", "4학년"],
option2: ["소프트웨어학과", "미디어학과", "경제학과"],
option3: ["전공 필수", "전공 선택", "교양선택", "기초과목"],
option3: ["test_title2", "전공선택", "교양선택", "기초과목"],
Books: [],
submit: {
title: "",
......@@ -150,16 +150,12 @@ export default {
this.Books = response.data;
console.log("Success");
console.log(this.Books);
});
},
methods: {
Search: function() {
if (this.grade !== null && this.major !== null && this.type !== null) {
this.SearchResult = true;
console.log(this.SearchResult);
} else {
alert("검색할 카테고리를 전부 입력해주세요");
}
this.SearchResult = true;
},
Register() {
this.$http
......
<template>
<div>
<div class="md-layout" style="display: block; color:#F6F6F6">
<div class="md-layout-item">
<Hotlist />
</div>
<div class="md-layout-item" style="backgroundColor:#F2CB61;">home</div>
<div class="md-layout-item" style="backgroundColor:#353535;">Implemented by 202-WebSysDesign</div>
</div>
</div>
</template>
<script>
import Hotlist from "./home_hotlist/HotList";
export default {
created() {
this
.$http
.get('/api/emails')
.then(response => {
console.log("Sending Success")
})
},
data() {
return {};
},
components: {
Hotlist
},
methods: {
}
};
</script>
<style lang="css">
html,
body {
text-align: center;
/* margin:0; */
/* width:100%; */
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}
.nav button {
color: #00b7ff;
text-align: center;
padding-right: 8%;
padding-left: 8%;
font-size: 18px;
text-decoration: none;
}
.nav {
background-color: #333;
overflow: hidden;
}
.header {
margin: 15px;
height: 12%;
font-size: 10px;
}
.btn {
color: #00b7ff;
background-color: #333;
border-radius: 15%;
}
h1 {
text-align: left;
font-size: 35px;
}
.section {
height: 110%;
width: 100%;
}
.aside {
height: 40px;
background-color: rgb(255, 220, 123);
}
.footer {
height: 20px;
color: white;
background-color: #333;
}
.myPage {
display: block;
margin-left: auto;
margin-right: auto;
height: 400px;
}
</style>
<template>
<div>
<md-table v-model="searched" md-sort="name" md-sort-order="asc" md-card md-fixed-header>
<md-table-toolbar>
<div class="md-toolbar-section-start" style="min-height: 100px"></div>
<md-field md-clearable class="md-toolbar-section-end" style="max-width: 300px;">
<md-input placeholder="책 이름으로 검색" v-model="search" @input="searchOnTable" />
</md-field>
</md-table-toolbar>
<md-table-empty-state md-label="No Result" :md-description="`해당 이름으로 된 책이 없습니다.`">
<md-button class="md-primary md-raised" @click="newUser">판매 등록하기</md-button>
</md-table-empty-state>
<md-table v-model="users" md-sort="title" md-sort-order="asc" md-card md-fixed-header>
<md-table-row slot="md-table-row" slot-scope="{ item }" style="margin-top:100px">
<md-table-cell md-label="판매순위" md-sort-by="id" md-numeric>
<md-table-cell md-label="재고" md-sort-by="stock" md-numeric>
{{
item.id
item.stock
}}
</md-table-cell>
<md-table-cell md-label="전공" md-sort-by="name">
<md-table-cell md-label="전공" md-sort-by="major">
{{
item.name
item.major
}}
</md-table-cell>
<md-table-cell md-label="책이름" md-sort-by="email">
<md-table-cell md-label="책이름" md-sort-by="title">
{{
item.email
item.title
}}
</md-table-cell>
<md-table-cell>
......@@ -34,6 +25,7 @@
<md-button class="md-raised md-accent">판매</md-button>
</md-table-cell>
</md-table-row>
</md-table>
</div>
</template>
......@@ -45,170 +37,27 @@ const toLower = text => {
const searchByName = (items, term) => {
if (term) {
return items.filter(item => toLower(item.name).includes(toLower(term)));
return items.filter(item => toLower(item.title).includes(toLower(term)));
}
return items;
};
export default {
name: "TableSearch",
data: () => ({
search: null,
searched: [],
users: [
{
id: 1,
name: "Shawna Dubbin",
email: "sdubbin0@geocities.com",
gender: "Male",
title: "Assistant Media Planner"
},
{
id: 2,
name: "Odette Demageard",
email: "odemageard1@spotify.com",
gender: "Female",
title: "Account Coordinator"
},
{
id: 3,
name: "Vera Taleworth",
email: "vtaleworth2@google.ca",
gender: "Male",
title: "Community Outreach Specialist"
},
{
id: 4,
name: "Lonnie Izkovitz",
email: "lizkovitz3@youtu.be",
gender: "Female",
title: "Operator"
},
{
id: 5,
name: "Thatcher Stave",
email: "tstave4@reference.com",
gender: "Male",
title: "Software Test Engineer III"
},
{
id: 6,
name: "Karim Chipping",
email: "kchipping5@scribd.com",
gender: "Female",
title: "Safety Technician II"
},
{
id: 7,
name: "Helge Holyard",
email: "hholyard6@howstuffworks.com",
gender: "Female",
title: "Internal Auditor"
},
{
id: 8,
name: "Rod Titterton",
email: "rtitterton7@nydailynews.com",
gender: "Male",
title: "Technical Writer"
},
{
id: 9,
name: "Gawen Applewhite",
email: "gapplewhite8@reverbnation.com",
gender: "Female",
title: "GIS Technical Architect"
},
{
id: 10,
name: "Nero Mulgrew",
email: "nmulgrew9@plala.or.jp",
gender: "Female",
title: "Staff Scientist"
},
{
id: 11,
name: "Cybill Rimington",
email: "crimingtona@usnews.com",
gender: "Female",
title: "Assistant Professor"
},
{
id: 12,
name: "Maureene Eggleson",
email: "megglesonb@elpais.com",
gender: "Male",
title: "Recruiting Manager"
},
{
id: 13,
name: "Cortney Caulket",
email: "ccaulketc@cbsnews.com",
gender: "Male",
title: "Safety Technician IV"
},
{
id: 14,
name: "Selig Swynfen",
email: "sswynfend@cpanel.net",
gender: "Female",
title: "Environmental Specialist"
},
{
id: 15,
name: "Ingar Raggles",
email: "iragglese@cbc.ca",
gender: "Female",
title: "VP Sales"
},
{
id: 16,
name: "Karmen Mines",
email: "kminesf@topsy.com",
gender: "Male",
title: "Administrative Officer"
},
{
id: 17,
name: "Salome Judron",
email: "sjudrong@jigsy.com",
gender: "Male",
title: "Staff Scientist"
},
{
id: 18,
name: "Clarinda Marieton",
email: "cmarietonh@theatlantic.com",
gender: "Male",
title: "Paralegal"
},
{
id: 19,
name: "Paxon Lotterington",
email: "plotteringtoni@netvibes.com",
gender: "Female",
title: "Marketing Assistant"
},
{
id: 20,
name: "Maura Thoms",
email: "mthomsj@webeden.co.uk",
gender: "Male",
title: "Actuary"
}
]
}),
methods: {
newUser() {
window.alert("판매 등록을 클릭했습니다.");
},
searchOnTable() {
this.searched = searchByName(this.users, this.search);
}
},
created() {
this.searched = this.users;
this.$http.get("/api/books").then(response => {
this.users = response.data;
console.log("success");
console.log(this.users);
});
}
};
</script>
......@@ -217,5 +66,4 @@ export default {
.md-field {
max-width: 500px;
}
</style>
......@@ -7,30 +7,29 @@
<section id="section2">
<sellist />
</section>
<aside>
<profiledit />
</aside>
</body>
</html>
</template>
<script>
import buylist from "./profilecomponent/buylist"
import sellist from "./profilecomponent/sellist"
import profiledit from "./profilecomponent/profiledit"
export default {
data() {
return {};
},
data: () => ({
users: [
]
}),
components: {
buylist,
profiledit,
sellist
},
methods: {
checked () {
return true;
}
}
},
};
</script>
......@@ -43,33 +42,22 @@ components: {
#section1 {
float: left;
width: 50%;
height: 300px;
height: 600px;
margin-right: auto;
padding-right: auto;
border-style: groove;
background-color: #FFF;
}
#section2 {
float: right;
width: 50%;
height: 300px;
height: 600px;
margin-right: auto;
padding-right: auto;
border-style: groove;
background-color: #FFF;
}
aside {
float: left;
width: 50%;
height: 300px;
margin-right: auto;
padding-right: auto;
background-color: white;
border-style: groove;
}
</style>
\ No newline at end of file
......@@ -4,12 +4,12 @@
<span>Buylist</span>
</md-toolbar>
<md-list class="md-double-line" style="height : 230px">
<md-list-item>
<md-list-item v-for="user in users" :key="user.title">
<md-button class="md-icon-button md-raised" style="color:#1DDB16;backgroundColor:#1DDB16">
<img src="../../assets/book-open-flat.png" />
</md-button>
<div class="md-list-item-text">
<span>&nbsp;&nbsp;책 제목</span>
<span>&nbsp;&nbsp; {{user.title}}</span>
<span>&nbsp;&nbsp;구매 대기중</span>
</div>
<md-button class="md-icon-button md-raised md-accent">
......@@ -19,72 +19,8 @@
<img src="../../assets/check-icon.png" />
</md-button>
</md-list-item>
<md-divider></md-divider>
<md-list-item>
<md-button class="md-icon-button md-raised" style="color:#1DDB16;backgroundColor:#1DDB16">
<img src="../../assets/book-open-flat.png" />
</md-button>
<div class="md-list-item-text">
<span>&nbsp;&nbsp;책 제목</span>
<span>&nbsp;&nbsp;구매 대기중</span>
</div>
<md-button class="md-icon-button md-raised md-accent">
<img src="../../assets/x-512.png" />
</md-button>
<md-button class="md-icon-button md-raised md-primary">
<img src="../../assets/check-icon.png" />
</md-button>
</md-list-item>
<md-divider></md-divider>
<md-list-item>
<md-button class="md-icon-button md-raised" style="color:#1DDB16;backgroundColor:#1DDB16">
<img src="../../assets/book-open-flat.png" />
</md-button>
<div class="md-list-item-text">
<span>&nbsp;&nbsp;책 제목</span>
<span>&nbsp;&nbsp;구매 대기중</span>
</div>
<md-button class="md-icon-button md-raised md-accent">
<img src="../../assets/x-512.png" />
</md-button>
<md-button class="md-icon-button md-raised md-primary">
<img src="../../assets/check-icon.png" />
</md-button>
</md-list-item>
<md-divider></md-divider>
<md-list-item>
<md-button class="md-icon-button md-raised" style="color:#1DDB16;backgroundColor:#1DDB16">
<img src="../../assets/book-open-flat.png" />
</md-button>
<div class="md-list-item-text">
<span>&nbsp;&nbsp;책 제목</span>
<span>&nbsp;&nbsp;구매 대기중</span>
</div>
<md-button class="md-icon-button md-raised md-accent">
<img src="../../assets/x-512.png" />
</md-button>
<md-button class="md-icon-button md-raised md-primary">
<img src="../../assets/check-icon.png" />
</md-button>
</md-list-item>
<md-divider></md-divider>
<md-list-item>
<md-button class="md-icon-button md-raised" style="color:#1DDB16;backgroundColor:#1DDB16">
<img src="../../assets/book-open-flat.png" />
</md-button>
<div class="md-list-item-text">
<span>&nbsp;&nbsp;책 제목</span>
<span>&nbsp;&nbsp;구매 대기중</span>
</div>
<md-button class="md-icon-button md-raised md-accent">
<img src="../../assets/x-512.png" />
</md-button>
<md-button class="md-icon-button md-raised md-primary">
<img src="../../assets/check-icon.png" />
</md-button>
</md-list-item>
<md-divider></md-divider>
</md-list>
</div>
</template>
......@@ -96,8 +32,26 @@ import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default.css'
Vue.use(VueMaterial)
export default {
name: 'SubheaderExample'
name: 'SubheaderExample',
data: () => ({
users: [],
}),
methods: {
},
mounted: function () {
this.$http.get("/api/books").then(response => {
this.users = response.data;
console.log("success");
console.log(this.users);
})
}
}
</script>
<style lang="scss" scoped>
......
<template>
<div class="viewport" style="overflow: auto;">
<md-toolbar :md-elevation="1" style="height : 30px" class="md-title">
<span>Profile 수정</span>
</md-toolbar>
<div style="margin-top:17%; display:inline-block">
<md-chip class="md-primary" md-clickable>회원 정보 수정</md-chip>
</div>
</div>
</template>
<script>
import Vue from 'vue'
import VueMaterial from 'vue-material'
import Multiselect from 'vue-multiselect'
import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default.css'
Vue.use(VueMaterial)
export default {
name: 'SubheaderExample'
}
</script>
<style lang="scss" scoped>
.viewport {
width: 100%;
display: inline-block;
vertical-align: top;
}
</style>
\ No newline at end of file
<template>
<div class="viewport" style="overflow: auto;">
<md-toolbar :md-elevation="1" style="height : 30px" class="md-title">
<span>sellist</span>
<span>Sellist</span>
</md-toolbar>
<md-list class="md-double-line" style="height : 230px">
<md-list-item>
<md-list-item v-for="user in users" :key="user.title">
<md-button class="md-icon-button md-raised" style="color:#1DDB16;backgroundColor:#1DDB16">
<img src="../../assets/book-open-flat.png" />
</md-button>
<div class="md-list-item-text">
<span>&nbsp;&nbsp;책 제목</span>
<span>&nbsp;&nbsp;판매중</span>
<span>&nbsp;&nbsp; {{user.title}}</span>
<span>&nbsp;&nbsp;판매 대기</span>
</div>
<md-button class="md-icon-button md-raised md-accent">
<img src="../../assets/x-512.png" />
......@@ -19,8 +19,8 @@
<img src="../../assets/check-icon.png" />
</md-button>
</md-list-item>
<md-divider></md-divider>
</md-list>
</div>
</template>
......@@ -32,8 +32,26 @@ import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default.css'
Vue.use(VueMaterial)
export default {
name: 'SubheaderExample'
name: 'SubheaderExample',
data: () => ({
users: [],
}),
methods: {
},
mounted: function () {
this.$http.get("/api/books").then(response => {
this.users = response.data;
console.log("success");
console.log(this.users);
})
}
}
</script>
<style lang="scss" scoped>
......
import Vue from "vue";
import Router from "vue-router";
Vue.use(Router);
import home from "@/components/home";
import home from "@/components/home_hotlist/Hotlist";
import mainpage from "@/components/mainpage";
import profile from "@/components/profile";
import BookSearchPage from "@/components/BookSearchPage";
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment