

231027 서영석 사용자 회원가입 (수정중)
@f504de62573dc65b0a07dab93a483a6d53feff7c
--- client/views/pages/App.vue
+++ client/views/pages/App.vue
... | ... | @@ -28,7 +28,7 @@ |
28 | 28 |
import AdminFooter from '../layout/AdminFooter.vue'; |
29 | 29 |
|
30 | 30 |
const App = { |
31 |
- data: () => { |
|
31 |
+ data() { |
|
32 | 32 |
return { |
33 | 33 |
title: null, |
34 | 34 |
isLogin: false, |
... | ... | @@ -85,7 +85,7 @@ |
85 | 85 |
'Footer': Footer, |
86 | 86 |
'AdminFooter': AdminFooter, |
87 | 87 |
}, |
88 |
- mounted: () => { |
|
88 |
+ mounted() { |
|
89 | 89 |
console.log('Vue mounted'); |
90 | 90 |
this.loginUserSelectOne(); |
91 | 91 |
// //vue router에게 페이지 변경 요청을 하여, router가 페이지 변경 전, 실행되는 훅(이벤트) |
--- client/views/pages/user/join/Join.vue
+++ client/views/pages/user/join/Join.vue
... | ... | @@ -17,98 +17,6 @@ |
17 | 17 |
</div> |
18 | 18 |
</section> |
19 | 19 |
<div v-if="selectedMembership === 'one'"> |
20 |
- <div class="login-info"> |
|
21 |
- <div> |
|
22 |
- <h3>회원정보</h3> |
|
23 |
- <p>※ 기업회원의 경우 담당자 1인만 가입할 수 있습니다. 이미 가입한 기업은 중복 계정 생성이 불가합니다. |
|
24 |
- </p> |
|
25 |
- <hr> |
|
26 |
- </div> |
|
27 |
- <section class="join-sec1 joinsub0"> |
|
28 |
- <div class="join-sec-sub "> |
|
29 |
- <span>아이디</span> |
|
30 |
- </div> |
|
31 |
- <div> |
|
32 |
- <input type="text" value="아이디를 입력하세요."> |
|
33 |
- </div> |
|
34 |
- <div> |
|
35 |
- |
|
36 |
- <button>중복확인</button> |
|
37 |
- </div> |
|
38 |
- </section> |
|
39 |
- |
|
40 |
- |
|
41 |
- <section class="join-sec2 joinsub"> |
|
42 |
- |
|
43 |
- <div class="join-sec-sub"> |
|
44 |
- <span>기관업체</span> |
|
45 |
- </div> |
|
46 |
- <div class="join-sub-input"> |
|
47 |
- <input type="text"> |
|
48 |
- |
|
49 |
- </div> |
|
50 |
- |
|
51 |
- </section> |
|
52 |
- |
|
53 |
- |
|
54 |
- <section class="join-sec3 joinsub"> |
|
55 |
- <div class="join-sec-sub"> |
|
56 |
- <span>비밀번호</span> |
|
57 |
- </div> |
|
58 |
- <div class="join-sub-input"> |
|
59 |
- <input type="text"> |
|
60 |
- |
|
61 |
- </div> |
|
62 |
- </section> |
|
63 |
- |
|
64 |
- |
|
65 |
- <section class="join-sec4 joinsub"> |
|
66 |
- <div class="join-sec-sub"> |
|
67 |
- <span>비밀번호 확인</span> |
|
68 |
- </div> |
|
69 |
- <div class="join-sub-input"> |
|
70 |
- <input type="text"> |
|
71 |
- |
|
72 |
- </div> |
|
73 |
- </section> |
|
74 |
- |
|
75 |
- |
|
76 |
- <section class="join-sec5 joinsub"> |
|
77 |
- <div class="join-sec-sub"> |
|
78 |
- <span>담당자명<span>(필수)</span></span> |
|
79 |
- </div> |
|
80 |
- <div> |
|
81 |
- <input type="text"> |
|
82 |
- |
|
83 |
- </div> |
|
84 |
- </section> |
|
85 |
- |
|
86 |
- |
|
87 |
- <section class="join-sec6"> |
|
88 |
- <div class="join-sec-sub"> |
|
89 |
- <span>이메일<span>(필수)</span></span> |
|
90 |
- </div> |
|
91 |
- <div class="email-sec"> |
|
92 |
- |
|
93 |
- <div> |
|
94 |
- <input type="text" name="email_id" id="email_id"> |
|
95 |
- </div> |
|
96 |
- <div>@</div> |
|
97 |
- <div> |
|
98 |
- <input type="text" name="email_dns" id="email_dns"> |
|
99 |
- </div> |
|
100 |
- <div> |
|
101 |
- <select name="email_sel" id="email_sel"> |
|
102 |
- <option value="">직접 입력</option> |
|
103 |
- <option value="naver.com">naver</option> |
|
104 |
- <option value="hanmail.net">daum</option> |
|
105 |
- <option value="gmail.com">google</option> |
|
106 |
- </select> |
|
107 |
- </div> |
|
108 |
- </div> |
|
109 |
- |
|
110 |
- </section> |
|
111 |
- </div> |
|
112 | 20 |
<div class="login-info2"> |
113 | 21 |
<div> |
114 | 22 |
<h3>회사소개</h3> |
... | ... | @@ -124,17 +32,27 @@ |
124 | 32 |
</div> |
125 | 33 |
|
126 | 34 |
<div class="login-info-grid-2"> |
35 |
+ <section class="join-sec1 joinsub0"> |
|
36 |
+ <div class="join-sec-sub "> |
|
37 |
+ <span>사업자등록번호</span> |
|
38 |
+ </div> |
|
39 |
+ <div> |
|
40 |
+ <input type="text" v-model="company['company_id']" placeholder="사업자등록번호를 입력하세요."> |
|
41 |
+ </div> |
|
42 |
+ <div> |
|
43 |
+ <button @click="companyIdCheck">중복확인</button> |
|
44 |
+ </div> |
|
45 |
+ <!-- <div v-if="this.companyIdCheck_boolean" style="color:chartreuse"></div> |
|
46 |
+ <div v-else style="color:red">사업자등록번호: 이미 등록되어있는 사업자등록번호 입니다.</div> --> |
|
47 |
+ </section> |
|
127 | 48 |
<section class="join-sec1 joinsub0-1"> |
128 | 49 |
<div class="join-sec-sub "> |
129 | 50 |
<span>회사명</span> |
130 | 51 |
</div> |
131 | 52 |
<div> |
132 |
- <input type="text" value="회사명을 입력해주세요."> |
|
53 |
+ <input type="text" v-model="company['company_nm']" placeholder="회사명을 입력해주세요."> |
|
133 | 54 |
</div> |
134 |
- |
|
135 | 55 |
</section> |
136 |
- |
|
137 |
- |
|
138 | 56 |
<section class="join-sec2 joinsub"> |
139 | 57 |
|
140 | 58 |
<div class="join-sec-sub"> |
... | ... | @@ -153,8 +71,7 @@ |
153 | 71 |
<span>회사소개글</span> |
154 | 72 |
</div> |
155 | 73 |
<div class="join-sub-input"> |
156 |
- <input type="text"> |
|
157 |
- |
|
74 |
+ <input type="text" v-model="company['company_info']"> |
|
158 | 75 |
</div> |
159 | 76 |
</section> |
160 | 77 |
|
... | ... | @@ -165,13 +82,86 @@ |
165 | 82 |
</div> |
166 | 83 |
<div class="join-sub-input"> |
167 | 84 |
<input type="file"> |
168 |
- |
|
169 | 85 |
</div> |
170 | 86 |
</section> |
171 | 87 |
</div> |
172 | 88 |
</div> |
89 |
+ </div> |
|
90 |
+ <div class="login-info"> |
|
91 |
+ <div> |
|
92 |
+ <h3>회원정보</h3> |
|
93 |
+ <p>※ 기업회원의 경우 담당자 1인만 가입할 수 있습니다. 이미 가입한 기업은 중복 계정 생성이 불가합니다. |
|
94 |
+ </p> |
|
95 |
+ <hr> |
|
96 |
+ </div> |
|
97 |
+ <section class="join-sec1 joinsub0"> |
|
98 |
+ <div class="join-sec-sub "> |
|
99 |
+ <span>아이디</span> |
|
100 |
+ </div> |
|
101 |
+ <div> |
|
102 |
+ <input type="text" v-model="user['user_id']" placeholder="아이디를 입력하세요."> |
|
103 |
+ </div> |
|
104 |
+ <div> |
|
105 |
+ |
|
106 |
+ <button @click="userIdCheck">중복확인</button> |
|
107 |
+ </div> |
|
108 |
+ </section> |
|
109 |
+ <section class="join-sec3 joinsub"> |
|
110 |
+ <div class="join-sec-sub"> |
|
111 |
+ <span>비밀번호</span> |
|
112 |
+ </div> |
|
113 |
+ <div class="join-sub-input"> |
|
114 |
+ <input type="text" v-model="user['user_pw']" @change="passwordSyncCheck()" placeholder="비밀번호 입력"> |
|
115 |
+ </div> |
|
116 |
+ </section> |
|
173 | 117 |
|
174 | 118 |
|
119 |
+ <section class="join-sec4 joinsub"> |
|
120 |
+ <div class="join-sec-sub"> |
|
121 |
+ <span>비밀번호 확인</span> |
|
122 |
+ </div> |
|
123 |
+ <div class="join-sub-input"> |
|
124 |
+ <input type="text" v-model="pwCheck" @change="passwordSyncCheck()" placeholder="비밀번호 확인"> |
|
125 |
+ </div> |
|
126 |
+ <div v-if="this.passwordCheckFlag" style="color:chartreuse">비밀번호 일치</div> |
|
127 |
+ <div v-else style="color:red">비밀번호 불일치</div> |
|
128 |
+ </section> |
|
129 |
+ |
|
130 |
+ |
|
131 |
+ <section class="join-sec5 joinsub"> |
|
132 |
+ <div class="join-sec-sub"> |
|
133 |
+ <span>담당자명<span>(필수)</span></span> |
|
134 |
+ </div> |
|
135 |
+ <div> |
|
136 |
+ <input type="text" v-model="user['user_nm']"> |
|
137 |
+ </div> |
|
138 |
+ </section> |
|
139 |
+ |
|
140 |
+ |
|
141 |
+ <section class="join-sec6"> |
|
142 |
+ <div class="join-sec-sub"> |
|
143 |
+ <span>이메일<span>(필수)</span></span> |
|
144 |
+ </div> |
|
145 |
+ <div class="email-sec"> |
|
146 |
+ |
|
147 |
+ <div> |
|
148 |
+ <input type="text" name="email_id" id="email_id" v-model="email_id"> |
|
149 |
+ </div> |
|
150 |
+ <div>@</div> |
|
151 |
+ <div> |
|
152 |
+ <input v-if="select_email_dns==null" type="text" name="email_dns" id="email_dns" v-model="email_dns"> |
|
153 |
+ <input v-else type="text" name="email_dns" id="email_dns" v-model="select_email_dns"> |
|
154 |
+ </div> |
|
155 |
+ <div> |
|
156 |
+ <select name="email_sel" id="email_sel" v-model="select_email_dns"> |
|
157 |
+ <option :value=null>직접 입력</option> |
|
158 |
+ <option value="naver.com">naver.com</option> |
|
159 |
+ <option value="hanmail.net">hanmail.net</option> |
|
160 |
+ <option value="gmail.com">google.com</option> |
|
161 |
+ </select> |
|
162 |
+ </div> |
|
163 |
+ </div> |
|
164 |
+ </section> |
|
175 | 165 |
</div> |
176 | 166 |
</div> |
177 | 167 |
<div v-else> |
... | ... | @@ -185,7 +175,7 @@ |
185 | 175 |
<span>아이디</span> |
186 | 176 |
</div> |
187 | 177 |
<div> |
188 |
- <input type="text" value="아이디를 입력하세요."> |
|
178 |
+ <input type="text" v-model="user['user_id']" placeholder="아이디를 입력하세요."> |
|
189 | 179 |
</div> |
190 | 180 |
<div> |
191 | 181 |
|
... | ... | @@ -212,7 +202,7 @@ |
212 | 202 |
<span>비밀번호</span> |
213 | 203 |
</div> |
214 | 204 |
<div class="join-sub-input"> |
215 |
- <input type="text"> |
|
205 |
+ <input type="text" v-model="user['user_pw']"> |
|
216 | 206 |
|
217 | 207 |
</div> |
218 | 208 |
</section> |
... | ... | @@ -231,10 +221,10 @@ |
231 | 221 |
|
232 | 222 |
<section class="join-sec5 joinsub"> |
233 | 223 |
<div class="join-sec-sub"> |
234 |
- <span>담당자명</span> |
|
224 |
+ <span>이름</span> |
|
235 | 225 |
</div> |
236 | 226 |
<div> |
237 |
- <input type="text"> |
|
227 |
+ <input type="text" v-model="user['user_nm']"> |
|
238 | 228 |
|
239 | 229 |
</div> |
240 | 230 |
</section> |
... | ... | @@ -247,11 +237,11 @@ |
247 | 237 |
<div class="email-sec"> |
248 | 238 |
|
249 | 239 |
<div> |
250 |
- <input type="text" name="email_id" id="email_id"> |
|
240 |
+ <input type="text" name="email_id" id="email_id" v-model="email_id"> |
|
251 | 241 |
</div> |
252 | 242 |
<div>@</div> |
253 | 243 |
<div> |
254 |
- <input type="text" name="email_dns" id="email_dns"> |
|
244 |
+ <input type="text" name="email_dns" id="email_dns" v-model="email_dns"> |
|
255 | 245 |
</div> |
256 | 246 |
<div> |
257 | 247 |
<select name="email_sel" id="email_sel"> |
... | ... | @@ -315,17 +305,101 @@ |
315 | 305 |
</template> |
316 | 306 |
|
317 | 307 |
<script> |
318 |
- |
|
308 |
+import axios from 'axios'; |
|
319 | 309 |
|
320 | 310 |
export default { |
321 | 311 |
data() { |
322 | 312 |
return { |
313 |
+ company:{ |
|
314 |
+ company_id:null, |
|
315 |
+ company_nm:null, |
|
316 |
+ company_info:null, |
|
317 |
+ }, |
|
318 |
+ user:{ |
|
319 |
+ user_id:null, |
|
320 |
+ user_pw:null, |
|
321 |
+ user_eml:null, |
|
322 |
+ user_auth:null, |
|
323 |
+ }, |
|
324 |
+ keyword:{ |
|
325 |
+ |
|
326 |
+ }, |
|
327 |
+ //기업 ID 중복 확인 |
|
328 |
+ companyIdCheck_boolean:null, |
|
329 |
+ //사용자 ID 중복 확인 |
|
330 |
+ userIdCheck_boolean:null, |
|
331 |
+ //PW 확인 |
|
332 |
+ pwCheck:null, |
|
333 |
+ passwordCheckFlag:null, |
|
334 |
+ email_id:null, |
|
335 |
+ email_dns:null, |
|
336 |
+ select_email_dns:null, |
|
323 | 337 |
selectedMembership: 'one', |
324 | 338 |
isVisible: false |
325 | 339 |
} |
326 | 340 |
}, |
327 | 341 |
methods: { |
342 |
+ //비밀번호 매칭 확인 |
|
343 |
+ passwordSyncCheck: function () { |
|
344 |
+ console.log("this.user.user_pw : ", this.user.user_pw); |
|
345 |
+ console.log("this.pwCheck : ", this.pwCheck); |
|
328 | 346 |
|
347 |
+ if (this.user.user_pw != this.pwCheck) this.passwordCheckFlag = false; |
|
348 |
+ else this.passwordCheckFlag = true; |
|
349 |
+ }, |
|
350 |
+ //company ID 중복 검사 |
|
351 |
+ companyIdCheck: function() { |
|
352 |
+ const vm = this; |
|
353 |
+ axios({ |
|
354 |
+ url: '/company/companySelectOne.json', |
|
355 |
+ method: 'post', |
|
356 |
+ herders: { |
|
357 |
+ 'Content-Type': "application/json; charset=UTF-8", |
|
358 |
+ }, |
|
359 |
+ data: vm.company |
|
360 |
+ }).then( function (response) { |
|
361 |
+ // console.log("idCheck - response : ", response.data); |
|
362 |
+ if(response.data != null) { |
|
363 |
+ alert("중복된 사업자등록번호 입니다."); |
|
364 |
+ vm.companyIdCheck_boolean = false; |
|
365 |
+ return false; |
|
366 |
+ } else { |
|
367 |
+ alert("사용가능한 사업자등록번호 입니다."); |
|
368 |
+ vm.companyIdCheck_boolean = true; |
|
369 |
+ return true; |
|
370 |
+ } |
|
371 |
+ }).catch( function (error) { |
|
372 |
+ console.log("companyIdCheck - error : ", error); |
|
373 |
+ alert("중복검사 오류, 다시 시도해주세요."); |
|
374 |
+ }); |
|
375 |
+ }, |
|
376 |
+ |
|
377 |
+ //user ID 중복 검사 |
|
378 |
+ userIdCheck: function() { |
|
379 |
+ const vm = this; |
|
380 |
+ axios({ |
|
381 |
+ url: '/user/userSelectOne.json', |
|
382 |
+ method: 'post', |
|
383 |
+ herders: { |
|
384 |
+ 'Content-Type': "application/json; charset=UTF-8", |
|
385 |
+ }, |
|
386 |
+ data: vm.user |
|
387 |
+ }).then( function (response) { |
|
388 |
+ // console.log("idCheck - response : ", response.data); |
|
389 |
+ if(response.data != null) { |
|
390 |
+ alert("중복된 ID 입니다."); |
|
391 |
+ vm.userIdCheck_boolean = false; |
|
392 |
+ return false; |
|
393 |
+ } else { |
|
394 |
+ alert("사용가능한 ID 입니다."); |
|
395 |
+ vm.userIdCheck_boolean = true; |
|
396 |
+ return true; |
|
397 |
+ } |
|
398 |
+ }).catch( function (error) { |
|
399 |
+ console.log("userIdCheck - error : ", error); |
|
400 |
+ alert("중복검사 오류, 다시 시도해주세요."); |
|
401 |
+ }); |
|
402 |
+ }, |
|
329 | 403 |
showDiv: function () { |
330 | 404 |
this.isVisible = true; |
331 | 405 |
}, |
... | ... | @@ -334,7 +408,15 @@ |
334 | 408 |
} |
335 | 409 |
}, |
336 | 410 |
watch: { |
337 |
- |
|
411 |
+ "email_id":function(){ |
|
412 |
+ this.user["user_eml"]=this.email_id+"@"+this.email_dns; |
|
413 |
+ }, |
|
414 |
+ "email_dns":function(){ |
|
415 |
+ this.user["user_eml"]=this.email_id+"@"+this.email_dns; |
|
416 |
+ }, |
|
417 |
+ "select_email_dns":function(){ |
|
418 |
+ this.user["user_eml"]=this.email_id+"@"+this.select_email_dns; |
|
419 |
+ }, |
|
338 | 420 |
}, |
339 | 421 |
computed: { |
340 | 422 |
|
--- package-lock.json
+++ package-lock.json
... | ... | @@ -1,5 +1,5 @@ |
1 | 1 |
{ |
2 |
- "name": "KERIS-1", |
|
2 |
+ "name": "KERIS", |
|
3 | 3 |
"lockfileVersion": 3, |
4 | 4 |
"requires": true, |
5 | 5 |
"packages": { |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?