- Trang Chủ
- Công nghệ thông tin
- Tóm tắt Đồ án tốt nghiệp Công nghệ thông tin: Xây dựng website hỗ trợ tìm kiếm giấy tờ thất lạc sử dụng Framework Vue.JS
Xem mẫu
- TRƯỜNG CAO ĐẲNG CÔNG NGHỆ THÔNG TIN
HỮU NGHỊ VIỆT - HÀN
KHOA CÔNG NGHỆ THÔNG TIN
XÂY DỰNG WEBSITE HỖ TRỢ TÌM KIẾM GIẤY
TỜ THẤT LẠC SỬ DỤNG FRAMEWORK VUE.JS
TÓM TẮT ĐỒ ÁN TỐT NGHIỆP
NGÀNH: CÔNG NGHỆ THÔNG TIN
NIÊN KHÓA: 2016 - 2019
HSSV : Lê Văn Tấn Lin
Mã HSSV : CCCT16B010
CBHD : TS. Lê Tân
Đà Nẵng, 06/2019
- MỞ ĐẦU
Nếu như một ngày bất cẩn, bạn làm mất đi một loại giấy tờ tùy
thân quan trọng của mình ví dụ như chứng minh nhân dân, giấy phép
lái xe, bảo hiểm y tế,…Thì lúc đó bạn sẽ làm như thế nào???
Chắc có lẽ bạn sẽ phải mất nhiều thời gian để đăng tin trên các
trang mạng xã hội và cầu mong cho ai đó nhặt được sẽ nói cho bạn
biết để bạn có thể xin lại giấy tờ tùy thân của mình.Nhưng cơ hội đó
là vô cùng thấp, bởi trên đất nước Việt Nam có hơn 90 triệu người
với hơn 50 triệu tài khoản (theo thống kê số tài khoản Facenbook
năm 2017- facebook là mạng xã hội lớn nhất hiện nay.)thì cơ hội họ
nhìn thấy tin đăng giấy tờ thất lạc là cực kì cực kì thấp.
Nếu bạn vẫn chưa tìm ra được giấy tờ thất lạc của mình thông
qua việc đăng thông tin trên các trang mạng xã hội, thì chắc chắn đa
số những người làm thất lạc giấy tờ của mình phải thực hiện việc xin
cấp lại giấy tờ tại các cơ quan tổ chức có thẩm quyền.Điều này mang
đến cho họ sự tốn kém lớn, vì họ phải mất nhiều thời gian để làm lại
thủ tục xin cấp lại giấy tờ và nhiều chi phí phát sinh để làm việc
đó.Chưa kể các bạn phải mất công mất việc chỉ vì một phút bất cẩn
cho bản thân.
Chính vì điều đó, tôi đã nghiên cứu và xây dựng một webside
“HỖ TRỢ TÌM KIẾM GIẤY TỜ THẤT LẠC”.Giúp cho người nhặt
và người mất có thể tìm thấy nhau để trao đổi thông tin về giấy tờ
thất lạc.Người nhặt được có thể đăng tin tức lên webside, còn người
làm mất cũng đồng thời lên webside để tìm kiếm giấy tờ thất lạc của
mình.Và mục đích cuối cùng của tôi chỉ muốn giúp cho xã hội tốt
đẹp hơn, giúp cho cuộc sống của mọi người cảm thấy dễ dàng và tiện
lợi hơn.
1. Lý do chọn đề tài
1
- Mỗi người trong chúng ta chắc chắn ai cũng đã từng làm thất
lạc một cái gì đó trong đời rồi có đúng không nào???Bạn đã từng làm
mất sách giáo khoa, mất thướt kẻ hay bút…Rồi sau đó về nhà tỉ tê
xin mẹ tiền để mà mua lại những vật dụng đó.Chúng ta là con người
,bất cẩn cũng là một trong những bản tính của chúng ta, chính vì thế
mà không một ai trong đời mà chưa từng làm mất bất kì thứ gì được.
Ngày nay, giữa bộn bề của cuộc sống, nhiều người đã vô tình
làm thất lạc các loại giấy tờ tùy thân của mình trên đường, trong nhà
vệ sinh các trung tâm thương mại.Việc làm mất các loại giấy tờ gây
cho chúng ta không ít phiền phức.Lấy ví dụ dễ thấy nhất đó chính là :
chúng ta làm mất giấy chứng minh nhân dân của bản thân, Thì chúng
ta không thể nào làm một số thủ tục tại bệnh viện mỗi khi bị ốm hay
tại các cơ quan nhà nước khi làm một loại giấy tờ nào đó chẳng hạn
như làm giấy phép xây dựng chẳng hạn.Để xin cấp lại các loại giấy
tờ thì chúng ta phải tốn nhiều thời gian và công sức và thậm chí là
tiền của.Việc này làm gây nhiều phiền toái cho chúng ta.
Mà hiện nay khi người nhặt được giấy tờ lại khó tìm ra được
người mất vì trong nhiều tình huống người mất làm rơi giấy tờ khi đi
du lịch thì việc người nhặt được loại giấy tờ và người mất có thể nhìn
thấy nhau là vô cùng thấp.
Chính vì những điều này mà tôi đã nghiên cứu và phát triển ra
một website hỗ trợ việc tìm lại giấy tờ thất lạc cho người mất thông
qua việc kết nối giữa người mất và người nhặt được lại với nhau.Và
cũng chỉ với một nguyện vọng duy nhất là có thể đem những kiến
thức mình học được tạo nên một sản phẩm để phục vụ cộng đồng,
giúp cho cuộc sống con người có thể được thuận lợi và dễ dàng
hơn.Từ đó giúp cho cuộc sống con người được nâng cao, khuyển
2
- khích mọi người làm việc tốt, cuộc sống của con người sẽ trở nên tốt
đẹp hơn.
2. Mục tiêu và nhiệm vụ nghiên cứu
- Tìm hiểu quy trình chia sẻ thông tin về giấy tờ thất lạc
- Tìm hiểu về ngôn ngữ lập trình C#.
3. Đối tƣợng và phạm vi nghiên cứu
- Nghiên cứu về ngôn ngữ lập trình C#
- Tìm hiểu và nghiên cứu Freamword vue.js
- Nghiên cứu về quy trình thói quen đánh rơi giấy tờ của
người dùng
4. Phƣơng pháp nghiên cứu
Tìm hiểu và phân tích những tài liệu trên mạng.
5. Dự kiến kết quả
Xây dựng hoàn thiện được một trang web hỗ trợ tìm kiếm giấy
tờ thất lạc
6. Ý nghĩa khoa học và ý nghĩa thực tiễn
- Ý nghĩa khoa học
Kết quả nghiên cứu của đề tài góp phần nâng cao nhận thức,
khả năng thu thập thông tin, phân tích yêu cầu của người dùng để
xây dựng được trang web hoàn chỉnh. Bước đầu tiếp cận ngôn ngữ
lập trình để xây dựng trang web.
- Ý nghĩa thực tiễn
Trang web giúp cho những người thất lạc giấy tờ của mình dễ
dàng tiếp cận được những người nhặt được giấy tờ đó, từ đó nâng
cao nghĩa tình của người xã hội ngày nay,
Ngoài những nội dung như Phần mở đầu, kết luận, tài liệu
tham khảo thì nội dung chính của đồ án gồm các chương như sau:
3
- CHƢƠNG 1. CƠ SỞ LÍ THUYẾT
1.1. Ý TƢỞNG ĐỂ XÂY DỰNG TRANG WEB “HỖ TRỢ
TÌM KIẾM GIẤY TỜ THẤT LẠC”
Ngày nay, giữa bộn bề của cuộc sống, nhiều người đã vô tình
làm thất lạc các loại giấy tờ tùy thân của mình trên đường, trong nhà
vệ sinh các trung tâm thương mại.Việc làm mất các loại giấy tờ gây
cho chúng ta không ít phiền phức.Lấy ví dụ dễ thấy nhất đó chính là:
chúng ta làm mất giấy chứng minh nhân dân của bản thân, Thì chúng
ta không thể nào làm một số thủ tục tại bệnh viện mỗi khi bị ốm hay
tại các cơ quan nhà nước khi làm một loại giấy tờ nào đó chẳng hạn
như làm giấy phép xây dựng chẳng hạn.Để xin cấp lại các loại giấy
tờ thì chúng ta phải tốn nhiều thời gian và công sức và thậm chí là
tiền của.Việc này làm gây nhiều phiền toái cho chúng ta.
Hình 1.1. Người làm mất giấy tờ khổ sở tìm giấy tờ qua các tờ rơi
Mà hiện nay khi người nhặt được giấy tờ lại khó tìm ra được
người mất vì trong nhiều tình huống người mất làm rơi giấy tờ khi đi
du lịch thì việc người nhặt được loại giấy tờ và người mất có thể nhìn
thấy nhau là vô cùng thấp.
Chính vì những điều này mà tôi đã nghiên cứu và phát triển ra
một website hỗ trợ việc tìm lại giấy tờ thất lạc cho người mất thông
qua việc kết nối giữa người mất và người nhặt được lại với nhau.Và
4
- cũng chỉ với một nguyện vọng duy nhất là có thể đem những kiến
thức mình học được tạo nên một sản phẩm để phục vụ cộng đồng,
giúp cho cuộc sống con người có thể được thuận lợi và dễ dàng
hơn.Từ đó giúp cho cuộc sống con người được nâng cao, khuyển
khích mọi người làm việc tốt, cuộc sống của con người sẽ trở nên tốt
đẹp hơn.
1.2. MỤC ĐÍCH VÀ NHỮNG MỤC TIÊU CẦN ĐẠT ĐƢỢC
KHI XÂY DỰNG TRANG WEB “HỖ TRỢ TÌM KIẾM GIẤY
TỜ THẤT LẠC”
1.2.1. Mục đích
1.2.2. Những mục tiêu cần đạt đƣợc khi xây dựng trang web
“hỗ trợ tìm kiếm giấy tờ thất lạc”
1.3. VUE.JS – FREAMWORD SỐ 1 HỖ TRỢ XÂY DỰNG
GIAO DIỆN NGƢỜI DÙNG CỦA WEBSITE
1.3.1. Lịch sử phát triển
1.3.2. Kiến thức cơ bản về vue.js
1.3.2.1 Đối tƣợng Vue
1.3.2.2 Dữ liệu và phƣơng thức
1.3.2.3 Vòng đời của đối tƣợng
1.3.2.4 Các thƣ viện hỗ trợ
1.3.2.5 Thƣ viện Vue-router
1.3.2.6 Thƣ viện Vuex
1.3.2.7 Thƣ viện Vuex
1.4. MỘT SỐ CÔNG NGHỆ KHÁC ĐƢỢC ÁP DỤNG ĐỂ
XÂY DỰNG WEBSITE HỖ TRỢ TÌM KIẾM GIẤY TỜ THẤT
LẠC
1.4.1. HTML/CSS
1.4.1.1. Khái niệm
5
- 1.4.1.2. Tác dụng
1.4.2. Thƣ viện bootstrap
1.4.2.1. Khái niệm
1.4.2.2. Tác dụng
1.4.2.3. Lịch sử hình thành Bootstrap
1.4.2.4. Vì sao bạn nên sử dụng Bootstrap ?
1.4.2.5. Sử dụng Bootstrap có phải tốn phí không ?
1.4.2.6. Các bản dịch của Bootstrap
1.4.2.7. Những điểm mạnh của Bootstrap 4
1.4.3. Ngôn ngữ C#
1.4.3.1. Khái niệm
1.4.3.2. Mục tiêu phát triển C#
1.4.3.3. Đặc trưng của C#
1.4.4. Mô hình MVC
1.4.4.1. Khái niệm
1.4.4.2. Các thành phần trong MVC
1.4.4.3. MVC làm việc như thế nào?
1.4.4.4. Ưu và nhược điểm của mô hình MVC
6
- CHƢƠNG 2. PHÂN TÍCH THIẾT KẾ HỆ THỐNG
2.1. ĐẶC TẢ CHƢƠNG TRÌNH
Mọi người có thể vào trang web để đăng tìm kiếm giấy tờ mà
không cần phải đăng kí tài khoản của hệ thống.
Người nhặt được giấy tờ cần phải khai báo một số thông tin
như: Họ tên, giới tính, quê quán, số điện thoại, loại giấy tờ nhặt
được, ngày nhặt được, vị trí mà người đó nhặt được: xã, huyện, tỉnh,
Bang tin
và viết ghi chú cần thiết.
Người làm rơi giấy tờ có thể lên web tìm kiếm giấy tờ bằng
cách tìm kiếm theo các dữ liệu như sau: tìm kiếm theo loại giấy tờ,
tìm kiếm theo thời gian đánh mất và tìm kiếm theo địa điểm đánh
rơi.
Dang tin tim chinh chu
Nguoi Su Dung
Ngoài ra người nhặt và người làm mất giấy tờ còn có thế theo
dõi bảng tin qua mục trang chủ được cập nhật hang giờ để dễ dàng
tìm thấy nhau.
2.2. ĐẶC TẢ CÁC TRƢỜNG HỢP SỬTim
DỤNG
kiem nhanh giay to
2.2.1. Yêu cầu chức năng
2.2.2. Yêu cầu phi chức năng
2.3. MÔ HÌNH HÓA CHỨC NĂNG
2.3.1. Xác định tác nhân
Nguoi Su Dung
Nguoi Quan Li He Thong
Hình 2.1. Hai tác nhân chính tác động đến hệ thống
2.3.2. Xác định các ca sử dụng của hệ thống
7
- Tin tuc
Dong he thong
Dang tin tim chinh chu
Mo he thong
Nguoi Su Dung
Tim kiem nhanh giay to Nguoi Quan Li He
Thong
Update he thong
Chia se thong tin len mang xa hoi
Hình 2.2. Biểu đồ ca sử dụng
2.3.3. Biểu đồ hoạt động
2.3.3.1. Biểu đồ hoạt động xem tin tức
Hình 2.3. Biểu đồ hoạt động xem tin tức
2.3.3.2. Biểu đồ hoạt động đăng tin tìm chính chủ
Hình 2.4. Biểu đồ hoạt động đăng tin tìm chính chủ
8
- 2.3.3.3. Biểu đồ hoạt động tìm kiếm nhanh giấy tờ
Hình 2.5. Biểu đồ hoạt động tìm kiếm nhanh giấy tờ
2.3.3.4. Biểu đồ hoạt động chia sẻ thông tin lên mạng xã hội
Hình 2.6. Biểu đồ hoạt động chia sẻ thông tin lên mạng xã hội
2.3.4. Biểu đồ tuần tự
2.3.4.1. Biểu đồ tuần tự xem tin tức
9
- : Nguoi Su Dung : FrTinTuc : CtTinTuc : XaPhuongThiTran :
: QuanHuyen TinhThanhPho : LoaiGiayTo : ThongTinNguoiN
Xem tin tuc()
Tin tuc()
Lay TT XPT ()
Cap TT XPT ()
Lay TT QH ()
Cap TT QH ()
Lay TT TTP ()
Cap TT TTP ()
Lay TT LGT ()
Cap TT LGT()
Lay TT NN ()
Cap TT NN ()
Loc TT can hien thi ()
Tra tin tuc ()
Hien thi noi dung tin tuc ()
Hình 2.7. Biểu đồ tuần tự xem tin tức
2.3.4.2. Biểu đồ tuần tự đăng tin tìm chính chủ
: :
: Nguoi Su Dung : FrDangTin CtDangTin : XaPhuongThiTran : QuanHuyen TinhThanhPho : LoaiGiayTo : ThongTinNguoiN
Dang tin tim chinh chu ()
Dang Tin ()
Yeu cau nhap TT ()
Hien thi trang nhap TT ()
Nhap TT ()
Nhan TT()
Luu TT XPT ()
Luu TT QH ()
Luu TT TTP ()
Luu TT LGT ()
Luu TT NN ()
Da luu ()
Thong bao dang tin thanh cong ()
Hình 2.8. Biểu đồ tuần tự đăng tin tìm chính chủ
10
- 2.3.4.3. Biểu đồ tuần tự chia sẻ thông tin lên mạng xã hội
: Nguoi Su Dung : :
FrChiaSe CtChiaSe
Chia se TT ()
Chia se TT ()
Lay lien ket den mang xa hoi ()
Hien thi trang mang xa hoi ()
Chon tai khoan chia se ()
Chon TK ()
Tra cuu TK ()
Xac nhan chia se ()
Dong y chia se TT voi Tk da chon ()
Chap nhan chia se ()
Thuc hien chia se ()
Chia se thanh cong ()
Thong bao chia se thanh cong ()
Hình 2.9. Biểu đồ tuần tự chia sẻ thông tin lên mạng xã hội
2.3.5. Biểu đồ lớp
Hình 2.10. Biểu đồ lớp chi tiết của hệ thống
11
- CHƢƠNG 3. XÂY DỰNG WEBSITE HỖ TRỢ TÌM KIẾM
GIẤY TỜ THẤT LẠC
3.1. GIỚI THIỆU WEBSITE
3.1.1. Đôi nét về website “Hỗ trợ tìm kiếm giấy tờ thất lạc”
3.1.2. Cấu tạo website
3.1.2.1. Trang chủ
Hình 3.2. Trang chủ của website
3.1.2.2. Tìm chính chủ
Hình 3.3. Trang chính chủ của website
3.1.2.3. Tìm giấy tờ thất lạc
Hình 3.4. Trang tìm kiếm giấy tờ thất lạc của website
12
- 3.2. HƢỚNG DẪN CÁCH SỬ DỤNG WEBSITE “HỖ TRỢ
TÌM KIẾM GIẤY TỜ THẤT LẠC”
3.2.1. Trang chủ của trang web
Hình 3.5. Giao diện trang chủ
Hình 3.6. Giao diện đăng nhập của chức năng chia sẻ thông tin
3.2.2. Trang tìm chính chủ
13
- Hình 3.7. Giao diện tìm chính chủ
Hình 3.8. Hiển thị thông báo khi đăng bài thành công
3.2.3. Trang tìm giấy tờ thất lạc
Hình 3.9. Giao diện tìm kiếm giấy tờ thất lạc
Hình 3.10. Giao diện phần nhập dữ liệu cho người dùng
14
- Hình 3.11. Giao diện phần nhập hiển thị bản tin người dùng đã tìm
kiếm
Hình 3.12. Ví dụ về kết quả tìm kiếm
3.3. GIẤY TỜ THẤT LẠC VÀ VẤN ĐỀ PHÁP LÍ
3.3.1. Về vấn đề trao đổi mua bán thông tin cá nhân của ngƣời
khác.
3.3.2. Về vấn đề đăng thông tin giả mạo để lừa đảo
15
- KẾT LUẬN
Bằng công sức và sự sáng tạo , mặc dù trang web này vẫn
chưa được xuất sắc, nhưng tôi vẫn muốn cống hiến một chút gì đó
cho xã hội thông qua đồ án của tôi, Chứ không phải là tôi làm đồ án
chỉ để qua môn, để lấy bằng tốt nghiệp.
Thông qua đồ án chuyên đề lần này tôi đã tự tìm tòi và học hỏi
được khá nhiều kiến thức mới để vận dụng vào đồ án, thông qua đó
tôi biết được VUE.JS một freamword tuyệt vời và linh động đã hỗ
trợ tôi rất nhiều.
Ngoài ra tôi còn gửi lời đến thầy Lợi đã tận tình giúp đỡ cho
tôi trong suốt quá trình mà tôi làm đồ án có chút thắc mắc hay không
hiểu gì đều hỏi thầy cả.Và tôi càng gửi lời cảm ơn đến anh Huấn –
cựu sinh viên công nghệ thông tin khóa 10 đã gợi ý cho tôi làm đồ án
từ VUE.JS và đưa ra khá nhiều lời khuyên cho tôi trong suốt quá
trình làm đồ án
Trong đồ án tốt nghiệp tiếp theo, tôi sẽ cố gắng hoàn thiện
trang web này để thực hiện được nguyện vọng được cống hiến sức
cho xã hội và làm cho xã hội tốt đẹp hơn.
16
nguon tai.lieu . vn