diff --git a/src/views/FinderBoard.vue b/src/views/FinderBoard.vue index 0bbafa21c10d83b9e1d57d3d9b3b9ef92bb646c5..c11d719442d338cb6ede834bb3f2b25853c0b6f0 100644 --- a/src/views/FinderBoard.vue +++ b/src/views/FinderBoard.vue @@ -49,7 +49,9 @@ <span class="subheading font-weight-light text-success text--darken-3" v-text="header.text"/> </template> <template slot="items" slot-scope="{item}" v-if="items"> - <td>{{ item.writer }}</td> + <td> + <img v-bind:src="item.image" id="image" width="100px" height="100px" /> + </td> <td> <!-- <v-btn class="v-btn--simple" @click="showPost(item._id)" value="item.title" >{{item.title}}</v-btn> --> <v-btn @@ -78,7 +80,9 @@ export default { ], items: [], search: '', - loginDialog: false + loginDialog: false, + image:null + }), created() { if(this.$store.state.isUserInfoGetted === false){ @@ -88,9 +92,11 @@ export default { this.$http.get('/finderboard') .then(response => { this.items = response.data.finderboards; - }).catch(err => { - alert("ERR while FET finderboard" + err) - }); + for(let i=0; i<this.items.length; i++){ + var base64data=Buffer.from(this.items[i].image.data.data,'binary').toString('base64'); + this.items[i].image='data:image/jpeg;base64,'+base64data; + } + }) } }, methods: { diff --git a/src/views/LosterBoard.vue b/src/views/LosterBoard.vue index cf5d059fc45d4a28e15dd171c4fe1cecd44c6da6..fe9778d0481d3f6431694acd1a382ad63cddc4d6 100644 --- a/src/views/LosterBoard.vue +++ b/src/views/LosterBoard.vue @@ -48,7 +48,9 @@ <span class="subheading font-weight-light text-success text--darken-3" v-text="header.text"/> </template> <template slot="items" slot-scope="{item}" v-if="items"> - <td>{{ item.writer }}</td> + <td> + <img v-bind:src="item.image" id="image" width="100px" height="100px" /> + </td> <td> <v-btn text color="blue" @click="showPost(item._id)" value="item.title">{{item.title}}</v-btn> </td> @@ -73,7 +75,9 @@ export default { ], items: [], search: '', - loginDialog: false + loginDialog: false, + image:null + }), created() { if(this.$store.state.isUserInfoGetted === false){ @@ -83,8 +87,10 @@ export default { this.$http.get('/losterboard') .then(response => { this.items = response.data.losterboards; - console.log(this.items); - console.log(this.items[0].body) + for(let i=0; i<this.items.length; i++){ + var base64data=Buffer.from(this.items[i].image.data.data,'binary').toString('base64'); + this.items[i].image='data:image/jpeg;base64,'+base64data; + } }).catch(err => { alert("ERR while FET losterboard" + err) }); diff --git a/src/views/ShowFindPost.vue b/src/views/ShowFindPost.vue index 517faebf320177403cf6cd7aec15b7e0240b8c0a..d31585c47d00ab086490cf88482aecae6f398fc8 100644 --- a/src/views/ShowFindPost.vue +++ b/src/views/ShowFindPost.vue @@ -2,32 +2,37 @@ <v-container fill-height fluid grid-list-xl> <v-layout justify-center wrap> <v-flex xs12 md8> - <material-card color="green" title="Edit Profile" text="Complete your profile"> + <material-card color="green" v-bind:title="findpost.title" v-bind:text="findpost.created" display-2> <v-form> <v-container py-0> <v-layout wrap column> <v-flex xs12 md4> - <strong class="display-3">{{findpost.title}}</strong> - </v-flex> - <v-flex xs12 md4> - <strong class="display-1 right" >{{findpost.writer}}</strong> + <strong class="display-3"></strong> </v-flex> + <v-flex xs12 md6> + <v-card class="d-flex pa-2" outlined tile> + <img :src="image" id="image" width="500px" height="500px" /> + </v-card> <v-card class="d-flex pa-2" outlined tile> <blockquote class="blockquote">{{findpost.body}}</blockquote> </v-card> </v-flex> <v-flex xs12 md6> - <strong class="title right" >견종: {{findpost.petType}}</strong> + <strong class="title right" >견종 : {{findpost.petType}}</strong> </v-flex> <v-flex xs12 md4> - <strong class="title right" >발견장소: {{findpost.findPlace}}</strong> + <strong class="title right" >발견장소 : {{findpost.findPlace}}</strong> </v-flex> <v-flex xs12 md4> - <strong class="title right" >발견일시: {{findpost.findDate}}</strong> + <strong class="title right" >발견일시 : {{findpost.findDate}}</strong> </v-flex> - <img :src="image" id="image"> + <v-flex xs12 md4> + <strong class="title right" >작성자 : {{findpost.writer}}</strong> + </v-flex> + + <v-divider></v-divider> <v-divider></v-divider> diff --git a/src/views/ShowLostPost.vue b/src/views/ShowLostPost.vue index e3c3f1fde3dab9a51aa9a876e7989432ac928dc3..07cbe1429e62a29ba2e05eb86d640a0c070004a3 100644 --- a/src/views/ShowLostPost.vue +++ b/src/views/ShowLostPost.vue @@ -2,32 +2,33 @@ <v-container fill-height fluid grid-list-xl> <v-layout justify-center wrap> <v-flex xs12 md8> - <material-card color="green" title="Edit Profile" text="Complete your profile"> + <material-card color="green" v-bind:title="lostpost.title" v-bind:text="lostpost.created"> <v-form> <v-container py-0> <v-layout wrap column> <v-flex xs12 md4> - <strong class="display-3">{{lostpost.title}}</strong> - </v-flex> - <v-flex xs12 md4> - <strong class="display-1 right" >{{lostpost.writer}}</strong> - </v-flex> + <strong class="display-3"></strong> + </v-flex> <v-flex xs12 md6> + <v-card class="d-flex pa-2" outlined tile> + <img :src="image" id="image" width="500px" height="500px" /> + </v-card> <v-card class="d-flex pa-2" outlined tile> <blockquote class="blockquote">{{lostpost.body}}</blockquote> </v-card> </v-flex> <v-flex xs12 md6> - <strong class="title right" >견종: {{lostpost.petType}}</strong> + <strong class="title right" >견종 : {{lostpost.petType}}</strong> </v-flex> <v-flex xs12 md4> - <strong class="title right" >실종장소: {{lostpost.lostPlace}}</strong> + <strong class="title right" >실종장소 : {{lostpost.lostPlace}}</strong> </v-flex> <v-flex xs12 md4> - <strong class="title right" >실종일시: {{lostpost.lostDate}}</strong> + <strong class="title right" >실종일시 : {{lostpost.lostDate}}</strong> + </v-flex> + <v-flex xs12 md4> + <strong class="title right" >작성자 : {{lostpost.writer}}</strong> </v-flex> - <img :src="image" id="image"> - <v-divider></v-divider> <v-divider></v-divider> diff --git a/src/views/WriteFindPost.vue b/src/views/WriteFindPost.vue index 687857be2493d8a019817120126b1514c6ea8650..b792ecb354394410403999a9e37123d0c8e70f38 100644 --- a/src/views/WriteFindPost.vue +++ b/src/views/WriteFindPost.vue @@ -9,7 +9,7 @@ <!-- <v-flex xs12 md4> <v-text-field label="글 제목" v-model="findpost.title"/> </v-flex> --> - <v-flex xs12 md4> + <v-flex xs12 md12> <v-text-field label="반려견 견종" v-model="petType" class="purple-input"/> </v-flex> <v-flex xs12 md12> diff --git a/src/views/WriteLostPost.vue b/src/views/WriteLostPost.vue index 852483317424e4fb8ad8dd3be23d116ce4920f53..e0930d5621dffc39c23c78f8902fc06b71b36079 100644 --- a/src/views/WriteLostPost.vue +++ b/src/views/WriteLostPost.vue @@ -5,29 +5,30 @@ <material-card color="green" title="실종 게시글 작성" text="게시글 작성을 위한 정보를 입력해 주세요."> <v-form> <v-container py-0> - <v-layout wrap> - <v-flex xs12 md4> + <v-layout column wrap> + <!-- <v-flex xs12 md4></v-flex> <v-text-field label="글 제목" v-model="title"/> - </v-flex> - <v-flex xs12 md4> - <v-text-field label="내용" v-model="body" class="purple-input" /> - </v-flex> - <v-flex xs12 md4> + </v-flex> --> + <br/> + <v-flex xs12 md12> <v-text-field label="반려견 이름" v-model="petName" class="purple-input"/> </v-flex> - <v-flex xs12 md6> + <v-flex xs12 md12> <v-text-field label="반려견 성별" v-model="petSex" class="purple-input"/> </v-flex> - <v-flex xs12 md6> + <v-flex xs12 md12> <v-text-field label="반려견 견종" v-model="petType" class="purple-input"/> </v-flex> <v-flex xs12 md12> <v-text-field label="잃어버린 장소" v-model="lostPlace" class="purple-input"/> </v-flex> - <v-flex xs12 md4> + <v-flex xs12 md12> <v-text-field label="잃어버린 시간" v-model="lostDate" class="purple-input"/> </v-flex> - <v-flex xs12 md4> + <v-flex xs12 md12> + <v-text-field label="내용" v-model="body" class="purple-input" /> + </v-flex> + <v-flex xs12 md12> <v-text-field label="사례금(만원)" v-model="money" class="purple-input"/> </v-flex> <v-flex xs12 md12>