Báo cáo thực tập lập trình FRONTEND cho hệ thống ERP với công nghệ SENCHA EXT JS

Chính vì thế mà hàng loạt các tổ chức, doanh nghiệp, tập đoàn đã sử dụng ERP như 1 công cụ quản lý công việc, lưu trữ thông tin, quản lý việc kinh doanh, không chỉ dùng cho nội bộ và còn

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

KHOA CÔNG NGHỆ PHẦN MỀM

BÁO CÁO THỰC TẬP

LẬP TRÌNH FRONTEND CHO HỆ THỐNG ERP VỚI CÔNG NGHỆ SENCHA EXT JS

Công ty thực tập : Công ty TNHH Tin học Viễn thông Tavico Người phụ trách : Anh Nguyễn Nam Thạch - Technical Leader Thực tập sinh : Nguyễn Huỳnh Thanh Tâm

TP Hồ Chí Minh, tháng 7 năm 2020

LỜI MỞ ĐẦU

Ngày nay, ngành công nghệ thông tin ngày càng trở nên lớn mạnh Công nghệ là một phần không thể thiếu trong bộ máy hoạt động của các doanh nghiệp và tập đoàn lờn Vì thế với khả năng quản lý đa chức năng, tích hợp thông tin từ tất cả các phòng ban vào 1 hệ thống duy nhất,m hệ thống ERP (Enterprise resource planning) đã trở thành cách tay đắc lực cho bất cứ doanh nghiệp hay tổ chức kinh doanh nào

Cùng với xu thế phát triển của thế giới, Việt Nam cũng không phải ngoại lệ Trước đây, thông thưởng ở các doanh nghiệp của Việt Nam, mỗi phòng ban người ta sẽ dùng một loại phần mềm khác nhau Khi dùng từng phần mềm riêng lẻ như cách truyền thống, việc kết nối các dữ liệu với nhau rất khó, nhất là khi khối lượng dữ liệu lớn hoặc các phần mềm của từng phòng ban không tương thích với nhau, thế nên sự phối hợp giữa nhiều bộ phận của một công ty trở nên khó khăn, tốn kém, mất thời gian

Chính vì thế mà hàng loạt các tổ chức, doanh nghiệp, tập đoàn đã sử dụng ERP như 1 công cụ quản lý công việc, lưu trữ thông tin, quản lý việc kinh doanh, không chỉ dùng cho nội

bộ và còn kết nối dữ liệu của nhiều công ty khác nhau trong cùng 1 tập đoàn Do đó, nhu cầu về nhân lực để tạo ra các hệ thống này là vô cùng lớn Vì lý do này, em đã quyết định lựa chọn lập trình ứng dụng web, cụ thể hơn là xây dựng các hệ thống ERP cho giai đoạn thực tập của mình

Sau ba năm học tập ở trường, với mong muốn có thêm kinh nghiệm làm việc trên các dự

án thực tế, cũng như muốn được tham gia xây dựng các trang web đa năng trong một môi trường chuyên nghiệp, em có dự định là sẽ thực tập trong hè Vì vậy, em quyết định chọn Tavico - một môi trường lý tưởng, hiện đại, chuyên nghiệp - là nơi sẽ giúp em thực hiện được

dự định này

LỜI CẢM ƠN

Trân trọng gửi lời cảm ơn Công ty TNHH Tin học Viễn Thông Tavico

Chỉ trong một thời gian ngắn, nhưng nhờ sự chỉ dẫn nhiệt tình của các thành viên trong công ty nói chung và thành viên team lập trình nói riêng, em đã tiếp thu được những kiến thức cần thiết và bổ ích để có thể đóng góp vào việc xây dựng và phát triển sản phẩm của công ty

Đặc biệt, em muốn gửi lời cảm ơn anh Nguyễn Nam Thạch vì trong những ngày đầu vào

làm việc, anh đã nhiệt tình hướng dẫn, giúp đỡ em rất nhiều về mặt kĩ thuật như là cách để code đẹp và dễ thay đổi, cái tìm lỗi bằng công cụ Goole Dev Tools, cách sử dụng framework hiện tại; cảm ơn anh Phạm Hữu Vinh đã tận tình chỉ dẫn nghiệp vụ trong công ty cũng như giải thích cho

em các tài liệu thiết kế, và cuối cùng em cũng cảm ơn các anh chị khác đã liên tục tạo điều kiện tốt nhất để em có thể hoàn thành tốt nhiệm vụ và công việc được giao, được tham gia nhiều dự

án lớn và rút ra nhiều bài học kinh nghiệm cho bản thân

Em cũng xin trân trọng cảm ơn thầy cô trong khoa Công nghệ phần mềm đã nhiệt tình hỗ trợ, tạo điều kiện để em có thể hoàn thành bài báo cáo này

Nguyễn Huỳnh Thanh Tâm TpHCM, ngày 28 tháng 7 năm 2020

NHẬN XÉT CỦA KHOA

MỤC LỤC

Chương 1: Giới thiệu công ty thực tập 6

1 Sơ lược về công ty 6

2 Sản phẩm của công ty 6

Chương 2: Nội dung thực tập 8

1 Tìm hiểu công ty 8

2 Framework và các công cụ hỗ trợ 8

3 Tìm hiểu ngôn ngữ Javascript 8

4 Tìm hiểu backend và hệ quản trị cơ sở dữ liệu 9

Chương 3: Chi tiết về project 12

1 Ứng dụng web Calllog Center 12

2 Ứng dụng web E-Invoice 12

3 Ứng dụng web Construction Project Management 13

TÀI LIỆU THAM KHẢO 18

Chương 1: Giới thiệu công ty thực tập

1 Sơ lược về công ty

Website chính thức: http://tavicosoft.com

Tavico khởi đầu là 1 công ty startup, được thành lập vào năm 2004, là công ty phần mềm chuyên cung cấp các giải pháp về tài chính, kế toán, bất động sản,… cho các doanh nghiệp

và tập đoàn lớn

Công ty khởi đầu với chỉ 5 thành viên, thực hiện dự án lớn đầu tiên về giải pháp quản lý tài chính cho tập đoàn dầu khí vào năm 2008 Tiếp nối thành công đó, sản phẩm của công ty được biết đến rộng rãi hơn Cột mốc của Tavico được đánh dấu khi mà công ty có cơ hội được làm việc với khách hàng lớn như tập đoàn Đất Xanh Group, phát triển hệ thống quản

lý bất động sản cho họ Đặc biệt, vào đầu năm 2013, Tavico vinh dự trở thành đại diện của INFOR – tập đoàn đa quốc gia về kế toàn tài chính ở Việt Nam

Từ năm 2014, công ty bắt đầu xây dựng thương hiệu cho mình bằng việc phát triển và nâng cấp các sản phẩm độc quyền liên quan nhiều lĩnh vực như tuyển dụng, quản lý bất động sản, hóa đơn điện tử, kế toán, quản lý đặt chỗ,… Từ đó đến năm 2018, Tavico mở rộng, phát triển mạng lưới quan hệ lên tới 100 đối tác Không những thế, công ty cũng không ngừng áp dụng các công nghệ mới, nâng cấp sản phẩm, đổi mới nhân lực, tuyển thêm nhân lực trẻ và có kì vọng, đồng thời mở rộng môi trường làm việc hiện đại và tiện nghi hơn

2 Sản phẩm của công ty

Dưới đây là 1 vài sản phẩm chính của công ty:

- TVC workspace: Quản lý điểm làm việc, cụ thể là quản lý dịch vụ và thiết bị, đặt chỗ và phê duyệt , quản lý thời gian làm việc, lên lịch chi tiết cho công việc, quản lý các báo cáo

- Real Estate Management: Quản lý hoạt động kinh doanh, xây dựng bất động sản, cụ thể hơn là quản lý thông tin các tòa nhà, các hợp đồng đã kí và lịch sử giao dịch, lập và in các báo cáo chi tiết, báo cáo chức năng, chi tiết hóa đơn,… Phần mềm cũng có thể tích hợp vào hệ thống quản lý tài chính hiện tại

- Customer Care Application (Android and IOS): là công cụ giao tiếp giữa khách hàng mua bất động sản và chủ đầu tư Ứng dụng cung cấp thông tin chi tiết liên quan đến giao dịch của chính khách hàng đó, ngoài ra còn là nơi để họ có thể theo dõi các hóa đơn điện, nước, internet, truyền hình cáp, hồ bơi, phòng tập gym,…

Chương 2: Nội dung thực tập

1 Tìm hiểu công ty

Thời gian: 1 ngày

Nội dung: Giới thiệu về công ty (quá trình thành lập và phát triển), cách tổ chức từ cao

đến thấp, giới thiệu các team và cách làm việc của mỗi team, quy trình làm việc chung của công ty Ngoài ra, thực tập sinh còn được phổ biến các quy định như giờ giấc đi làm, cách sử dụng email trong công việc…

Kết quả: Hiểu thêm về công ty, làm quen được với đồng nghiệp mới Đồng thời nắm bắt

được những kiến thức cần trau dồi thêm, và hiểu rõ công việc, nhiệm vụ, trách nhiệm của bản thân

2 Framework và các công cụ hỗ trợ

Thời gian: 2 ngày

2.1 Tìm hiểu Sencha Architect

Nội dung: Cài đặt môi trường để lập trình và chạy thử trên máy Được training về cách

sử dụng Sencha Architect, sau đó thiết kế các module theo thiết kế có sẵn từ các dự án trước

- MVC: là mô hình bao gồm 3 lớp Model, View và Controller View được sử dụng để

hiển thị những dữ liệu được lưu ở Model, và các hành động đó được xử lý ở Controller Bằng cách này, mỗi lớp sẽ được định rõ nhiệm vụ của mình, giúp phần mềm dễ kiểm tra

và bảo trì hơn

- MVVM: là mô hình gần như tương tự với MVC nhưng điểm khác biệt của nó nằm ở lớp

ViewModel, được xem là 1 trừu tượng của lớp View ở MVC ViewModel có khả năng chỉ ra thay đổi giữa dữ liệu của Model và hiển thị của View bằng kĩ thuật data-binding Việc này giúp giảm thiểu và loại bỏ các logic đang trực tiếp thao tác với lớp View MVVM được sử dụng đối với các dự án lớn, phức tạp và cần viết unit test

- UI components: Sencha Architect cung cấp các component có sẵn như form, tree,

grid,… Ngoài ra người dùng cũng có thể tự customize các component đó bằng css thuần

2.2 Cài đặt công cụ Total Commander, SVN

Nội dung: Cài đặt và học cách sử dụng Total Commander, cài đặt môi trường svn, học

cách quản lý code trên svn và phân chia công việc với các thành viên còn lại trong team

Thực hiện: Tiến hành cài đặt môi trường lập trình và thực hành sử dụng Sencha

Architect

Kết quả: Làm quen được với framework mới, có thể tự thiết kế các form và module theo

tài liệu thiết kế có sẵn

3 Tìm hiểu ngôn ngữ Javascript

Thời gian: 2 ngày

Nội dung: Tìm hiểu các kiến thức nền tảng của ngôn ngữ Javascript

- Kiến thức cơ bản: câu lệnh điều kiện, vòng lặp, các toán tử so sánh, cách gọi api và lấy

dữ liệu trả về

- Callback: là 1 function được gọi để thực thi sau khi 1 function khác thực thi xong

Callback được áp dụng để thực hiện xử lý dữ liệu có được sau khi gọi api để lấy từ backend

- Hoisting: các khai báo biến đều được đẩy lên phần đầu tiên của phạm vi mà biến được

sử dụng Những hàm khai báo sau nếu trùng tên sẽ ghi đè lên hàm khai báo trước Kĩ thuật này giúp ta tránh khai báo lại biến cùng tên ở nơi khác, làm thay đổi giá trị của biến

1 cách không mong muốn

- Closure: Khi một hàm có thể ghi nhớ và truy cập lexical scope của nó kể cả khi nó

được gọi ngoài lexical scope đó được gọi là Closure

4 Tìm hiểu backend và hệ quản trị cơ sở dữ liệu

Thời gian: 2 ngày

Nội dung: Tìm hiểu kiến thức cơ bản về C# NET và cách truy vấn vào database của dự

án qua Microsoft SQL Server Vì chuyên môn chính của thực tập sinh là lập trình frontend nên phần backend chỉ được giới thiệu sơ lược kiến trúc của hệ thống, chứ không

được training bài bản

- Mô hình 3 lớp: backend được viết theo mô hình 3 lớp, gồm BUS, DAO và DTO Mỗi

khi bắt đầu 1 dự án mới, hệ thống sẽ tự generate các model và các đoạn code có chức năng thêm, xóa, sửa ở tầng BUS vào DAO Nhiệm vụ của thực tập sinh là viết thêm và sửa đổi backend tùy theo yêu cầu của khách hàng từ dự án đó

- MSSQL: được training cách viết truy vấn từ đơn giản đến phức tạp, sử dụng JOIN IN,

LEFT JOIN và RIGHT JOIN

5 Thực hiện project

Sau 2 tuần học việc và 1 tháng thử việc, thực tập sinh đã được training và thực hành, nắm được những kiến thức cơ bản về Javascript, cách sử dụng framework Sencha Architect, hiểu rõ luồng chạy của 1 trang web, nắm được khái niệm hệ thống ERP là gì, cách viết api và cách gọi api từ frontend để lấy những dữ liệu cần thiết Từ tháng thứ 2 trở đi, thực tập sinh được giao 1 vài module nhỏ cho dự án E-invoice (hóa đơn điện tử), được hướng dẫn và làm việc chung với các thành viên trong team Sau khi kết thúc dự án đó, trainer cảm thấy thực tập sinh đã đạt được các yêu cầu như mong muốn nên quyết định hướng dẫn cách viết api ở backend và giao 1 số form quan trọng của các dự án mới Chi tiết các

dự án mà thực tập sinh đã tham gia được trình bày ở chương 3

6 Lịch làm việc

Tuần Công việc Người hướng dẫn Mức độ hoàn thành

Nhận xét của người hướng dẫn

1 - Tìm hiểu về công ty, Anh Phạm

cách tổ chức của công

ty

- Làm quen với đồng nghiệp mới

- Học cách trao đổi, làm việc qua email

Hữu Vinh

2

- Tìm hiểu ngôn ngữ lập trình Javascript cơ bản

và nâng cao

- Tìm hiểu về framework Ext Js và IDE Sencha Architect

- Thực hành sử dụng Sencha Architect

Anh Phạm Hữu Vinh

3

- Tìm hiểu về C# NET

- Tìm hiểu mô hình 3 lớp

- Ôn lại các câu lệnh truy vấn sql

Anh Nguyễn Nam Thạch

4

Giai đoạn thử việc

- Thiết kế và đổ dữ liệu cho form Calllog Center - 1 dạng ghi chú cho mỗi cuộc gọi của khách hàng gọi đến

- Thiết kế frontend cho các form đơn giản của

dự án E-invoice

Anh Nguyễn Nam Thạch

5

Giai đoạn làm việc chính

thức:

- Thực hành viết các api

ở backend cho các form được giao (trước đây anh Thạch đảm nhiệm việc này)

- Tham gia các buổi họp

về chi tiết thiết kế của

dự án phần mềm quản

lý bất động sản

- Thiết kế các form được

giao ở dự án quản lý bất động sản cho tập đoàn

Anh Nguyễn Nam Thạch

Đất Xanh

6

Giai đoạn làm việc chính

thức (tiếp theo):

- Giai đoạn fix bug, bảo

trì cho dự án E-invoice

- Viết lại chức năng lập

hóa đơn theo yêu cầu của khách hàng

Anh Nguyễn Nam Thạch

7

Giai đoạn làm việc chính

thức (tiếp theo):

- Viết các chức năng so sánh chi phí hao tổn trong kế toán, tài chính

và lập kế hoạch cho phần mềm quản lý dự

án xây dựng

- Thêm chức năng ghi lại lịch sử thao tác cho tất

cả các form được giao

Anh Nguyễn Nam Thạch

8

Giai đoạn nghiệm thu, báo

cáo, kết thúc dự án:

- Fix bug toàn dự án cùng với team

- Chỉnh sửa giao diện theo yêu cầu của tester

- Báo cáo cuối đợt thực tập

Anh Nguyễn Nam Thạch

Chương 3: Chi tiết về project

1 Ứng dụng web Calllog Center

- Mô tả: Ứng dụng ghi lại thông tin cuộc gọi

- Thời gian thực hiện: 1 tháng

- Công việc:

+ Ghi lại thông tin các cuộc gọi từ khách hàng (người gọi, thời gian gọi, file ghi âm,…) + Thiết kế giao diện để người dùng có thể bình luận, ghi chú tại mỗi note thông tin cuộc gọi

- Kiến thức học được:

+ Vì Sencha Architect không hỗ trợ các UI components đúng với mong muốn của khách hàng nên thực tập sinh phải tự viết html, css thuần để thiết kế giao diện cho người dùng bình luận, xóa và chỉnh sửa bình luận

+ Học được cách sử dụng mô hình MVC

2 Ứng dụng web E-Invoice

- Mô Tả: Ứng dụng web phát hành hóa đơn điện tử.

- Thời gian thực hiện: 2 tháng

- Công việc:

+ Thiết kế các form quản lý thông tin người dùng, thông tin đơn vị phát hành hóa đơn, quản lý mẫu hóa đơn/mẫu in, lịch sử đăng ký hóa đơn, quản lý thông tin khách hàng, tải nhập, tải xuất thông tin khách hàng

- Kiến thức học được:

+ Học được cách sử dụng mô hình MVVM, cách gọi api và xử lý dữ liệu Các hàm xử lý không còn được viết trên Controller như MVC nữa mà được thực hiện hết ở ViewController

3 Ứng dụng web Construction Project Management

- Mô Tả: Ứng dụng web quản lý các dự án xây dựng bất động sản Ứng dụng bao gồm các chức năng chính như:

+ Lưu trữ thông tin dự án xây dựng (thành viên, tài liệu, chỉ tiêu kiến trúc, phân loại căn hộ)

+ Lập và cập nhật tiến độ dự án: theo dõi tiến độ từng hạng mục công việc và tổng tiến

độ dự án bằng biểu đồ Gantt, theo dõi nhân viên phụ trách, theo dõi lịch sử tiến độ dự án, ghi chú lai thao tác trên từng tiến độ

+ Lập kế hoạch tài chính: tính tổng sơ bộ chi phí, lập khái toán, lưu trữ thông tin ngân sách

+ Lập khái toán, dự toán, hợp đồng

+ Đề nghị thanh toán chi phí ngoài hợp đồng

+ Đánh giá hoàn thành dành cho nhà cung cấp và khách hàng: theo dõi và đánh giá tiến

độ hoàn thành các công trình xây dựng theo %

- Thời gian thực hiện: 5 tháng (do ảnh hưởng của dịch Covid nên thời gian hoàn thành dự án dài hơn dự kiến)

- Công việc:

+ Thiết kế và đổ dữ liệu cho form “Gói thầu”, giúp người dùng lập dự toán, dự tính chi phí các vật tư, nhân công, tải nhập dữ liệu, lưu trữ thông tin nhà thầu, các sự kiện, ghi chú