soso

26. 상세 페이지 -상세 페이지 백엔드 : #54 조회 * Seller_One.vue 생성 * Seller_One.vue 등록(index.js) * 상세 페이지 이므로 App.vue에는 등록하지 않는다. import { createWebHistory, createRouter } from "vue-router"; 더보기 import Home from '@/components/Home' import Join from '@/components/Join' import Login from '@/components/Login' import Mypage from '@/components/Mypage' import Seller_insert from '@/components/Seller_insert' import Se..

26. 목록 -목록 백엔드 : #54 조회 * Seller_list.vue 생성 * Seller_list.vue 등록(index.js) import Seller_list from '@/components/Seller_list' const routes = [ 더보기 {path:'/', name:'Home', component:Home}, {path:'/Join', name:'Join', component:Join}, {path:'/Login', name:'Login', component:Login}, {path:'/Mypage', name:'Mypage', component:Mypage}, {path:'/Seller_insert', name:'Seller_insert', component:Seller_in..

25. 일괄 추가 -일괄 추가 백엔드 : #48~#51 일괄 추가 * Seller_insert.vue 생성 * Seller_insert.vue 등록(App.vue) import Seller_insert from '@/components/Seller_insert' const routes = [ {path:'/', name:'Home', component:Home}, {path:'/Join', name:'Join', component:Join}, {path:'/Login', name:'Login', component:Login}, {path:'/Mypage', name:'Mypage', component:Mypage}, {path:'/Seller_insert', name:'Seller_insert', com..

24. 비밀번호 변경 -비밀번호 변경 백엔드 : #47 비밀번호 변경 *mypage 생성 *mypage 등록(index.js) ... ... import Mypage from '@/components/Mypage' const routes = [ {path:'/', name:'Home', component:Home}, {path:'/Join', name:'Join', component:Join}, {path:'/Login', name:'Login', component:Login}, {path:'/Mypage', name:'Mypage', component:Mypage}, ] ... ... *mypage 등록(App.vue) Home| Join| Login| Mypage| *화면 확인 *비밀번호 변경 화면 ..

23. 로그인 -로그인 백엔드 : #46 로그인 *로그인 화면 구성(Login.vue) 로그인 아이디 암호 *화면 확인 *로그인 버튼 클릭 시 이벤트 구성(Loginb.vue) *console.log(response); 를 이용해 전달값 확인 import axios from 'axios' export default { methods:{ async handleLogin(){ const url = "/REST/api/member/login"; const headers = {"Content-Type":"application/json"}; const body = { email : this.email, passwd : this.passwd, } const response = await axios.post(url,..

22. 회원가입 -회원 가입 백엔드 : #45 회원가입 * axios 설치(cmd) *회원가입 회면 구성(Join.vue) 회원 가입 이메일 암호 암호 확인 이름 고객 판매자 관리자 *회면 확인 *회원가입 버튼 클릭 시 이벤트 구성(Join.vue) *console.log(response); 를 이용해 버튼 클릭 후 전달값 확인한다. import axios from 'axios' export default { methods:{ async handleJoin(){ const url = "/REST/api/member/join"; const headers = {"Content-Type":"application/json"} const body = { email : this.email, passwd : this..

21. Spring 연동 #10 참조 -폴더 생성 -설정하기(백엔드 연동) *vue.config.js 생성(vue20211005) module.exports= { //개발 서버 설정 devServer: { //프록시 설정 proxy: { //127.0.0.1:8080/REST/api '/REST/api':{ //프록시 요청을 보낸 서버의 주소 target: 'http://localhost:8080', changeOrigin: true, logLevel: 'debug', } }, //vue의 포트 번호 //127.0.0.1:9090 port: 9090 } }; -vue 생성, 라우터 설치 *vue 생성(join, login) *라우터 설치(cmd) * npm install vue-router@next --..

20. 비밀번호 변경 백엔드 참고#39 -비밀번호 변경 *비밀번호 변경 화면 구면(Menu7.vue) ... ... 비밀번호 변경 아이디 기존 암호 새 암호 ... ... *화면 확인 *비밀번호 변경 구현(Menu7.vue) *토큰을 받아온 뒤 구현이 가능하도록 조건문을 삽입하고 토큰이 없는 경우 로그인 페이지로 이동한다. *백엔드에서 만든 member_password를 사용한다. *토큰을 받아와야 하므로 token을 data에 등록한다. ... ... async handleNewpw(){ const key = "123456_" const url = "/ROOT/api/member_password"; const headers = {"Content-Type":"application/json", token ..

19. 정보 수정 백엔드 내용#37 -정보 수정 *manu7 생성(Menu7.vue) *정보 수정 화면 구성(Menu7.vue) ... ... 회원 정보 변경 아이디 이름 연락처 ... ... *menu7 등록(index.js) ... ... import Menu7 from '@/components/Menu7' ... ... { path:'/menu7', name:"Menu7", component:Menu7 }, ... ... *화면 확인 *정보 수정 구현(Menu7.vue) *토큰을 받아온 뒤 구현이 가능하도록 조건문을 삽입하고 토큰이 없는 경우 로그인 페이지로 이동한다. *백엔드에서 만든 member_update를 사용한다. *토큰을 받아와야 하므로 token을 data에 등록한다. import ax..

18. 로그인(spring #34, #35 연동) -로그인 *menu5 생성(Menu5.vue) *로그인 페이지 구현 **백엔드(member_select)에서@RequestBody 를 사용하여 정보를 전달했으므로 json( const headers = {"Content-Type":"application/json"};)를 사용해 정보를 출력한다. 로그인 아이디 암호 import axios from 'axios'; export default { methods:{ async handleLogin(){ const url = "/ROOT/api/member_select" ; const headers = {"Content-Type":"application/json"}; const body = { userid : t..