diff --git "a/src/assets/excels/\355\232\214\354\233\220\353\223\261\353\241\235.xlsx" "b/src/assets/excels/\355\232\214\354\233\220\353\223\261\353\241\235.xlsx" index d537721..b957fb7 100644 Binary files "a/src/assets/excels/\355\232\214\354\233\220\353\223\261\353\241\235.xlsx" and "b/src/assets/excels/\355\232\214\354\233\220\353\223\261\353\241\235.xlsx" differ diff --git a/src/assets/scss/component/modal.scss b/src/assets/scss/component/modal.scss index a3fd507..5c325a1 100644 --- a/src/assets/scss/component/modal.scss +++ b/src/assets/scss/component/modal.scss @@ -4,6 +4,7 @@ left: $side-bar-width; width: calc(100vw - $side-bar-width); height: calc(100vh - $nav-bar-height); + padding: 20px 0; background: rgba(255, 255, 255, 0.8); display: flex; justify-content: center; @@ -14,12 +15,16 @@ .modal-content { @include flex-box(column, center, 20px); width: 400px; + max-height: 100%; padding: 0px 30px; border-radius : 10px; box-shadow: $base-shadow; background-color: white; .modal-main { @include flex-box(column, center, 20px); + width: 100%; + max-height: 100%; + overflow: auto; } } @@ -33,4 +38,19 @@ .fade-enter-to, .fade-leave-from{ opacity: 1; +} + +/* 웹킷 브라우저의 스크롤바 숨기기 */ +.modal-main::-webkit-scrollbar { + display: none; +} + +/* 파이어폭스의 스크롤바 숨기기 */ +.modal-main { + scrollbar-width: none; /* Firefox */ +} + +/* Edge, IE 10+, 및 최신 브라우저의 스크롤바 숨기기 */ +.modal-main { + -ms-overflow-style: none; /* IE 10+ */ } \ No newline at end of file diff --git a/src/components/common/ExcelUpload.vue b/src/components/common/ExcelUpload.vue index 4fb9d93..220b036 100644 --- a/src/components/common/ExcelUpload.vue +++ b/src/components/common/ExcelUpload.vue @@ -8,7 +8,7 @@
※ 위 사진처럼 이름과 형식을 맞춰서 입력해주세요 - +
@@ -47,12 +47,6 @@ export default { errorMsg: '', } }, - watch: { - 'store.file': function(newFile) { - this.file = newFile; - console.log(this.file) - } - }, methods: { downloadSample() { const link = this.$refs.hiddenLink; @@ -74,7 +68,6 @@ export default { this.errorMsg = '' this.store.setFile(this.file); - this.store.setIsValid(true); const reader = new FileReader(); @@ -89,10 +82,13 @@ export default { }; reader.readAsArrayBuffer(this.file); - } }, - mounted() { } + mounted() { + this.store.setFile(null); + this.store.setUploadData(null); + this.store.setErrorList(null); + } } diff --git a/src/components/common/input/FileInput.vue b/src/components/common/input/FileInput.vue index 2802f61..240ffdc 100644 --- a/src/components/common/input/FileInput.vue +++ b/src/components/common/input/FileInput.vue @@ -56,11 +56,11 @@ export default { } .file-box { - @include flex-box(row, center, 0px); + @include flex-box(row, start, 0px); @include base-icon; width: 100%; height: 100%; - padding: 0px 10px; + padding: 0px 20px; font-weight: bold; border: $theme-color solid; border-top-right-radius: 5px; diff --git a/src/components/member/MemberCreateTable.vue b/src/components/member/MemberCreateTable.vue index b2b11d8..748343e 100644 --- a/src/components/member/MemberCreateTable.vue +++ b/src/components/member/MemberCreateTable.vue @@ -27,7 +27,7 @@ export default { name: 'MemberCreateTableVue', data() { return { - colums: ['이름', '이메일', '전화번호'] + colums: ['회원명', '이메일', '전화번호'] } }, computed: { diff --git a/src/components/member/modal/MemberBulkErrorModal.vue b/src/components/member/modal/MemberBulkErrorModal.vue new file mode 100644 index 0000000..441c942 --- /dev/null +++ b/src/components/member/modal/MemberBulkErrorModal.vue @@ -0,0 +1,55 @@ + + + + + \ No newline at end of file diff --git a/src/components/member/modal/MemberDeleteModal copy.vue b/src/components/member/modal/MemberDeleteModal copy.vue deleted file mode 100644 index 5159988..0000000 --- a/src/components/member/modal/MemberDeleteModal copy.vue +++ /dev/null @@ -1,62 +0,0 @@ - - - - - \ No newline at end of file diff --git a/src/stores/memberBulk.js b/src/stores/memberBulk.js index 5fb0ff9..b7b9618 100644 --- a/src/stores/memberBulk.js +++ b/src/stores/memberBulk.js @@ -6,18 +6,14 @@ export const useMemberBulkStore = defineStore('memberBulk', { exampleImg: 'example_member.png', download: '회원등록.xlsx', file: null, - isValid: false, uploadData: null, - errorList: null, + errorList: [], } }, actions: { setFile(file) { this.file = file; }, - setIsValid(isValid) { - this.isValid = isValid; - }, setUploadData(uploadData) { this.uploadData = uploadData; }, diff --git a/src/utils/member.js b/src/utils/member.js index 54332b5..2dbbfd5 100644 --- a/src/utils/member.js +++ b/src/utils/member.js @@ -1,7 +1,9 @@ import { useMemberStore } from "@/stores/member"; -import { mainAxios } from "@/utils/axios"; +import { useMemberBulkStore } from "@/stores/memberBulk"; +import { fileAxios, mainAxios } from "@/utils/axios"; const memberStore = useMemberStore(); +const memberBulkStore = useMemberBulkStore(); // 회원 목록 조회 async function getMemberList(keyword, input) { @@ -39,6 +41,25 @@ async function createMember(infos) { return result; } +// 회원 대량 등록 +async function createMemberBulk(file) { + const formData = new FormData(); + formData.append('file', file, 'file'); + + const result = await fileAxios.post('members/bulk-register', formData); + + if (result.code !== 200) { + if (result.data) { + memberBulkStore.errorList = [...result.data]; + } else { + memberBulkStore.errorList = [result.message]; + } + } + + return result; +} + + // 회원 수정 async function updateMember(memberId, infos) { const result = await mainAxios.put(`members/${memberId}`, infos); @@ -57,4 +78,4 @@ async function deleteMember(memberId) { return result; } -export { getMemberList, getMember, createMember, updateMember, deleteMember } \ No newline at end of file +export { getMemberList, getMember, createMember, createMemberBulk, updateMember, deleteMember } \ No newline at end of file diff --git a/src/views/member/MemberBulkCreateView.vue b/src/views/member/MemberBulkCreateView.vue index a64119d..7de5348 100644 --- a/src/views/member/MemberBulkCreateView.vue +++ b/src/views/member/MemberBulkCreateView.vue @@ -4,8 +4,7 @@
- - +
@@ -13,16 +12,19 @@
+ diff --git a/src/views/member/MemberListView.vue b/src/views/member/MemberListView.vue index d90296c..5a410a0 100644 --- a/src/views/member/MemberListView.vue +++ b/src/views/member/MemberListView.vue @@ -99,7 +99,7 @@ export default { @include flex-box(column, space-between, 20px); background: $back-color; width: 100%; - min-height: 100%; + height: 100%; padding: 30px 40px }