본문 바로가기
카테고리 없음

DB를 이용한 정적 웹 프로그래밍 (도서관리 시스템 만들기)

by SuldenLion 2023. 6. 27.
반응형

Local에서 Client로 파일(json)을 넘겨주어 Browser에 파일 내용을 띄워주는 프로그램을 만들어 보겠다.

 

Server 연결로 돌아가는 프로그램이 아니기 때문에 '도서현황보기' 버튼의 이벤트 수행 결과는 항상 같은 파일 내용이 나올 것이다. (정적 웹)

 

자바로 프로그램을 돌려 데이터베이스에서 값을 불러오고, 웹 상 출력을 위한 데이터 파일을 만든 뒤 웹으로 동작시키는 과정까지 정리해 보겠다.

 

프로그램의 목적은 특정 유저의 도서 현황을 웹 상에서 확인하는 것이다.

 

아래의 그림을 보면, 전체 도서목록에 대한 테이블, 전체 반납목록 테이블, 미반납목록 테이블, 반납 예정목록 테이블이 있고, 각 테이블은 도서번호, 도서명, 저자, 대출일자, 반납기한, 반납일자를 표시해준다.

 

첫 번째 테이블에는 각 목록의 수를 표시해주고, 그에 따른 대출 가능권수, 이용 상태, 대출 정지기간 등을 표시해줄 것이다.

 

 

 

 

 

 

sql 테이블 구축 + 몇 가지 값 세팅

drop table book_user;
create table book_user(
    user_seq integer unique auto_increment,
    user_id varchar(10) primary key,
    user_pass varchar(10) not null,
    user_phone_number varchar(20) not null,
    user_status char(2) default '00', -- 정상
    user_grade char(1) default '1',
    max_book integer(2) default 3,
    service_stop date null 
);

drop table book_info;
create table book_info(
    book_isbn varchar(12) primary key,
    book_title varchar(200) not null,
    book_author varchar(120) not null,
    book_published_date date not null
);

drop table book_copy;
create table book_copy(
    book_seq integer primary key auto_increment,
    book_position varchar(20) not null default 'BS-0001',
    book_status varchar(20) not null default 'BM-0001', -- 책의현재 상태 - 시간,폐기, 수선, 보관, etc
    book_isbn varchar(12),
    constraint foreign key (book_isbn) references book_info (book_isbn) on delete set null
);
drop table book_use_status;
create table book_use_status(
    book_seq integer not null,
    user_id varchar(10) not null,
    borrow_start datetime not null,
    borrow_end datetime not null,
    return_date datetime null,
    primary key(book_seq,user_id),
    constraint foreign key (book_seq) references book_copy (book_seq) on delete cascade,
    constraint foreign key (user_id) references book_user (user_id) on delete cascade
);

-- users
insert into book_user(user_id,user_pass,user_phone_number) values ('user1','1234','000-1111-2222');
insert into book_user(user_id,user_pass,user_phone_number) values ('user2','1234','000-3333-4444');

-- book1
insert into book_use_status(book_seq,user_id,borrow_start,borrow_end) values(3,'user1','2023-6-1','2023-6-14');
update book_user set max_book = max_book - 1 where user_id = 'user1';
update book_copy set book_position = 'BB-user1' where book_seq = 3;

-- book2
insert into book_use_status(book_seq,user_id,borrow_start,borrow_end) values(10,'user1','2023-6-5','2023-6-18');
update book_user set max_book = max_book - 1 where user_id = 'user1';
update book_copy set book_position = 'BB-user1' where book_seq = 10;

-- book3
insert into book_use_status(book_seq,user_id,borrow_start,borrow_end) values(16,'user1','2023-6-5','2023-6-18');
update book_user set max_book = max_book - 1 where user_id = 'user1';
update book_copy set book_position = 'BB-user1' where book_seq = 16;

-- book 3 return
update book_use_status set return_date = '2023-6-14' where user_id = 'user1' and book_seq = 16;
update book_user set max_book = max_book + 1 where user_id = 'user1';
update book_copy set book_position = 'BS-0001' where book_seq = 16;

 

 

 

//> main

public static void main(String[] args) {
    Solution solution = new Solution();
    solution.getUserInfo("user1");
}

현재 main을 감싸고 있는 클래스는 Solution이고 프로그램을 실행하면 user1에 대한 정보부터 가져올 것이다.

LibraryBookService lbs;
	
public Solution() {
    lbs = new LibraryBookService();
}

Solution 생성시 서비스를 위한 lbs 객체를 생성해준다.

 

 

//> getUserInfo 

public void getUserInfo(String userId) {
    HashMap<String, Object> data = lbs.getUserStatus(userId, "6"); 
    HashMap<String,UserBookStatusVO> map1 = (HashMap<String,UserBookStatusVO>)data.get("userInfo");
    HashMap<String,ArrayList<BookUseStatusVO>>  map2 = (HashMap<String,ArrayList<BookUseStatusVO>>)data.get("bookInfo");

    UserBookStatusVO status = map1.get("user");
    ArrayList<BookUseStatusVO> list = map2.get("total");
    ArrayList<BookUseStatusVO> allReturned = map2.get("allReturned");
    ArrayList<BookUseStatusVO> notReturned = map2.get("notReturned");
    ArrayList<BookUseStatusVO> expectingReturn = map2.get("expectingReturn");

    JSONObject json = new JSONObject();
    JSONObject info = new JSONObject();
    JSONObject user = new JSONObject();
    JSONObject book = new JSONObject();

    JSONArray array1 = new JSONArray();
    JSONArray array2 = new JSONArray();
    JSONArray array3 = new JSONArray(); 
    JSONArray array4 = new JSONArray();

    JSONArray array5 = new JSONArray();
    array5.add(status);

    user.put("user", array5);

    for(BookUseStatusVO vo : list) {
        array1.add(vo);
    }
    book.put("list", array1);

    for(BookUseStatusVO vo : allReturned) {
        array2.add(vo);
    }
    book.put("returned", array2);

    for(BookUseStatusVO vo : notReturned) {
        array3.add(vo);
    }
    book.put("notReturned", array3);

    for(BookUseStatusVO vo : expectingReturn) {
        array4.add(vo);
        //System.out.println(vo);
    }
    book.put("expectingReturn", array4);


    info.put("userInfo", user);
    info.put("bookInfo", book);

    json.put("data", info);

    System.out.println(json.toJSONString());
    //JSON형태로 변환한뒤에 파일로 저장
    try {
        this.saveUserInfo(userId,json.toJSONString());
    } catch (IOException e) {
        e.printStackTrace();
    }
}

 

넘겨받은 유저 정보 user1에 대한 LibraryBookService lbs의 getUserStatus를 실행하여 startMonth가 6월인 유저 상태 정보들을 HashMap 형태로 받아올 것이다.

 

 

//> getUserStatus

public HashMap<String, Object> getUserStatus(String userId,String startMonth){
		HashMap<String, Object> result = null;
		result = new HashMap<String, Object>();
		
		UserVO user = null;
		ArrayList<BookUseStatusVO> list = null;
	
		try {			
			list = dao.selectBookInfoByUser(userId, startMonth);
		} catch (SQLException e) {
			e.printStackTrace();
		}
		
		Calendar criteriaDate = Calendar.getInstance();
		criteriaDate.set(2023, 5, 16);
		ArrayList<BookUseStatusVO> allReturned = this.getReturnedBooks(list); 
		ArrayList<BookUseStatusVO> notReturned = this.getNotReturnedBooks(list, criteriaDate);
		ArrayList<BookUseStatusVO> expectingReturn = this.getExpectingReturnBooks(list,criteriaDate);
		
		try {
			user = dao.selectUser(userId);
		} catch (SQLException e) {
			e.printStackTrace();
		}
		
		HashMap<String, ArrayList<BookUseStatusVO>> bookInfo = new HashMap<>();
		bookInfo.put("total", list);
		bookInfo.put("allReturned", allReturned);
		bookInfo.put("notReturned", notReturned);
		bookInfo.put("expectingReturn", expectingReturn);
		
		UserBookStatusVO userState = new UserBookStatusVO();
		userState.setUserId(userId);
		userState.setAvailableBook(user.getAvailableBook());
		userState.setExpectingReturnBook(expectingReturn.size());
		userState.setTotalUsingBook(list.size());
		userState.setReturnedBook(allReturned.size());
		userState.setNotReturnedBook(notReturned.size());
		

		if(notReturned.size()>0) {
			userState.setUserState("대출정지");
			userState.setStopDate(DateCalculation.getDate(user.getServiceStop()));
		} else {
			userState.setUserState("정상");
			userState.setStopDate("-");
		}
		HashMap<String, UserBookStatusVO> userInfo = new HashMap<>();
		
		userInfo.put("user", userState);
		result.put("userInfo", userInfo);
		result.put("bookInfo", bookInfo);
		
		return result;
	}

 

반환을 위한 HashMap<String, Object> 객체 result를 선언해주고

유저 정보를 선택해서 사용하기 위한 UserVO 객체 user와 BookUseStatusVO를 담을 list를 선언한다.

list에는 LibraryDAO의 selectBookInfoByUser의 결과값들을 담아준다

 

 

//> selectBookInfoByUser 코드

public ArrayList<BookUseStatusVO> selectBookInfoByUser(String userId,String startMonth) throws SQLException {
    ArrayList<BookUseStatusVO> list = null;
    list = new ArrayList<BookUseStatusVO>();
    StringBuilder sb = new StringBuilder("select i.book_isbn,i.book_title,i.book_author,s.* ");
    sb.append("from book_copy c  inner join (book_info i) on c.book_isbn = i.book_isbn ");
    sb.append("inner join book_use_status s on s.book_seq = c.book_seq ");
    sb.append("where s.user_id = ? and s.borrow_start between '2023-6-1' and '2023-6-30'");
    String sql = sb.toString();
    Connection con = manager.getConnection();
    PreparedStatement pstmt = con.prepareStatement(sql);
    pstmt.setString(1, userId);
    ResultSet rs = pstmt.executeQuery();
    BookUseStatusVO vo = null;
    while(rs.next()) {
        vo = new BookUseStatusVO(rs.getInt(4), rs.getString(5), rs.getTimestamp(6), rs.getTimestamp(7), rs.getTimestamp(8));
        vo.setBookIsbn(rs.getString(1));
        vo.setBookTitle(rs.getString(2));
        vo.setBookAuthor(rs.getString(3));
        list.add(vo);
    }

    manager.closeConnection(rs, pstmt, con);

    return list;
}

 

쿼리  설명)

- book_info 테이블의 column들과(book_isbn, book_title, book_author) book_use_status 테이블의 모든 column을 선택할 것이다.

- 데이터를 가져올 기본 테이블은 book_copy로 지정하고 c 라고 aliasing 한다.

- book_copy와 book_info 테이블을 book_isbn 열을 기준으로 inner join 한다. 두 테이블의 book_isbn이 일치하는 행들을 연결한다.

- book_copy와 book_use_status 테이블의 book_seq 열을 기준으로 inner join 한다. book_seq가 일치하면 연결한다.

- 이는 검색 조건이다. user_id가 들어오는 값과 일치하며, 빌린 날짜가 2023-6-1 부터 2023-6-30 까지인 경우의 조건이다.

 

쿼리문을 실행하고 BookUseStatusVO 값들을 list에 담아 반환해준다.

 

 

받아왔으면 서비스로 돌아가서 다음 작업을 진행한다.

기준 날짜를 보여줄 Calendar 객체를 getInstance로 생성한다. (new 키워드로 생성할 수 없다)

날짜를 세팅해주고 (2023, 5, 16)

전체 반납 목록, 미반납된 목록, 반납 예정 목록을 담을 ArrayList<BookUseStatusVO>를 현재 Service 클래스에서 호출해서 받아온다.

 

 

//> getReturnedBooks 

private ArrayList<BookUseStatusVO> getReturnedBooks(ArrayList<BookUseStatusVO> bookList){
    ArrayList<BookUseStatusVO> result = null;
    //기반납도서
    result = new ArrayList<BookUseStatusVO>();
    for(BookUseStatusVO book : bookList) {
        if(book.getReturnDate()!=null&&book.getBorrowEnd().getTime() >= book.getReturnDate().getTime()) {
            result.add(book);
        }
    }
    return result;
}

parameter로 넘어온 선택된 book 리스트 내용안에서 반납 일자가 null이 아니면서 반납 기한이, 반납 일자보다 큰 경우 (이후의 날짜인 경우) result 리스트에 담아 리턴한다.

 

 

//> getNotReturnedBooks

// 이용상태 대출정지기간의 정보를 정리
private ArrayList<BookUseStatusVO> getNotReturnedBooks(ArrayList<BookUseStatusVO> bookList, Calendar criteriaDate){
    ArrayList<BookUseStatusVO> result = null;
    result = new ArrayList<BookUseStatusVO>();
    Timestamp stopServiceDate = null;
    //미반납도서 - 반납기간이 지나고 반납날짜가 비어있는 도서
    String userId = null;
    for(BookUseStatusVO book : bookList) {
        if( book.getBorrowEnd().getTime() <  criteriaDate.getTimeInMillis()&&book.getReturnDate()==null) {
            userId = book.getUserId();
            result.add(book);
            //System.out.println(book);
            Timestamp temp = DateCalculation.calcuStopDate(new Timestamp(criteriaDate.getTimeInMillis()), book.getBorrowEnd());
            if(stopServiceDate!=null) {
                stopServiceDate = temp.getTime()-stopServiceDate.getTime()>0?temp:stopServiceDate;
            } else {
                stopServiceDate = temp;
            }
        }
    }

    if(stopServiceDate!=null) {
        //DB user 정보 update
        try {
            dao.updateUserStopStatus(userId, stopServiceDate);
        } catch (SQLException e) {
            e.printStackTrace();
        }
    }

    return result;
}

선택된 book 리스트와 기준 날짜 criteriaDate를 넘겨주고 리턴할 리스트와 Timestamp 객체를 만들어준다.

(Timestamp 쓰는 이유로는 Timestamp가 Date 객체보다 더 정교한 듯 하다)

전체 book 리스트를 돌면서 현재 인덱스의 책 반납일자가 기준일자보다 작을때 (getTimeInMillis()는 Calendar 객체를 long형으로 바꾸어주는듯) + 반납일자가 비어있을 때 logic을 시행한다.

책으로부터 userId를 받아오고 result에 현재 책을 add 해준다.

그리고 반납일자 계산을 위한 임시 Timestamp 객체를 만들어준다. 

DateCalculation 클래스로 가서 계산해온다.

 

 

//> DateCalculation 클래스의 calcuStopDate

//기준일_반납일자에 대하여 정지기간을 계산
public static Timestamp calcuStopDate(Timestamp returnDate, Timestamp endDate) {

    int differ = getDiffDays(endDate, returnDate);
    return getEndnDate(returnDate, differ);
}

해당 클래스의 getDiffDays로 일자 차이를 정수형으로 구해온다.

 

 

//> getDiffDays

private static int getDiffDays(Timestamp before, Timestamp after) {
    Calendar c1 = Calendar.getInstance();
    c1.setTimeInMillis(before.getTime());
    Calendar c2 = Calendar.getInstance();
    c2.setTimeInMillis(after.getTime());
    int result = c2.get(Calendar.DAY_OF_YEAR) - c1.get(Calendar.DAY_OF_YEAR);

    return result;
}

각 Timestamp 값들을 getTime()을 통해 Calendar 객체로 넣어줄 수 있게 만들고, 각 Calendar 객체에 세팅해준다.

각 객체에서 get() 함수 사용 후 DAY_OF_YEAR값을 알아온 후 둘을 빼주면 차이를 알수있다.

구해온 값과 기준 일자로 해당 클래스 내의 getEndnDate를 실행하며 여기서 가져온 Timestamp 값을 최종적으로 리턴해 줄 것이다.

 

 

//> getEndnDate

public static Timestamp getEndnDate(Timestamp startDate, int day) {		
    Calendar c1 = Calendar.getInstance();
    c1.setTimeInMillis(startDate.getTime());
    c1.add(Calendar.DATE, day);
    return new Timestamp(c1.getTimeInMillis());
}

기준시간을 Calendar 객체로 세팅해주고 넘어온 day만큼 더해준다.

해당 Calendar를 다시 Timestamp로 생성시켜서 리턴해준다.

 

서비스의 getNotReturnedBooks로 돌아와서,

대출 정지기간이 null인 경우 구해온 temp 값을 stopServiceDate에 넣어주고, null이 아니라면 temp의 시간이  대출 정지기간보다 큰 경우 temp를 stopServiceDate로, 아닌경우 대출 정지기간은 그대로 간다.

전체 book 리스트를 다 읽고 stopServiceDate가 null이 아닌 경우에 LibraryDAO에서 updateUserStopStatus를 userId와 stopServiceDate를 넘겨주며 실행시킴

 

 

//> updateUserStopStatus 

public boolean updateUserStopStatus(String userId, Timestamp stopDate) throws SQLException {
    boolean flag = false;
    String sql = "update book_user set user_status= ?, service_stop = ? where user_id = ?";
    try {
        Connection con = manager.getConnection();
        PreparedStatement pstmt = con.prepareStatement(sql);
        pstmt.setString(1, "01");
        pstmt.setTimestamp(2, stopDate);
        pstmt.setString(3, userId);
        int affectedCount = pstmt.executeUpdate();
        if(affectedCount>0) {
            flag = true;
            //System.out.println("success");
        }
        manager.closeConnection(null, pstmt, con);
    } catch (SQLException se) {
        se.printStackTrace();
    }
    return flag;
}

 

쿼리 설명

- book_user 테이블의 user_status, service_stop을 user_id가 일치한다면 갱신해줄것이다.

 

getUserStatus로 돌아와서 반납예정책 리스트를 getExpectingReturnBooks로 구한다.

 

 

//> getExpectingReturnBooks

private ArrayList<BookUseStatusVO> getExpectingReturnBooks(ArrayList<BookUseStatusVO> bookList, Calendar criteriaDate){
    ArrayList<BookUseStatusVO> result = null;
    //반납예정도서
    result = new ArrayList<BookUseStatusVO>();
    for(BookUseStatusVO book : bookList) {
        if(book.getReturnDate()==null&&book.getBorrowEnd().getTime() >= criteriaDate.getTimeInMillis()) {
            result.add(book);
            //System.out.println(book);
        }
    }
    return result;
}

 

book 리스트를 돌면서 책의 반납일자가 null인 것 + 반납 기한이 기준일자보다 큰 경우 리스트에 book을 add하여 해당 리스트를 리턴한다.

원하는 리스트들은 불러왔고 user에 넘어온 ID를 가지고 dao에서 user를 선택하게 하겠다.

 

 

//> LibraryDAO의 selectUser 코드

public UserVO selectUser(String userId) throws SQLException {
    UserVO user = null;
    String sql = "select user_status,max_book,service_stop from book_user where user_id = ?";
    Connection con = manager.getConnection();
    PreparedStatement pstmt = con.prepareStatement(sql);
    pstmt.setString(1, userId);
    ResultSet rs = pstmt.executeQuery();
    while(rs.next()) {
        user = new UserVO();
        user.setUserId(userId);
        user.setUserState(rs.getString(1));
        user.setAvailableBook(rs.getInt(2));
        user.setServiceStop(rs.getTimestamp(3));
    }

    manager.closeConnection(rs, pstmt, con);
    return user;
}

 

쿼리 설명 - book_user 테이블의 user_status, max_book, service_stop을 user_id가 일치하면 select 한다.

ResultSet에 값이 있을때 UserVO를 만들어 세팅해주고 리턴한다.

 

다시 서비스로 돌아오겠다.

String과 책 사용 상태 리스트를 Key, Value값으로 가지는 HashMap bookInfo를 만들어주고, 여기에 total에 해당하는 list, allReturned에 해당하는 allReturned 리스트, notReturned에 해당하는 notReturned 리스트, expectingReturn에 해당하는 expectingReturn 리스트를 put 해준다. ( 웹에서 쓸 JSON 파일을 만들기 위한 작업 )

 

UserBookStatusVO 객체 userState를 하나 만들고 ID, 대출가능권수, 반납예정도서수, 전체대출도서수, 반납도서수, 미반납도서수를 세팅해주고 미반납 리스트 사이즈가 0보다 크면, userState의 상태를 "대출정지"로 바꾸고 stopDate도 Timestamp로 세팅해준다. notReturned가 비어있을때는 "정상" / "-" 으로 세팅해준다.

 

해쉬맵 userInfo를 만들어 user/userState 라는 key/value를 넣어주고, 해쉬맵 result에 만든 userInfo와 bookInfo를 각각 넣고 return 해준다.

 

다시 Solution으로 와서 HashMap data에 위 정보들이 담긴다.

HashMap 객체 map1, map2를 두고 각각 userInfo와 bookInfo를 두고

UserBookStatusVO를 하나 만드는데 map1에서 user라는 키에 해당하는 것을 뽑아와서 만든다.

마찬가지로 map2에서 total / allReturned / notReturned / expectingReturn에 해당하는 값들을 뽑아와서 리스트형태로 만든다.

json과 info, user, book을 위한 각각의 JSONObject를 만들고, 목록을 담을 JSONArray를 만들어준다.

data 내부에 userInfo와 bookInfo가 담길 것이고, bookInfo는 expectingReturn / list / returned / notReturned가 담긴다. status는 userInfo에 담긴다.

위와 같은 구조로 json파일에 내용을 담는다.

 

 

//> json 파일 코드

{
    "data": {
        "bookInfo": {
            "expectingReturn": [
                {
                    "bookSeq": "10",
                    "bookIsbn": "PM0000037912",
                    "bookTitle": "How to drink soju effectively",
                    "bookAuthor": "SuldenLion",
                    "userId": "user1",
                    "borrowStart": "2023-06-05",
                    "borrowEnd": "2023-06-18",
                    "returnDate": "-"
                }
            ],
            "list": [
                {
                    "bookSeq": "3",
                    "bookIsbn": "PM0000037905",
                    "bookTitle": "How to be a great java programmer",
                    "bookAuthor": "SuldenTiger",
                    "userId": "user1",
                    "borrowStart": "2023-06-01",
                    "borrowEnd": "2023-06-14",
                    "returnDate": "-"
                },
                {
                    "bookSeq": "10",
                    "bookIsbn": "PM0000037912",
                    "bookTitle": "How to drink soju effectively",
                    "bookAuthor": "SuldenLion",
                    "userId": "user1",
                    "borrowStart": "2023-06-05",
                    "borrowEnd": "2023-06-18",
                    "returnDate": "-"
                },
                {
                    "bookSeq": "16",
                    "bookIsbn": "PM0000037918",
                    "bookTitle": "The greatest football player : SuldenLion",
                    "bookAuthor": "SuldenLion",
                    "userId": "user1",
                    "borrowStart": "2023-06-05",
                    "borrowEnd": "2023-06-18",
                    "returnDate": "2023-06-14"
                }
            ],
            "returned": [
                {
                    "bookSeq": "16",
                    "bookIsbn": "PM0000037918",
                    "bookTitle": "The greatest football player : SuldenLion",
                    "bookAuthor": "SuldenLion",
                    "userId": "user1",
                    "borrowStart": "2023-06-05",
                    "borrowEnd": "2023-06-18",
                    "returnDate": "2023-06-14"
                }
            ],
            "notReturned": [
                {
                    "bookSeq": "3",
                    "bookIsbn": "PM0000037905",
                    "bookTitle": "How to drink soju effectively",
                    "bookAuthor": "SuldenLion",
                    "userId": "user1",
                    "borrowStart": "2023-06-01",
                    "borrowEnd": "2023-06-14",
                    "returnDate": "-"
                }
            ]
        },
        "userInfo": {
            "user": [
                {
                    "userId": "user1",
                    "userState": "대출정지",
                    "stopDate": "2023-06-18",
                    "totalUsingBook": "3",
                    "returnedBook": "1",
                    "notReturnedBook": "1",
                    "expectingReturnBook": "1",
                    "availableBook": "1"
                }
            ]
        }
    }
}

File로 만들기 위해 json(JSONObject)파일을 String화하여 userId와 함께 saveUserInfo() 메서드를 호출하는 인자로 넘긴다.

File과 FileWriter, PrintWriter를 통해 원하는 경로명에 json파일을 만들어준다.

자바에서의 프로세스는 끝났고 웹을 실행시키기 위해 html 화면을 띄운다.

 

 

//> library_front.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Book Service</title>
    <style>
        table, td {
            border : 1px solid black;
            border-collapse: collapse;
            position: relative;
            margin: 10px 150px;
        }

        td {
            width : 100px;
            height: 40px;
            text-align: center;
        }
        td.book_title {
            width: 200px;
        }
        span {
            margin-left: 150px;
        }
        div {
            margin-bottom: 20px;
        }
    </style>
    <script src="https://code.jquery.com/jquery-latest.min.js"></script>
   <script>
        $(document).ready(function(){
            $('#list').on('click',function(){
                console.log('work');
                $.get('user1.json',function(data){

                 // let json = (JSON.stringify(data));
                  user_data = data.data.userInfo;

                  $('#user_status').html(' <tr><td>대출도서</td><td>반납도서</td><td>미반납도서</td><td>반납예정도서</td><td>대출가능권수</td><td>이용상태</td><td>대출정지기간</td></tr>');
                  $('#total').html('<tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>');
                  $('#returned').html('<tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>');
                  $('#not_returned').html('<tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>');
                  $('#expecting_return').html('<tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>');
             
                  let user = user_data.user[0];

                  let userStatus = `<tr><td>${user.totalUsingBook}</td><td>${user.returnedBook}</td><td>${user.notReturnedBook}</td>
                    <td>${user.expectingReturnBook}</td><td>${user.availableBook}</td><td>${user.userState}</td><td>${user.stopDate}</td></tr>`;
                  $('#user_status').html($('#user_status').html()+userStatus);  
                
                  let book_data = data.data.bookInfo;
                  
                  let expectingList = book_data.expectingReturn;

                  let list = book_data.list;
                  let returnedList = book_data.returned;
                  let notReturnedList = book_data.notReturned;
                  
                 
                  for(let book of list ){
                    let temp1 = `<tr><td>${book.bookIsbn}</td><td>${book.bookTitle}</td><td>${book.bookAuthor}</td>
                        <td>${book.borrowStart}</td><td>${book.borrowEnd}</td><td>${book.returnDate}</td></tr>`;
                    $('#total').html($('#total').html()+temp1);  
                  }

                  for(let book of returnedList ){
                    let temp1 = `<tr><td>${book.bookIsbn}</td><td>${book.bookTitle}</td><td>${book.bookAuthor}</td>
                        <td>${book.borrowStart}</td><td>${book.borrowEnd}</td><td>${book.returnDate}</td></tr>`;
                    $('#returned').html($('#returned').html()+temp1);  
                  }

                  for(let book of notReturnedList ){
                    let temp1 = `<tr><td>${book.bookIsbn}</td><td>${book.bookTitle}</td><td>${book.bookAuthor}</td>
                        <td>${book.borrowStart}</td><td>${book.borrowEnd}</td><td>${book.returnDate}</td></tr>`;
                    $('#not_returned').html($('#not_returned').html()+temp1);  
                  }

                  for(let book of expectingList ){
                    let temp1 = `<tr><td>${book.bookIsbn}</td><td>${book.bookTitle}</td><td>${book.bookAuthor}</td>
                        <td>${book.borrowStart}</td><td>${book.borrowEnd}</td><td>${book.returnDate}</td></tr>`;
                    $('#expecting_return').html($('#expecting_return').html()+temp1);  
                  }
                });
            });  
                console.log('end work');
        });
   </script>
<body>
    <span><button id="list">user1 도서현황보기</button></span>
    <div id="container">
    <div>
        <table id="user_status">
        <tr><td>대출도서</td><td>반납도서</td><td>미반납도서</td><td>반납예정도서</td><td>대출가능권수</td><td>이용상태</td><td>대출정지기간</td></tr>
        
    </table>
    </div>
    <br>
    <div>
        <span>전체도서목록</span>
        <table id="total">
            <tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>
        </table>
    </div>

    <div>
        <span>전체반납목록</span>
        <table id="returned">
            <tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>
        </table>
    </div>
    <div>
        <span>미반납목록</span>
        <table id="not_returned">
            <tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>
        </table>
    </div>
    <div>
        <span>반납예정목록</span>
        <table id="expecting_return">
            <tr><td>도서번호</td><td class="book_title">도서명</td><td>저자</td><td>대출일자</td><td>반납기한</td><td>반납일자</td></tr>
        </table>
    </div>
</div>

</body>
</html>

 

VSCode로 라이브 서버를 켜주고 실행하면 게시글 맨 위의 화면을 볼 수 있다.

 

 

 

 

-----------------------------------------------------------------------------------------------------------------------------------------------------------------

위의 프로그램은 임의 값 몇개로 한 것이고

csv파일 내용으로 db에 값 박아넣어 시행해보겠다.

(csv 인코딩 터지는거 설정도 안보이고 시간 많이 먹음)

 

 

book_info.csv

(한글로 된 파일로 하다가 인코딩이 이곳 저곳에서 깨져서 영문으로 된 파일로 바꿈)

 

Workbench에서 스키마 생성 후 테이블에 csv 파일을 import 한다.

 

 

 

테이블 생성시 외래키 제약조건에 의해 book_info -> book_copy 순으로 생성

 

 

book_info 테이블 내용

 

 

마찬가지로 book_copy의 내용을 준비해주고 테이블에 넣어준다.

book_copy 테이블 내용

 

 

위 내용들을 이용하여 (6월 하드코딩된거 확인을 위해 대출일자/반납기한 바꾸는 쿼리 사용했음 - 게시글 상단의 `sql 테이블 구축 + 몇 가지 값 세팅` 참고) json1_1.json을 만든 후 돌려보면 아래와 같은것을 확인할 수 있음.

(내용은 같다)

 

json1_1.json 파일 사용 결과 화면

 

 

 

내용은 이걸로 끝이고 전체 소스코드는 아래에 두겠다.

https://github.com/jungwu2503/BitProject/tree/main/SimpleComplete/SimpleLibrarySample

 

GitHub - jungwu2503/BitProject

Contribute to jungwu2503/BitProject development by creating an account on GitHub.

github.com

 

 

 

+ json을 읽을때 파싱 오류

json 파싱하는 중에 생긴 error. 넘어오는 문자열이 똑바로된 json 형태가 아닐때 발생하는데, value값 내부에 " 같은 기호가 포함되어있을때 생기는 듯하다.

 

반응형

댓글