merge contact

@@ -4,6 +4,7 @@ const XLSX = require('xlsx');
 var multer = require('multer');
 var fs = require('fs');
 var xl = require('excel4node');
+const path = require('path');
 // var pool = require('./../routes/modules/database');
 
 //파일 저장위치와 파일이름 설정

@@ -70,7 +70,6 @@ function deleteFile(fileData) {
 		},
 	});
 }
-
 function downloadFile(fileData) {
 	return axios.get(`/api/file/download/${fileData.fileName}`, {
 		params: {
@@ -158,6 +157,26 @@ function tdelAll(userId) {
 		},
 	});
 }
+function uploadContact(contactData){
+	return axios.post('/api/contact/contact_upload', contactData.file,{
+		headers: {
+			'Content-Type': 'multipart/form-data',
+		},
+		params:{
+				id: contactData.id,
+		}
+	});
+}
+function downloadContact(userID){
+	return axios.post('/api/contact/contact_download', null, {params:{id:userID}});
+}
+function printContact(userID){
+	console.log(String(userID));
+	return axios.post('api/contact/contact_list', {id:userID}, {params:{id:userID},});
+}
+function deleteContact(userID){
+	return axios.post('api/contact/contact_delete', {id:userID}, {params:{id:userID}});
+}
 
 export {
 	registerUser,
@@ -184,4 +203,8 @@ export {
 	tdelFile,
 	tdelAll,
 	showTrashcan,
+	uploadContact,
+	downloadContact,
+	printContact,
+	deleteContact
 };

@@ -285,12 +285,14 @@
 				</v-list-item>
 			</v-list>
 		</v-menu>
+		<div v-cloak @drop.prevnet="addFile" @dragover.prevent>
 			<input
 				id="file-selector"
 				ref="uploadedfile"
 				type="file"
 				v-on:change="handleFileUpload()"
 			/>
+		</div>
 		<br />
 		<v-btn @click="upload_file"><v-icon>fas fa-upload</v-icon></v-btn>
 		<v-btn bottom color="blue" dark fab fixed right @click="dialog = !dialog">
@@ -404,6 +406,11 @@ export default {
 		$route: 'fetchData',
 	},
 	methods: {
+		addFile(event){
+			let droppedFiles = event.dataTransfer.files;
+			if(!droppedFiles) return;
+			console.log(droppedFiles);
+		},
 		async fetchData() {
 			try {
 				const curData = {

-<template>
-  <v-container fluid>
-    <v-card-title>
-    연락처
-    <v-spacer></v-spacer>
+<template lang="html">
+  <v-flex>
+    <h1>연락처</h1>
     <v-text-field
       v-model="search"
       append-icon="mdi-magnify"
-      label="연락처 검색"
+      label="Search"
       single-line
       hide-details
     ></v-text-field>
-    </v-card-title>
+<!--
+    <v-simple-table>
+      <template v-slot:default>
+        <thead>
+          <tr>
+            <th class="text-left">Name</th>
+            <th class="text-left">Phone</th>
+            <th class="text-left">Email</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="item in contact_list" :key="item.name">
+            <td>{{ item.name }}</td>
+            <td>{{ item.phone}}</td>
+            <td>{{ item.email }}</td>
+          </tr>
+        </tbody>
+      </template>
+    </v-simple-table>
+-->
     <v-data-table
       :headers="headers"
-      :items="desserts"
-      :items-per-page="10"
-      class="elevation-1"
-    ></v-data-table>
-  </v-container>
+      :items="contact_list"
+      :search="search"
+    >
+    </v-data-table>
+    <v-divider></v-divider>
+    <div v-cloak @drop.prevnet="addContact" @dragover.prevent>
+      <input
+        id="file-selector"
+        ref="uploadedfile"
+        type="file"
+        v-on:change="handleFileUpload()"
+      />
+    </div>
+    <br />
+    <v-btn color="blue" @click="upload_contact">upload</v-btn>
+    <v-btn color="green" @click = "download_contact">download</v-btn>
+    <v-btn color="gray" @click = "delete_contact">delete</v-btn>
+  </v-flex>
 </template>
 
 <script>
+  import { uploadContact, downloadContact, printContact, deleteContact } from '../api/index';
+  import Axios from 'axios';
   export default {
-    data () {
+    data() {
       return {
-        headers: [
+        search:'',
+        headers:[
           {
             text: 'Name',
             align: 'start',
             sortable: false,
-            value: 'name',
+            value: 'name'
           },
-          { text: 'Phone', value: 'Phone' },
-          { text: 'E-mail', value: 'Email' },
-          { text: 'Added date', value: 'date' }
+          {text: 'phone', value:'email'},
+          {text:'email', value:'phone'}
         ],
-        desserts: [
-          {
-            name: 'Frozen Yogurt',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
-          },
-          {
-            name: 'Ice cream sandwich',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
-          },
-          {
-            name: 'Eclair',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
-          },
-          {
-            name: 'Cupcake',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
-          },
-          {
-            name: 'Gingerbread',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
+        contact_list : [],
+        contact_file : null
+      }
     },
-          {
-            name: 'Jelly bean',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
+    async created(){
+        try {
+          const curData = {
+            id : this.$store.state.id,
+          }
+          const list_reponse = await printContact(curData.id);
+          this.$store.commit('setContactList', list_reponse.data.contact_list);
+          this.contact_list = this.$store.getters.contact;
+          console.log(list_reponse);
+        } catch (error) {
+          console.log("에러");
+          console.log(error);
+        }
     },
-          {
-            name: 'Lollipop',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
+    methods:{
+      handleFileUpload() {
+        this.contact_file = this.$refs.uploadedfile.files[0];
+        console.log(this.contact_file);
       },
-          {
-            name: 'Honeycomb',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
+      addContact(event){
+        let droppedFiles = event.dataTransfer.files;
+        if(!droppedFiles) return;
+        console.log(droppedFiles);
       },
-          {
-            name: 'Donut',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
-          },
-          {
-            name: 'KitKat',
-            Phone: '010-1111-1111',
-            Email: 'asdf@asdf.com',
-            date: '2020-05-18'
+      async upload_contact(){
+        try {
+          const formData = new FormData();
+          formData.append('file', this.contact_file);
+          const currentData = {
+            id: this.$store.state.id
+          };
+          const fileData = {
+            id: this.$store.state.id,
+            file: formData
+          }
+          console.log(fileData);
+          const response = await uploadContact(fileData);
+          const contact_response = await printContact(currentData.id);
+          console.log(contact_response);
+          this.$store.commit('setContactList', contact_response.data.contact_list);
+          console.log(this.$store.getters.contact);
+          this.contact_list = this.$store.getters.contact;
+        } catch (error) {
+          console.log('에러');
+          console.log(error);
+        }
       },
-        ],
+      async download_contact(){
+        try{
+          const curData= {
+            id: this.$store.state.id
+          };
+          console.log(curData);
+          const response = await downloadContact(curData.id);
+          console.log(response);
+        }catch(error){
+          console.log('에러');
+          console.log(error);
         }
       },
+      async delete_contact(){
+        try{
+          const curData = {
+            id: this.$store.state.id
+          };
+          const response_d = await deleteContact(curData.id);
+
+          const contact_response = await printContact(curData.id);
+
+          this.$store.commit('setContactList', contact_response.data.contact_list);
+
+          this.contact_list = this.$store.getters.contact;
+        }catch(error){
+          console.log('에러');
+          console.log(error);
+        }
+      }
+
+    }
   }
 </script>
+
+<style lang="css" scoped>
+</style>

@@ -15,6 +15,7 @@ export default new Vuex.Store({
 		favFileList: [],
 		trashFolderList: [],
 		trashFileList: [],
+		contactList:[]
 	},
 	mutations: {
 		setId(state, userid) {
@@ -50,6 +51,9 @@ export default new Vuex.Store({
 		settrashFileList(state, tflist) {
 			state.trashFileList = tflist;
 		},
+		setContactList(state, list){
+			state.contactList = list;
+		}
 	},
 	getters: {
 		isLogin(state) {
@@ -88,5 +92,8 @@ export default new Vuex.Store({
 		trashFileL(state) {
 			return state.trashFileList;
 		},
+		contact(state){
+			return state.contactList;
+		}
 	},
 });