From 2b63d8a3488f6090e110827644051dc9fa0df0ee Mon Sep 17 00:00:00 2001 From: le chien Date: Mon, 15 May 2023 19:59:00 +0700 Subject: [PATCH 01/44] update --- 1. Containerization/Le Van Chien/app/app.py | 30 +- .../Le Van Chien/app/data/attendees.json | 593 ++++++++++-------- .../Le Van Chien/nginx/static/index.html | 8 +- .../Le Van Chien/nginx/static/script.js | 170 ++++- .../Le Van Chien/nginx/static/stylesheet.css | 13 +- 5 files changed, 522 insertions(+), 292 deletions(-) diff --git a/1. Containerization/Le Van Chien/app/app.py b/1. Containerization/Le Van Chien/app/app.py index 5925fab06..ed2a0eaeb 100644 --- a/1. Containerization/Le Van Chien/app/app.py +++ b/1. Containerization/Le Van Chien/app/app.py @@ -1,11 +1,11 @@ -from flask import Flask +from flask import Flask, request from pymongo import MongoClient from flask_cors import CORS, cross_origin import json from bson import json_util app = Flask(__name__) -cors = CORS(app) +cors = CORS(app, resources={r'/people/*': {'origins': '*'}}) client = MongoClient('mongodb://db:27017') client.drop_database('attendee') @@ -21,8 +21,30 @@ def getAll(): return attendees @app.route('/people/', methods = ['GET']) -def get(num): - return json_util.dumps(db.attendees.find({"no": num})) +def getByID(num): + return json_util.dumps(db.attendees.find({"id": num})) + +@app.route('/people/', methods = ['GET']) +def getByUsername(username): + return json_util.dumps(db.attendees.find({"username": username})) + +@app.route('/people/delete/', methods = ['DELETE']) +def delete(username): + db.attendees.delete_one({'username': username}) + return json_util.dumps({'message': f'Resource with username {username} deleted'}) + + +@app.route('/people/create/', methods = ['PUT']) +def create(): + data = request.get_json() + db.attendees.insert_one(data) + return json_util.dumps({'message': 'Resource with username {} created'.format(data['username'])}) + +@app.route('/people/update/', methods = ['PUT']) +def update(username): + data = request.get_json() + db.attendees.update_one({'username':username}, data) + return json_util.dumps({'message': 'Resource with username {} updated'.format(username)}) if __name__ == '__main__': diff --git a/1. Containerization/Le Van Chien/app/data/attendees.json b/1. Containerization/Le Van Chien/app/data/attendees.json index 18e74e346..b562267d8 100644 --- a/1. Containerization/Le Van Chien/app/data/attendees.json +++ b/1. Containerization/Le Van Chien/app/data/attendees.json @@ -1,282 +1,317 @@ [ { - "no": 1, - "name": "Bùi Minh Sơn", - "yob": 2002, - "sex": "Nam", - "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", - "major": "Công nghệ thông tin" - }, - { - "no": 2, - "name": "Đào Đại Hiệp", - "yob": 2001, - "sex": "Nam", - "school": "Đại học Bách khoa Hà Nội", - "major": "Điện tử viễn thông" - }, - { - "no": 3, - "name": "Đỗ Anh Tú", - "yob": 2002, - "sex": "Nam", - "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", - "major": "Mạng máy tính và truyền thông dữ liệu" - }, - { - "no": 4, - "name": "Đỗ Bảo Hoàng", - "yob": 1997, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "An toàn thông tin" - }, - { - "no": 5, - "name": "Hoàng Quốc Doanh", - "yob": 2001, - "sex": "Nam", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "NULL" - }, - { - "no": 6, - "name": "Le Minh Duc", - "yob": 2002, - "sex": "Nam", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "Công nghệ thông tin ứng dụng phần mềm" - }, - { - "no": 7, - "name": "Lê Phúc Lai", - "yob": 2002, - "sex": "Nam", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "Kỹ thuật điện tử viễn thông" - }, - { - "no": 8, - "name": "Lê Quang Anh", - "yob": 1997, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "An toàn thông tin" - }, - { - "no": 9, - "name": "Lê Trọng Minh", - "yob": 2000, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "Kỹ thuật điều khiển và tự động hóa" - }, - { - "no": 10, - "name": "Lê Tùng Lâm", - "yob": 1999, - "sex": "Nam", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "Khoa học máy tính" - }, - { - "no": 11, - "name": "Lê Văn Chiến", - "yob": 2002, - "sex": "Nam", - "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", - "major": "Kỹ thuật hàng không vũ trụ" - }, - { - "no": 12, - "name": "Linh Thi Nguyen", - "yob": 2002, - "sex": "Nữ", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "ICT" - }, - { - "no": 13, - "name": "Nguyễn Đại An", - "yob": 2023, - "sex": "Nam", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "Khoa học máy tính" - }, - { - "no": 14, - "name": "Nguyễn Đình Hoàng", - "yob": 2002, - "sex": "Nam", - "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", - "major": "Công nghệ thông tin ứng dụng phần mềm" - }, - { - "no": 15, - "name": "Nguyen Duc Vinh Data", - "yob": 2002, - "sex": "Nam", - "school": "Học viện Công nghệ Bưu chính Viễn thông", - "major": "NULL" - }, - { - "no": 16, - "name": "Nguyễn Dương Long", - "yob": 2002, - "sex": "Nam", - "school": "ĐH Thuỷ lợi", - "major": "Công nghệ thông tin ứng dụng phần mềm" - }, - { - "no": 17, - "name": "Nguyen Huu Thang", - "yob": 2000, - "sex": "Nam", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "Khoa học máy tính" - }, - { - "no": 18, - "name": "Nguyễn Mạnh Cường", - "yob": 1997, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "Điện tử" - }, - { - "no": 19, - "name": "Nguyễn Mạnh Đức", - "yob": 2002, - "sex": "Nam", - "school": "Học viện Kỹ thuật mật mã", - "major": "An toàn thông tin" - }, - { - "no": 20, - "name": "Nguyễn Ngọc Chung", - "yob": 2002, - "sex": "Nam", - "school": "Học viên Công nghệ Bưu chính Viễn Thông HCM", - "major": "NULL" - }, - { - "no": 21, - "name": "Nguyễn Tuấn Anh", - "yob": 1997, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "An toàn thông tin" - }, - { - "no": 22, - "name": "Nguyễn Văn Quang", - "yob": 1997, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "An toàn thông tin" - }, - { - "no": 23, - "name": "Ninh Chí Hướng", - "yob": 2002, - "sex": "Nam", - "school": "Học viện Công nghệ Bưu chính viễn thông", - "major": "An toàn thông tin" - }, - { - "no": 24, - "name": "Ninh Văn Nghĩa", - "yob": 2001, - "sex": "Nam", - "school": "Đại Học Bách Khoa Hà Nội", - "major": "Khoa học máy tính" - }, - { - "no": 25, - "name": "Phạm Anh Đức", - "yob": 2001, - "sex": "Nam", - "school": "Đại học Bách Khoa Hà Nội", - "major": "Toán ứng dụng và tin học" - }, - { - "no": 26, - "name": "Phạm Duy Cương", - "yob": 1997, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "Công nghệ điện tử" - }, - { - "no": 27, - "name": "Phạm Hồng Thanh", - "yob": 1998, - "sex": "Nam", - "school": "Swinburne University", - "major": "Phát triển phần mềm" - }, - { - "no": 28, - "name": "Phạm Thị Khánh Linh", - "yob": 2002, - "sex": "Nữ", - "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", - "major": "Mạng máy tính và truyền thông dữ liệu" - }, - { - "no": 29, - "name": "Phạm Văn Tới", - "yob": 2002, - "sex": "Nam", - "school": "Học viện Công nghệ Bưu chính viễn thông", - "major": "Công nghệ thông tin ứng dụng phần mềm" - }, - { - "no": 30, - "name": "Trần Đức Mạnh", - "yob": 1998, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "Bảo mật thông tin" - }, - { - "no": 31, - "name": "Trần Mạnh Dũng", - "yob": 2001, - "sex": "Nam", - "school": "Học viện Công nghệ Bưu chính Viễn thông", - "major": "Điện tử viễn thông" - }, - { - "no": 32, - "name": "Trần Minh Dương", - "yob": 2002, - "sex": "Nam", - "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", - "major": "Mạng máy tính và truyền thông dữ liệu" - }, - { - "no": 33, - "name": "Trần Xuân Phú", - "yob": 2001, - "sex": "Nam", - "school": "Trường Đại học Công nghệ thông tin - ĐHQG Tp.Hồ chí Minh", - "major": "Khoa học máy tính" - }, - { - "no": 34, - "name": "Vũ Hoàng Long", - "yob": 2001, - "sex": "Nam", - "school": "Đại học Bách Khoa Hà Nội", - "major": "Khoa học máy tính" - }, - { - "no": 35, - "name": "Vũ Minh Hiếu", - "yob": 2000, - "sex": "Nam", - "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", - "major": "Kỹ thuật phần mềm" + "id": 1, + "name": "Bùi Minh Sơn", + "username": "sonbm", + "yob": 2002, + "sex": "Nam", + "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", + "major": "Công nghệ thông tin" + }, + { + "id": 2, + "name": "Đào Đại Hiệp", + "username": "hiepdd", + "yob": 2001, + "sex": "Nam", + "school": "Đại học Bách khoa Hà Nội", + "major": "Điện tử viễn thông" + }, + { + "id": 3, + "name": "Đỗ Anh Tú", + "username": "tuda", + "yob": 2002, + "sex": "Nam", + "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", + "major": "Mạng máy tính và truyền thông dữ liệu" + }, + { + "id": 4, + "name": "Đỗ Bảo Hoàng", + "username": "hoangdb", + "yob": 1997, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "An toàn thông tin" + }, + { + "id": 5, + "name": "Hoàng Quốc Doanh", + "username": "doanhhq", + "yob": 2001, + "sex": "Nam", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "NULL" + }, + { + "id": 6, + "name": "Le Minh Duc", + "username": "duclm", + "yob": 2002, + "sex": "Nam", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "Công nghệ thông tin ứng dụng phần mềm" + }, + { + "id": 7, + "name": "Lê Phúc Lai", + "username": "lailp", + "yob": 2002, + "sex": "Nam", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "Kỹ thuật điện tử viễn thông" + }, + { + "id": 8, + "name": "Lê Quang Anh", + "username": "anhlq", + "yob": 1997, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "An toàn thông tin" + }, + { + "id": 9, + "name": "Lê Trọng Minh", + "username": "minhlt", + "yob": 2000, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "Kỹ thuật điều khiển và tự động hóa" + }, + { + "id": 10, + "name": "Lê Tùng Lâm", + "username": "lamlt", + "yob": 1999, + "sex": "Nam", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "Khoa học máy tính" + }, + { + "id": 11, + "name": "Lê Văn Chiến", + "username": "chienlv", + "yob": 2002, + "sex": "Nam", + "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", + "major": "Kỹ thuật hàng không vũ trụ" + }, + { + "id": 12, + "name": "Nguyễn Thị Linh", + "username": "linhnt", + "yob": 2002, + "sex": "Nữ", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "ICT" + }, + { + "id": 13, + "name": "Nguyễn Đại An", + "username": "annd", + "yob": 2023, + "sex": "Nam", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "Khoa học máy tính" + }, + { + "id": 14, + "name": "Nguyễn Đình Hoàng", + "username": "hoangnd", + "yob": 2002, + "sex": "Nam", + "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", + "major": "Công nghệ thông tin ứng dụng phần mềm" + }, + { + "id": 15, + "name": "Nguyễn Đức Vinh", + "username": "vinhnd", + "yob": 2002, + "sex": "Nam", + "school": "Học viện Công nghệ Bưu chính Viễn thông", + "major": "NULL" + }, + { + "id": 16, + "name": "Nguyễn Dương Long", + "username": "longnd", + "yob": 2002, + "sex": "Nam", + "school": "ĐH Thuỷ lợi", + "major": "Công nghệ thông tin ứng dụng phần mềm" + }, + { + "id": 17, + "name": "Nguyễn Hữu Thắng", + "username": "thangnh", + "yob": 2000, + "sex": "Nam", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "Khoa học máy tính" + }, + { + "id": 18, + "name": "Nguyễn Mạnh Cường", + "username": "cuongnm", + "yob": 1997, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "Điện tử" + }, + { + "id": 19, + "name": "Nguyễn Mạnh Đức", + "username": "ducnm", + "yob": 2002, + "sex": "Nam", + "school": "Học viện Kỹ thuật mật mã", + "major": "An toàn thông tin" + }, + { + "id": 20, + "name": "Nguyễn Ngọc Chung", + "username": "chungnn", + "yob": 2002, + "sex": "Nam", + "school": "Học viên Công nghệ Bưu chính Viễn Thông HCM", + "major": "NULL" + }, + { + "id": 21, + "name": "Nguyễn Tuấn Anh", + "username": "anhnt", + "yob": 1997, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "An toàn thông tin" + }, + { + "id": 22, + "name": "Nguyễn Văn Quang", + "username": "quangnv", + "yob": 1997, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "An toàn thông tin" + }, + { + "id": 23, + "name": "Ninh Chí Hướng", + "username": "huongnc", + "yob": 2002, + "sex": "Nam", + "school": "Học viện Công nghệ Bưu chính viễn thông", + "major": "An toàn thông tin" + }, + { + "id": 24, + "name": "Ninh Văn Nghĩa", + "username": "nghianv", + "yob": 2001, + "sex": "Nam", + "school": "Đại Học Bách Khoa Hà Nội", + "major": "Khoa học máy tính" + }, + { + "id": 25, + "name": "Phạm Anh Đức", + "username": "ducpa", + "yob": 2001, + "sex": "Nam", + "school": "Đại học Bách Khoa Hà Nội", + "major": "Toán ứng dụng và tin học" + }, + { + "id": 26, + "name": "Phạm Duy Cương", + "username": "cuongpd", + "yob": 1997, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "Công nghệ điện tử" + }, + { + "id": 27, + "name": "Phạm Hồng Thanh", + "username": "thanhph", + "yob": 1998, + "sex": "Nam", + "school": "Swinburne University", + "major": "Phát triển phần mềm" + }, + { + "id": 28, + "name": "Phạm Thị Khánh Linh", + "username": "linhptk", + "yob": 2002, + "sex": "Nữ", + "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", + "major": "Mạng máy tính và truyền thông dữ liệu" + }, + { + "id": 29, + "name": "Phạm Văn Tới", + "username": "toipv", + "yob": 2002, + "sex": "Nam", + "school": "Học viện Công nghệ Bưu chính viễn thông", + "major": "Công nghệ thông tin ứng dụng phần mềm" + }, + { + "id": 30, + "name": "Trần Đức Mạnh", + "username": "manhtd", + "yob": 1998, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "Bảo mật thông tin" + }, + { + "id": 31, + "name": "Trần Mạnh Dũng", + "username": "dungtm", + "yob": 2001, + "sex": "Nam", + "school": "Học viện Công nghệ Bưu chính Viễn thông", + "major": "Điện tử viễn thông" + }, + { + "id": 32, + "name": "Trần Minh Dương", + "username": "duongtm", + "yob": 2002, + "sex": "Nam", + "school": "Đại học Công nghệ - Đại học Quốc gia Hà Nội", + "major": "Mạng máy tính và truyền thông dữ liệu" + }, + { + "id": 33, + "name": "Trần Xuân Phú", + "username": "phutx", + "yob": 2001, + "sex": "Nam", + "school": "Trường Đại học Công nghệ thông tin - ĐHQG Tp.Hồ chí Minh", + "major": "Khoa học máy tính" + }, + { + "id": 34, + "name": "Vũ Hoàng Long", + "username": "longvh", + "yob": 2001, + "sex": "Nam", + "school": "Đại học Bách Khoa Hà Nội", + "major": "Khoa học máy tính" + }, + { + "id": 35, + "name": "Vũ Minh Hiếu", + "username": "hieuvm", + "yob": 2000, + "sex": "Nam", + "school": "Đại học CNTT, cơ khí & quang học St.Petersburg LB Nga", + "major": "Kỹ thuật phần mềm" } -] \ No newline at end of file + ] \ No newline at end of file diff --git a/1. Containerization/Le Van Chien/nginx/static/index.html b/1. Containerization/Le Van Chien/nginx/static/index.html index e7a11b1f9..52f2dfe25 100644 --- a/1. Containerization/Le Van Chien/nginx/static/index.html +++ b/1. Containerization/Le Van Chien/nginx/static/index.html @@ -16,6 +16,7 @@

VDT Cloud Attendee

ID Họ và tên + Username Năm sinh Giới tính Trường @@ -23,7 +24,8 @@

VDT Cloud Attendee

- + + @@ -32,7 +34,9 @@

VDT Cloud Attendee

- +
+ +
\ No newline at end of file diff --git a/1. Containerization/Le Van Chien/nginx/static/script.js b/1. Containerization/Le Van Chien/nginx/static/script.js index 2c820a022..f70d5ce69 100644 --- a/1. Containerization/Le Van Chien/nginx/static/script.js +++ b/1. Containerization/Le Van Chien/nginx/static/script.js @@ -2,27 +2,185 @@ const searchBtn = document.querySelector('#search-btn'); searchBtn.onclick = function() { const id = document.querySelector('#id-input').value; + const username = document.querySelector('#username-input').value; - fetch('http://localhost:5000/people/' + id) - .then(response => response.json()) - .then(data => loadHTMLTable(data)); + if (username === "") { + fetch('http://localhost:5000/people/' + id) + .then(response => response.json()) + .then(data => loadHTMLTable(data)); + } + else { + fetch('http://localhost:5000/people/' + username) + .then(response => response.json()) + .then(data => loadHTMLTable(data)); + } } + +function sendDeleteRequest(username, btn) { + fetch('http://localhost:5000/people/delete/' + username, { + method: 'DELETE' + }) + .then(response => response.json()) + .then(result => { + console.log(result.message); + row = btn.parentNode.parentNode; + row.parentNode.removeChild(row); + }) + .catch(error => { + console.error(error); + // Handle errors + }); +} + +// Attach event listeners to the delete buttons +document.querySelector('table tbody').addEventListener('click', function(event) { + if (event.target.className === "delete-row-btn") { + sendDeleteRequest(event.target.dataset.user, event.target); + } + if (event.target.className === "cancel-btn") { + row = event.target.parentNode.parentNode; + row.parentNode.removeChild(row); + } + if (event.target.className === "submit-btn") { + addNewAttendee(event.target.parentNode.parentNode) + } + + if (event.target.className === 'edit-row-btn') { + getNewData(event.target.parentNode.parentNode, event.target.dataset.user) + } + + if (event.target.className === 'change-btn') { + change(event.target.parentNode.parentNode, event.target.dataset.user); + event.target.parentNode.innerHTML = ""; + } + +}); + + +// ADD + +addBtn = document.querySelector('#add-btn'); + +addBtn.onclick = function() { + const table = document.querySelector('table tbody'); + let tableHtml = ""; + tableHtml += ""; + tableHtml += ``; + tableHtml += ``; + tableHtml += ``; + tableHtml += ``; + tableHtml += ``; + tableHtml += ``; + tableHtml += ``; + tableHtml += ``; + tableHtml += ``; + tableHtml += ""; + + table.innerHTML += tableHtml; +} + + +function addNewAttendee(row) { + var id = row.querySelector('#new-id').value; + const newAttendee = { + id: row.querySelector('#new-id').value, + name: row.querySelector('#new-name').value, + username: row.querySelector('#new-username').value, + yob: row.querySelector('#new-yob').value, + sex: row.querySelector('#new-sex').value, + school: row.querySelector('#new-school').value, + major: row.querySelector('#new-major').value + }; + + + fetch('http://localhost:5000/people/create/', { + method: 'PUT', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify(newAttendee), + }) + .then(response => response.json()) + .then(result => { + console.log(result.message); + row.parentNode.removeChild(row); + }) +} + +// update //////////// + +function getNewData(row, username) { + const cells = row.querySelectorAll('td'); // Get all elements within the row + cells.forEach((cell, index) => { + const value = cell.textContent; + if (index == 0) { + cell.innerHTML = `