Product and Sales Management System of Kim & Jew Minimart

ระบบจดการสนคาและการขายของรานคม & จวมนมารท Product and Sales Management System of Kim & Jew Minimart

นายธนชย เกยรตกองคร 5804800068

ปรญญานพนธนเปนสวนหนงของการศกษาตามหลกสตรปรญญาวทยาศาสตรบณฑต ภาควชาวทยาการคอมพวเตอร คณะวทยาศาสตร

มหาวทยาลยสยาม ปการศกษา 2561

ก

หวขอปรญญานพนธ ระบบจดการสนคาและการขายของรานคม & จวมนมารท

หนวยกตของปรญญานพนธ 3 หนวยกต

รายชอผจดทา นายธนชย เกยรตกองคร 5804800068

อาจารยทปรกษา อาจารยเอก บารงศร

ระดบการศกษา วทยาศาสตรบณฑต

ภาควชา วทยาการคอมพวเตอร

ปการศกษา 2561

บทคดยอ

รานคาคมแอนดจว เปนรานคาขายของชาแบบขายปลก ตงอยท ซ. เพชรเกษม 63 เขตบาง

แค กรงเทพฯ พบปญหา ในการซอขายยงคงใชกระดาษจดบนทกรายการขายและใชเครองคดเลข

ในการคานวณรายรบ-รายจายตาง ๆ ซงเกดความผดพลาดบอยครง รวมไปถงสนคาไมเพยงพอหรอ

คางสตอกนาน ดวยเหตนผจดทาจงไดสรางเวบแอพพลเคชนระบบจดการสนคาและขายของรานคา

คมแอนดจวมนมารททสามารถบนทกรายการสงซอ คานวณเงนและออกบลใหลกคาได และ

สามารถตดสตอกไดโดยทสตอกจะสามารถแจงเตอนสนคาทมจานวนเหลอนอยและแจงเตอน

สนคาทขายไมออกเลยใหผประกอบการนาไปบรหารจดการ เพอชวยอานวยความสะดวกและเพม

ประสทธภาพในการบรหารและจดการรานคา โดยระบบ ประกอบดวย ระบบงานหลกสาหรบ

ผดแลระบบ ในการบรหารจดการดแลขอมลสนคา บรหารจดการขอมลพนกงาน การแจงเตอน

สนคาคางสตอกหรอขาดสตอกและจดการการสงซอสนคารวมไปถงออกบลและบนทกรายการขาย

ปรญญานพนธนพฒนาขนดวยภาษาไพทอน (Python) ในสวนของการพฒนาระบบและเวบเซอรวส

สวนเวบแอปพลเคชนมการพฒนาดวย Bootstrap 4 เมอพฒนาเสรจสนระบบชวยลดความผดพลาด

ในการทางาน แกไขปญหาการจดการคลงสนคาใหดขน ปองกนปญหาขอมลสญหายและลด

ระยะเวลาในการทางาน

คาสาคญ: จดการขอมล , เวบแอพพลเคชน , รานคม & จวมนมารท

ค

กตตกรรมประกาศ

(Acknowledgement)

การจดทาปรญญานพนธฉบบนสาเรจลงไดนน ผจดทาไดแนวทางการพฒนาระบบจาก

อาจารยผสอนทกทานทใหขอมลตาง ๆ ทเกยวกบการพฒนาโปรแกรมสงผลใหผจดทาไดรบความร

ความเขาใจ และประสบการณตาง ๆ โดยปรญญานพนธฉบบนสาเรจลงดวยดจากความรวมมอและ

สนบสนนจากหลายฝายดงน

1. อาจารยเอก บารงศร อาจารยทปรกษา

2. นายภมศกด ภมรนทร

3. นางสาวจนทรธดา ระบอธรรม

ผจดทาขอขอบคณคณะกรรมการการสอบปรญญานพนธ ทไดใหคาแนะนาทดตลอดการ

สอบปรญญานพนธ และขอบคณผมสวนรวมทกทานรวมถงผทมสวนรวมทไมไดกลาวมา ณ ทน

ทกทานดวย ทไดใหความชวยเหลอ และปรกษาคาแนะนาตาง ๆกบผจดทาจนประสบความสาเรจ

ดวยด

ทายสด ผจดทาปรญญานพนธขอกราบขอบพระคณบดา มารดา ทไดใหการสนบสนน

สงเสรมทงกาลงใจและกาลงทรพยตลอดจนสาเรจการศกษา

ผจดทา

นายธนชย เกยรตกองคร

สารบญ

หนา

บทคดยอ ........................................................................................................................................... ก

Abstract ............................................................................................................................................ ข

กตตกรรมประกาศ ............................................................................................................................ ค

บทท 1 บทนา

1.1 ทมาของการพฒนาระบบ .............................................................................................. 1

1.2 วตถประสงคของภาคนพนธ ......................................................................................... 1

1.3 ขอบเขตของปรญญานพนธ ........................................................................................... 1

1.4 ประโยชนคาดวาทจะไดรบ ............................................................................................ 2

1.5 ขนตอนและวธการดาเนนภาคนพนธ ............................................................................ 2

1.6 แผนและระยะเวลาดาเนนปรญญานพนธ ....................................................................... 3

1.7 อปกรณและเครองมอทใชในการพฒนาโครงงาน ......................................................... 4

1.8 อปกรณและเครองมอทรองรบ ....................................................................................... 4

บทท 2 แนวทฤษฎทเกยวของ

2.1 Bootstrap Framework ................................................................................................... 5

2.2 Web Application ........................................................................................................... 6

2.3 Database ....................................................................................................................... 7

2.4 Angular Framework ................................................................................................... 10

2.5 RESTfulAPI ............................................................................................................... 11

2.6 Visual Studio Code ..................................................................................................... 12

2.7 Postman ...................................................................................................................... 13

บทท 3 การวเคราะหและออกแบบระบบ

3.1 รายละเอยดของปรญญานพนธ .................................................................................... 14

3.2 การทางานของระบบ ................................................................................................... 14

3.2.1 Use Case Diagram ...................................................................................... 14

3.3 Sequence Diagram ...................................................................................................... 24

สารบญ (ตอ)

หนา

3.4 Class Diagram ............................................................................................................ 29

3.5 Class Diagram ............................................................................................................ 30

บทท 4 การออกแบบทางกายภาพ

4.1 พจนานกรมขอมล ....................................................................................................... 31

4.1 การออกแบบสวนตดตอกบผใช .................................................................................. 37

บทท 5 สรปผลและขอเสนอแนะ

5.1 สรปผลปรญญานพนธ ................................................................................................. 54

5.2 ขอดของระบบ ............................................................................................................. 54

5.3 ขอจากดของระบบ ....................................................................................................... 54

5.4 ขอเสนอแนะ ................................................................................................................ 54

บรรณานกรม ................................................................................................................................... 55

สารบญตาราง

หนา

ตารางท 1.1 แสดงแผนและระยะเวลาดาเนนปรญญานพนธ ............................................................. 3

ตารางท 3.1 รายละเอยดของ Use Case : การจดการขอมลสนคา ..................................................... 15

ตารางท 3.2 รายละเอยดของ Use Case : การจดการขอมลพนกงาน ............................................... 17

ตารางท 3.3 รายละเอยดของ Use Case : การจดการขอมลซพพลายเออร ....................................... 19

ตารางท 3.4 รายละเอยดของ Use Case : เขาสระบบ ....................................................................... 21

ตารางท 3.5 รายละเอยดของ Use Case : กราฟรายงานยอดการขาย ................................................ 22

ตารางท 3.6 รายละเอยดของ Use Case : ใบเสนอสนคา .................................................................. 23

ตารางท 4.1 ตารางขอมล employee ................................................................................................ 31

ตารางท 4.2 ตารางขอมล brand ...................................................................................................... 32

ตารางท 4.3 ตารางขอมล sale_bill ................................................................................................. 32

ตารางท 4.4 ตารางขอมล bill_detail .............................................................................................. 32

ตารางท 4.5 ตารางขอมล category ................................................................................................. 33

ตารางท 4.6 ตารางขอมล product .................................................................................................. 33

ตารางท 4.7 ตารางขอมล purchaseorder ......................................................................................... 34

ตารางท 4.8 ตารางขอมล purchaseorder_detail ............................................................................. 34

ตารางท 4.9 ตารางขอมล receive_product ..................................................................................... 35

ตารางท 4.10 ตารางขอมล receive_detail ...................................................................................... 35

ตารางท 4.11 ตารางขอมล supplier ................................................................................................ 36

ตารางท 4.12 ตารางขอมล unit ...................................................................................................... 36

สารบญรปภาพ

หนา

รปท 2.1 Bootstrap Framework ......................................................................................................... 5

รปท 2.2 โครงสราง Web Application ............................................................................................... 6

รปท 2.3 Database ............................................................................................................................. 7

รปท 2.4 ระบบจดการฐานขอมล ....................................................................................................... 8

รปท 2.5 Angular ............................................................................................................................. 10

รปท 2.6 RESTfulAPI ..................................................................................................................... 11

รปท 2.7 Visual Studio Code ........................................................................................................... 12

รปท 2.8 Postman ............................................................................................................................ 13

รปท 3.1 แผนภาพ Use Case Diagram ของเวบแอปพลเคชน ......................................................... 14

รปท 3.2 Sequence Diagram:Login Admin ..................................................................................... 24

รปท 3.3 Sequence Diagram:Product management ......................................................................... 25

รปท 3.4 Sequence Diagram:Employee management ..................................................................... 26

รปท 3.5 Sequence Diagram:Supplier management ........................................................................ 27

รปท 3.6 Sequence Diagram:Sale graph .......................................................................................... 28

รปท 3.7 Sequence Diagram:Guotation ........................................................................................... 28

รปท 3.8 Class Diagram .................................................................................................................. 29

รปท 3.9 Entity Relationship Diagram ............................................................................................ 30

รปท 4.1 หนาจอแสดงการลงชอเขาใชของระบบ ............................................................................ 37

รปท 4.2 หนาจอแสดงขอมลของประเภทสนคา .............................................................................. 37

รปท 4.3 หนาจอเพมขอมลประเภทสนคา ....................................................................................... 38

รปท 4.4 หนาจอแกไขขอมลประเภทสนคา .................................................................................... 38

รปท 4.5 หนาจอลบขอมลประเภทสนคา......................................................................................... 39

รปท 4.6 หนาจอแสดงขอมลของแบรนดสนคา ............................................................................... 39

รปท 4.7 หนาจอเพมขอมลแบรนดสนคา ........................................................................................ 40

รปท 4.8 หนาจอแกไขขอมลแบรนดสนคา ..................................................................................... 40

รปท 4.9 หนาจอลบขอมลแบรนดสนคา ......................................................................................... 41

รปท 4.10 หนาจอแสดงขอมลของหนวยสนคา ............................................................................... 41

สารบญรปภาพ (ตอ)

หนา

รปท 4.11 หนาจอเพมขอมลหนวยสนคา ......................................................................................... 42

รปท 4.12 หนาจอแกไขขอมลหนวยสนคา ...................................................................................... 42

รปท 4.13 หนาจอลบขอมลหนวยสนคา .......................................................................................... 43

รปท 4.14 หนาจอแสดงขอมลของสนคา ......................................................................................... 43

รปท 4.15 หนาจอเพมขอมลสนคา .................................................................................................. 44

รปท 4.16 หนาจอแกไขขอมลสนคา ................................................................................................ 44

รปท 4.17 หนาจอแกไขขอมลสนคา ................................................................................................ 45

รปท 4.18 หนาจอขอมลซพพลายเออร ............................................................................................ 45

รปท 4.19 หนาจอเพมซพพลายเออร ............................................................................................... 46

รปท 4.20 หนาจอแกไขซพพลายเออร ............................................................................................. 46

รปท 4.21 หนาจอลบขอมลซพพลายเออร ....................................................................................... 47

รปท 4.22 หนาจอขอมลพนกงาน .................................................................................................... 47

รปท 4.23 หนาจอเพมขอมลพนกงาน .............................................................................................. 48

รปท 4.24 หนาจอเปลยนรหสผาน ................................................................................................... 48

รปท 4.25 หนาจอแกไขขอมลพนกงาน ........................................................................................... 49

รปท 4.26 หนาจอลบขอมลพนกงาน ............................................................................................... 49

รปท 4.27 หนาจอออกใบสงซอ ....................................................................................................... 50

รปท 4.28 หนาจอแสดงขอมลคาสงซอสนคา .................................................................................. 50

รปท 4.29 หนาจอแสดงขอมลคาสงซอสนคา .................................................................................. 51

รปท 4.30 หนาจอการขายสนคา ...................................................................................................... 51

รปท 4.31 หนาจอสรปคาสงซอ ....................................................................................................... 52

รปท 4.32 หนาจอสรปยอดการขายในแตละวน ............................................................................... 52

รปท 4.33 หนาจอแจงเตอน ............................................................................................................. 53

บทท1

บทนา

1.1 ทมาของการพฒนาระบบ

ปจจบนนการใชเทคโนโลย เปนสงทมความสาคญ สาหรบยคนไมวาจะเปนการ

ตดตอสอสารและรวมถง การคนหาขอมลตาง ๆ และการใชเทคโนโลย เพอการทางานและจดการ

ธรกจของผประกอบการ ซงธรกจของทางบานผจดทาเปนธรกจการคาขายปลกรานคารานคาคม

แอนดจวมนมารท ในการซอขายยงคงใชกระดาษจดบนทกรายการขายและใชเครองคดเลขในการ

คานวณรายรบ-รายจายตาง ๆ ซงเกดความผดพลาดบอยครงรวมไปถงสนคาไมเพยงพอหรอคาง

สตอกนานเนองจากไมมระบบคอยแจงเตอนในการชวยบรหารจดการ

ดงนนผจดทาจงเหนวาควรนาความรทไดศกษามาปรบใชในธรกจรานคาของทางบานโดย

สรางเวบแอพพลเคชนระบบจดการสนคาและการขายของรานคาคมแอนดจวมนมารททสามารถ

ชวยอานวยความสะดวกและเพมประสทธภาพในธรกจรานคาคมแอนดจวมนมารทใหมากขนสราง

เวบแอพพลเคชนใหตรงกบความตองการมากทสดและแกปญหาทเกดขนซงเวบแอพพลเคชนน

สามารถบนทกรายการสงซอคานวณเงนและออกบลใหลกคาไดและสามารถตดสตอกไดโดยท

สตอกจะสามารถแจงเตอนสนคาทมจานวนเหลอนอยและแจงเตอนสนคาทขายไมออกเลยให

ผประกอบการนาไปจดโปรโมชน

1.2 วตถประสงคของภาคนพนธ

พฒนาระบบการจดการสนคาและการขายสาหรบราน คม & จว มนมารท

1.3 ขอบเขตของภาคนพนธ

1.3.1 ผดแลระบบ

1.3.1.1 สามารถจดการขอมลการขายสนคาได

1.3.1.2 สามารถจดการขอมลสนคาและประเภทสนคาได

1.3.1.3 สามารถจดการขอมลรายการสนคา

1.3.1.4 สามารถจดการขอมลผผลตสนคา

1.3.1.5 สามารถจดการขอมลพนกงานได

1.3.1.6 สามารถดรายการขายยอนหลงได

2

1.3.2 พนกงาน

1.3.2.1 สามารถจดการขอมลการขายสนคาได

1.3.2.2 สามารถดรายการขายยอนหลงได

1.4 ประโยชนทคาดวาจะไดรบ

1.4.1 ชวยลดระยะเวลาในการทางาน

1.4.2 ระบบมความถกตองแมนยาในการทางาน

1.4.3 ชวยคนหาสนคาไดงายขน

1.4.4 ชวยแกไขปญหาการจดการคลงสนคาใหดขน

1.4.5 ชวยปองกนปญหาขอมลสญหาย

1.5 ขนตอนและวธการดาเนนภาคนพนธ

1.5.1 ศกษาระบบงานเดมศกษาวธการซอ-ขายของรานคาปลกจากการสอบถาม

เพอทราบถงการทางานในปจจบนและปญหาทเกดขน สอบถามลกคาของ

ราน เพอใหทราบถงความสะดวกทไดรบหรอปญหาทเกดขนจากการซอสนคากบ

ทางรานใน เอกสารตาง ๆทเกยวของกบการซอ- ขาย ของราน คม & จว มนมารท

เชน ใบรบสนคาซอสนคา เปนตน

1.5.2 วเคราะหระบบ (System Analysis)

วเคราะหขนตอนการทางาน ระบบทางานอยางไรบาง ใชอะไรมาพฒนา

ออกแบบดไซน เขยนโคด รวมถงการกาหนดระยะเวลาในการพฒนาใหสอดคลอง

ตอการรวบรวมศกษาขอมลและพฒนาเวบแอปพลเคชน

1.5.3 พฒนาระบบเขยนโปรแกรมตามทไดออกแบบไว

โดยพฒนาขนดวยโปรแกรม Angularในการสรางสวนตดตอกบผใช และ

ใชภาษาPythonในการเขยนชดคาสงในการตดตอกบฐานขอมลโดยใช MySQL

เปนฐานขอมล

3

1.5.4 ทดสอบและแกไขระบบ

ทดสอบโดยเสมอนใชงานจรงเพอหาจดบกพรองและแกไขโปรแกรมให

ไมมขอผดพลาดกอนนาไปใชงานจรง

1.5.5 จดทาเอกสารประกอบ

จดทาเอกสารโครงงานอธบายการทางานของโปรแกรมโครงสรางของ

ระบบงาน

1.6 ระยะเวลาดาเนนปรญญานพนธ

ตารางท 1.1 แสดงแผนและระยะเวลาดาเนนปรญญานพนธ

หวขอ

ระยะเวลา

ต.ค.

61

พ.ย.

61

ธ.ค.

61

ม.ค.

62

ก.พ.

62

ม.ค.

62

เม.ย

62

พ.ค

62

ม.ย

62

1.ศกษาระบบงานเดม และ

รวบรวมความตองการ

2.ออกแบบหนาเวบไซต

3.ออกแบบฐานขอมล

4.พฒนาระบบ

5.ทดสอบ และแกไข

6.ประเมนผลและจดทาเอกสาร

คมอตาง ๆ

4

1.7 อปกรณและเครองมอทใช

1.7.1 ฮารดแวร

1.7.1.1 เครองคอมพวเตอร Asus G550 JK

1.7.2 ซอฟตแวร

1.7.2.1 ระบบปฏบตการ Window 10

1.7.2.2 Xampp Control Panel

1.7.2.3 Adobe Illustrator CS6

1.7.2.4 Bootstrap 4

1.7.2.5 Angular 7

1.7.2.6 Python 3.7.1

1.7.2.7 Visual Studio Code 2017

1.7.2.8 Postman

1.8 อปกรณและเครองมอทรองรบ

1.8.1 ฮารดแวร

1.8.1.1 คอมพวเตอร ระบบปฏบตการวนโดวส 7 ขนไป

1.8.2 ซอฟตแวร

1.8.2.1 Window 10

1.8.2.2 phpMyAdmin v5.6.30

1.8.2.3 NodeJS

1.8.2.4 Browser

บทท 2

แนวทฤษฎทเกยวของ

ในการจดทาปรญญานพนธน คณะผจดทาไดทาการศกษาแนวคดทฤษฎและเทคโนโลย

ตางๆ เพอนามาประยกตใชดงน

2.1 Bootstrap Framework 1

รปท 2.1 Bootstrap Framework

Bootstrap ถ ก พฒนา ข นโดย Mark Otto แล ะ Jacob Thornton ท ม พฒนา ข อง

Twitter Inc. กอนหนานใชชอวา Twitter Blueprint และเปดใหนกพฒนาสามารถนาไปใชงาน

พฒนาเวบไซตไดแบบไมมค าใช จาย (Open Source) ในชอวา Bootstrap Framework ท

ประกอบดวยโครงสราง CSS , HTML และ JavaScript ทชวยใหเราสามารถสรางหนาจอ (User

Interface) ไดงาย สวยงาม และรวดเรว ลดเวลาในการออกแบบหนาจอ หรอรายการ Element

อนๆ และทสาคญคอ Bootstrap มการแสดงผลในรปแบบของ Responsive ซงจะแสดงภาพ

หนาจอทเหมาะสมกบอปกรณททาการเปดอยในขณะนน เชน PC Desktop , Tablets , Mobile

หรออปกรณอนๆ

นอกจาก Bootstrap จะมโครงสรางพนฐานในการออกแบบททาใหใชงานไดอยาง

สะดวกแลว ยงสามารถเพมชดคาสง CSS หรอ Style sheet เพอใหเขากบสวนตดตอกบผใช ตาม

ความตองการของผพฒนาได

1 https://getbootstrap.com/

6

2.2 Web Application2

รปท 2.2 โครงสราง Web Application

เวบแอปพลเคชน (Web Application) คอ แอปพลเคชน ทถกเขยนขนมาเพอเปน เบ

ราเซอร (Browser) สาหรบการใชงาน เวบเพจ (Webpage) ตางๆ สามารถใชงานผานอนเทอรเนต

(Internet) และ อนทราเนต (Intranet) ได และขอดของ เวบแอปพลเคชน คอ ในสวนของการใชงาน

ทสามารถใชงานไดงาย สะดวก ทกท ทกเวลา ถาหากไมมเครองคอมพวเตอร แตตองการใช เวบเบ-

ราเซอร (Web browser) กสามารถใชแอปพลเคชนนไดรวมถงมการอพเดทแกไขขอผดพลาดตางๆ

อยตลอดเวลา และใชงานไดทกแพลตฟอรม

2 https://codeburst.io/เรมพฒนา-web-application-กบภาษา-python-ดวย-django-framework-

38ce132ac706

7

2.3 Database3

ฐานขอมล (Database) คอ กลมของขอมลทมความสมพนธกน นามาเกบรวบรวม

เขาไวดวยกนอยางมระบบและขอมลทประกอบกนเปนฐานขอมลนน ตองตรงตามวตถประสงคการ

ใชงานขององคกรดวยเชนกน เชน ในสานกงานกรวบรวมขอมล ตงแตหมายเลขโทรศพทของผทมา

ตดตอจนถงการเกบเอกสารทกอยางของสานกงาน

รปท 2.3 Database

2.3.1 ระบบฐานขอมล (Database System)

หมายถง โครงสรางสารสนเทศทประกอบดวยรายละเอยดของขอมลทเกยวของกน

ทจะนามาใชในระบบตางๆรวมกน ระบบฐานขอมลจงนบวาเปนการจดเกบขอมลอยางเปน

ระบบ ซงผใชสามารถจดการกบขอมลไดในลกษณะตาง ๆ ทงการเพม การแกไข การลบ

ตลอดจนการเรยกดขอมล ซงสวนใหญจะเปนการประยกตนาเอาระบบคอมพวเตอรเขามา

ชวยในการจดการฐานขอมล

2.3.1.1 รปแบบของระบบฐานขอมล

2.3.1.1.1 ฐานขอมลเชงสมพนธ (Relational Database) เปนการเกบขอมลใน

รปแบบทเปนตาราง (Table) มความความสมพนธกน (Relation) มลกษณะเปน 2

มต คอเปนแถว (row) และเปนคอลมน (column) การเชอมโยงขอมลระหวาง

ตาราง จะเชอมโยงโดยใชแอททรบวต (attribute) หรอคอลมนทเหมอนกนทงสอง

ตารางเปนตวเชอมโยงขอมล ฐานขอมลเชงสมพนธน จะเปนรปแบบของ

ฐานขอมลทนยมใชในปจจบน

3 https://en.wikipedia.org/wiki/Database

8

2.3.1.1.2 ฐานขอมลแบบเครอขาย (Network Database) เปนการรวมระเบยนตางๆ

และความสมพนธระหวางระเบยนแตจะตางกบฐานขอมลเชงสมพนธ คอ ใน

ฐานขอมลเชงสมพนธจะแฝงความสมพนธเอาไว โดยระเบยนทมความสมพนธกน

จะตองมคาของขอมลในแอททรบวตใดแอททรบวตหนงเหมอนกน แตฐานขอมล

แบบเครอขาย จะแสดงความสมพนธอยางชดเจน

2.3.1.1.3 ฐานขอมลแบบลาดบช น (Hierarchical Database) เปนโครงสรางท

จดเกบขอมลในลกษณะความสมพนธแบบพอ-ลก (Parent-Child Relationship

Type : PCR Type) หรอเปนโครงสรางรปแบบตนไม (Tree) ขอมลทจดเกบในทน

คอ ระเบยน (Record) ซงประกอบดวยคาของเขตขอมล (Field) ของเอนทตหนง ๆ

2.3.2 ระบบจดการฐานขอมล (Database Management System) : DBMS

หมายถง กลมโปรแกรมหรอซอฟตแวรชนดหนง ทสรางขนมาเพอทาหนาท

บรหารฐานขอมลโดยตรง ใหมประสทธภาพมากทสดเปนเครองมอทชวยอานวยความ

สะดวกใหผใชสามารถเขาถงขอมลได โดยทผใชไมจาเปนตองรบรเกยวกบรายละเอยด

ภายในโครงสรางฐานขอมล กคอ DBMS นเปนตวกลางในการเชอมโยงระหวางผใช และ

โปรแกรมตางๆ ทเกยวของกบระบบฐานขอมล ตวอยางของ DBMS ทนยมใชในปจจบน

ไดแก Microsoft Access, FoxPro, SQL Server, Oracle, Informix, DB2 เปนตน

รปท 2.4 ระบบจดการฐานขอมล

9

2.3.3 ประโยชนของฐานขอมล

ประโยชนของการนาขอมลทมความสมพนธกนมาใชงานรวมกนเปนฐานขอมลม

ดงตอไปน

1. ลดความซ าซอนของขอมล (Data Redundancy)

2. หลกเลยงความขดแยงของขอมล (Data Inconsistency)

3. แตละหนวยในองคกรสามารถใชขอมลรวมกนได (Data Sharing)

4. กาหนดรปแบบขอมลใหเปนมาตรฐานเดยวกน ทาใหผใชขอมลสามารถ

เขาใจและสอสารถงความหมายเดยวกน

5. กาหนดระดบความสามารถในการเรยกใชขอมลของผใชแตละคนให

แตกตางกนตามความรบผดชอบ

6. รกษาความถกตองของขอมลได

7. ตอบสนองความตองการใชขอมลในหลายรปแบบ

8. สามารถแกไขโครงสรางขอมลไดอยางอสระ

10

2.4 Angular Framework4

รปท 2.5 Angular

Font-end Framework ทไดรบความนยมในปจจบนทถกพฒนาโดย Google และม Library

ใหผใชไดใชงานไดตรงตามความตองการของผพฒนา ทเลอกใชเนองจากรปบบของการเขยน

โปรแกรมมความเปนระเบยบคลายกบการเขยนโปรแกรมในแบบModel View Controller (MVC)

มาวางแบบแผนมาดจะเหมาะกบการทางานเปนทมมากและงายตอการจดการไฟล CSS

4 https://angular.io/

11

2.5 RESTfulAPI 5

รปท 2.6 RESTfulAPI

Representational state transfer หรอ REST คอ การสราง Webservice ชนดหนงทใชสอสาร

กนบน Internet ใชหลกการแบบ stateless คอไมม session การทางานของ RESTful Webservice จะ

อาศย URI/URL ของ request เพอคนหาและประมวลผลแลวตอบกลบไปในรป XML, HTML,

JSON โดย response ทตอบกลบจะเปนการยนยนผลของคาสงทสงมา โดยมคาสงดงน

-GET คนหาขอมลจาก URI ทกาหนด

-POST ใชเพมขอมล

-PUT ใชแกไขขอมล

-DELETE สาหรบลบขอมล

5 https://www.python.org/

12

2.6 Visual Studio Code6

รปท 2.7 Visual Studio Code

Visual Studio Code หรอVSCode เ ปนโปรแกรม Code Editor ท ใชในการแกไขและ

ปรบแตงโคดทสามารถใชงานไดฟร VSCode นนสามารถทางานขามแพลตฟอรมไดไมวาจะเปน

Windows, macOS และ Linux และรองรบไดหลายภาษาเชน Java, Php, Python, C#,JavaScript,

TypeScript และ Node.js และมหนา terminal ใหใชงานภายในโปรแกรม


13

2.7 Postman 7

รปท 2.8 Postman

Postman เปนโปรแกรมไวสาหรบทดสอบ API การ Test API แบบ Automated ใชงานงายเพราะม

หนา UI ทสวยงานใชงานงายสามารถจดการสครปทเราเขยนไวเปนสวน ๆ ทาใหสะดวกในการใช

งานสามารถจดการ Environment ทาใหเราไมตองมานงเปลยน URL บอยๆ สามารถเขยนสครปใน

การทดสอบAPI ทเราเขยนได


บทท 3

การวเคราะหและออกแบบระบบ

3.1 รายละเอยดของปรญญานพนธ

สรางเวบแอปพลเคชนจดการสนคาและการขายของรานคาคมแอนดจวมนมารทผจดทาได

จดทาระบบในรปแบบเวบแอปพลเคชน เพอความสะดวก ในการใชงานของพนกงาน ระบบ

สามารถสรางการบนทกการขาย สตอกสนคาในรานทงหมดและสามารถแจงเตอนสนคาทเหลอ

นอยหรอคางสตอกนานแลวใหผประกอบการทราบ ซงจะทาใหลดคาใชจายในการทจะตองลง

ขอมลในกระดาษ ลดความผดพลาดในการคานวณราคาสนคาและเพมประสทธภาพในการทางาน

ไดมากขนและรวดเรว

ในการสรางเวบแอปพลเคชนMy POS ของรานคาคมแอนดจวมนมารทไดใชโปรแกรม

Visual Studio Code ในการเขยนโปรแกรม

3.2 การทางานของระบบ

3.2.1 การวเคราะหระบบ

ระบบ My POS ของรานคาคมแอนดจวมนมารท

ผดแลระบบ

การจดการขอมลสนคา

การจดการขอมลพนกงาน

การจดการขอมลผผลต

เขาสระบบ

ใบเสนอราคา

กราฟรายงานยอดการขาย

รปท 3.1 แผนภาพ Use Case Diagram ของเวบแอปพลเคชน

15

ตารางท 3.1 รายละเอยดของ Use Case : การจดการขอมลสนคา

Use Case Name การจดการขอมลสนคา

Use Case ID UC 1

Brief Description ผดแลระบบสามารถเพม แกไข ลบและคนหาขอมลสนคาได

Primary Action ผดแลระบบ

SecondaryAction -

Preconditions -

Main Flows

1. ยสเคสจะเรมเมอผใชหรอผดแลระบบกดปม Product

2. ระบบจะแสดงหนาจอรายการขอมลสนคา

3. ผดแลกดปมเพมสนคา

3.1 ระบบจะแสดงหนาจอเพมขอมลสนคา

3.1.1 ถาผดแลระบบใสขอมลครบถวนแลวกดปม submit

3.1.1.1 ระบบจะแจงวาบนทกขอมลเสรจเรยบรอย

3.1.2 ถาไมใช

3.1.2.1 ระบบจะแจงวากรณาใสขอมลใหครบถวน

4. ผดแลกดปมคนหาสนคา

4.1 ระบบจะแสดงแทบสฟาใหใสขอมลทตองการคนหา

4.2 ระบบจะแสดงรายการขอมลทคนหามาให

5. ผดแลกดปมแกไขสนคา

5.1 ระบบจะแสดงหนาจอแกไขขอมลสนคา

5.1.1 ถาผดแลระบบใสขอมลทตองการแกไขเสรจสนกดปม submit



5.1.2.1 ระบบจะไมบนทกขอมลใหมใด ๆทงนน

6.ผดแลกดปมลบขอมลสนคา

6.1 ระบบจะแสดงขอความถามขอมลผดแลระบบวา Are you sure to delete this

record?

6.1.1 ถาผดแลระบบกด Yes

6.1.1.1 ระบบจะลบขอมลสนคาให

16

Main Flows


6.1.2.1 ระบบจะไมลบขอมลสนคา

Post Conditions -

Alternative Flows -

17

ตารางท 3.2 รายละเอยดของ Use Case : การจดการขอมลพนกงาน

Use Case Name การจดการขอมลพนกงาน

Use Case ID UC 2

Brief Description ผดแลระบบสามารถเพม แกไข ลบและคนหาขอมลพนกงาน


Secondary Action -

Preconditions -

Main Flows

1. ยเคสจะเรมเมอผใชหรอผดแลระบบกดปม Employee

2. ระบบจะแสดงหนาจอรายการขอมลพนกงาน

3. ผดแลกปมเพมขอมลพนกงาน

3.1 ระบบจะแสดงหนาจอเพมขอมลพนกงาน





4. ผดแลกดปมคนหาขอมลพนกงาน



5. ผดแลกดปมแกไขขอมลพนกงาน

5.1 ระบบจะแสดงหนาจอแกไขขอมลพนกงาน





6.ผดแลกดปมลบขอมลพนกงาน


record?


6.1.1.1 ระบบจะลบขอมลสนคาให


18

Main Flows

6.1.2.1 ระบบจะไมลบขอมลสนคา

7.ผดแลกดปมเปลยนรหสผาน

7.1 ระบบจะแสดงหนาจอเปลยนรหสผาน

7.1.1 ถาผดแลระบบใสรหสผานทตองการเปลยนเสรจสนกดปม submit




Post Conditions -

Alternative Flows -

19

ตารางท 3.3 รายละเอยดของ Use Case : การจดการขอมลผผลต

Use Case Name การจดการขอมลผผลต

Use Case ID UC 3

Brief Description ผดแลระบบสามารถเพม แกไข ลบและคนหาขอมลผผลต


Secondary Action -

Preconditions -

Main Flows 1. ยสเคสจะเรมเมอผใชหรอผดแลระบบกดปม supplier

2. ระบบจะแสดงหนาจอรายการขอมลผผลต

3. ผดแลกปมเพมขอมลผผลต

3.1 ระบบจะแสดงหนาจอเพมขอมลผผลต





4. ผดแลกดปมคนหาขอมลผผลต



5. ผดแลกดปมแกไขขอมลผผลต

5.1 ระบบจะแสดงหนาจอแกไขขอมลผผลต





6.ผดแลกดปมลบขอมลผผลต


record?


6.1.1.1 ระบบจะลบขอมลผผลตให


6.1.2.1 ระบบจะไมลบขอมลผผลต

20

Post Conditions -

Alternative Flows -

21

ตารางท 3.4 รายละเอยดของ Use Case : เขาสระบบ

Use Case Name เขาสระบบ

User Case ID UC 4

Brief Description สาหรบยนยนตวตนและตรวจสอบสทธการเขาใชงาน


Secondary Action -

Preconditions -

1. ยสเคสจะเรมเมอผดแลระบบเขาสหนาเขาสระบบ

2. ระบบจะแสดงหนาจอเขาสระบบ

3. ผดแลระบบใส Username และ Password

4. ผดแลระบบกดปมเขาสระบบ

4.1 ถา Username และ Password ถกตอง

4.1.1 ระบบจะแสดงหนาจอการขายสนคาให

4.2 ถาไมใช

4.2.1 ระบบจะแจงวา username และ password ผด

Post Conditions -

Alternative Flows ออกจากระบบ

22

ตารางท 3.5 รายละเอยดของ Use Case : กราฟรายงานยอดการขาย

Use Case Name กราฟรายงานยอดการขาย

User Case ID UC 5

Brief Description สาหรบดรายงานการขายตอเดอน


Secondary Action -

Preconditions -

1. ยสเคสจะเรมเมอผดแลระบบกดปม char

2. ระบบจะแสดงหนาจอกราฟรายงานยอดการขายในแตละเดอน

3. ผดแลระบบกดเลอกคนหาขอมลชวงวนเรมตนและสนสด

4. ระบบจะแสดงหนาจอกราฟรายงานยอดการขายของชวงวนทกาหนดให

Post Conditions -

Alternative Flows -

23

ตารางท 3.6 รายละเอยดของ Use Case : ใบเสนอสนคา

Use Case Name ใบเสนอสนคา

User Case ID UC 6

Brief Description สาหรบใชสงซอสนคาจากผผลต


Secondary Action -

Preconditions -

1. ยสเคสจะเรมเมอผดแลระบบกดปม purches order

2. ระบบจะแสดงหนาจอใบเสนอราคา

3. ถาผดแลระบบคลกพมพชอสนคาทตองการสงแลวคลกปม add to cart

3.1 ระบบจะแสดงรายการสนคาตวนนใหในตารางการสงซอ

3.2 ถาผดแลระบบกดเพมจานวนสนคาทอยในตาราง

3.2.1 ระบบจะแสดงจานวนทตองการใหในตาราง


3.3.1 ระบบจะแสดงจานวนแค 1 ชนเทานน

4. ถาผดแลระบบกดปมยนยน

4.1 ระบบจะแสดงหนาจอสรปคาสงซอ

4.2 ถาผดแลระบบกดปมยนยนสรปคาสงซอ

4.2.1 ระบบจะบนทกคาสงซอให


4.3.1 ระบบจะไมบนทกคาสงซอให

Post Conditions -

Alternative Flows -

24

3.3 Sequence Diagram

รปท 3.2 Sequence Diagram:Login Admin

25

รปท 3.3 Sequence Diagram:Product management

26

รปท 3.4 Sequence Diagram:Employee management

27

รปท 3.5 Sequence Diagram:Supplier management

28

รปท 3.6 Sequence Diagram:Sale graph

รปท 3.7 Sequence Diagram:Guotation

29

3.4 Class Diagram

รปท 3.8 Class Diagram

30

3.5 Entity Relations Diagram

รปท 3.9 Entity Relationship Diagram

31

บทท 4

การออกแบบทางกายภาพ

4.1 พจนานกรมขอมล (Data Dictionary)

การออกแบบฐานขอมลเชงสมพนธ ( Relational Database System ) ใหอยในรปแบบของ

ตารางฐานขอมล โดยใชโปรแกรม Mysql ในการจดการฐานขอมลทออกแบบขนมา

ตารางท 4.1 ตารางขอมล employee

Relation : tb_employee

Attribute Description Attribute

Domain

Type PK FK Reference

Emp_Id รหสพนกงาน varchar(5) Yes

Emp_Name ชอพนกงาน varchar(50)

Username ไอดพนกงาน varchar(255)

password พาสเวรด varchar(255)

Emp_Status สถานะพนกงาน char(1)

created วนทสมคร text

32

ตารางท 4.2 ตารางขอมล brand

Relation : tb_brand


Domain


Brand_Id รหสยหอ varchar(5) Yes

Brand_Name ชอยหอ varchar(50)

ตารางท 4.3 ตารางขอมล sale_bill

Relation : tb_sale_bill


Domain


Bill_Id รหสใบเสรจ varchar(12) Yes

Emp_Id รหสพนกงาน varchar(5)

Bill_Date วนทออกใบเสรจ datetime

Total_Price ราคารวมทงหมด decimal(8,2)

Discount สวนลด decimal(8,2)

Net_Price ราคารวม decimal(8,2)

ตารางท 4.4 ตารางขอมล bill_detail

Relation : tb_bill_detail


Domain


Bill_Id รหสใบเสรจ varchar(12) Yes

Pro_Id รหสสนคา varchar(10)

Quantity จานวนสนคา int(4)

Price ราคา decimal(8,2)

Profit กาไร decimal(8,2)

33

ตารางท 4.5 ตารางขอมล category

Relation : tb_category


Domain


Cate_Id รหสประเภทสนคา varchar(5) Yes

Cate_Name ชอประเภทสนคา varchar(50)

ตารางท 4.6 ตารางขอมล product

Relation : tb_product


Domain


Pro_Id รหสสนคา varchar(10) Yes

Pro_Bar บารโคด varchar(13)

Pro_Name ชอสนคา varchar(50)

Cate_Id รหสประเภท varchar(5)

Brand_Id รหสยหอ varchar(5)

Unit_Id รหสหนวย varchar(5)

Cost ราคาตนทน decimal(8,2)

Price ราคาขาย decimal(8,2)


sale_date วนทขายลาสด date

34

ตารางท 4.7 ตารางขอมล purchaseorder

Relation : tb_ purchaseorder


Domain


PO_Id รหสใบเสนอราคา varchar(12) Yes


Sup_Id รหสผผลต varchar(5)

PO_Date รหสทออกใบเสนอราคา datetime

PO_Status สถานะใบเสนอราคา char(1)

ตารางท 4.8 ตารางขอมล purchaseorder_detail

Relation : tb_ purchaseorder_detail


Domain


PO_Id รหสใบเสนอราคา varchar(12) Yes



Unit_Price ราคา decimal(8,2)

PO_Status สถานะการรบสนคา char(1)

35

ตารางท 4.9 ตารางขอมล receive_product

Relation : tb_ receive _detail


Domain


Rec_Id รหสใบรบสนคา varchar(15) YES

Ref_Id รหสใบสงของ varchar(15)

Rec_Date วนทรบสนคา datetime

Pay_Date วนทจายเงน datetime

Total_Cost ราคารวม decimal(8,2)


ตารางท 4.10 ตารางขอมล receive_detail

Relation : tb_ receive _detail


Domain


Rec_Id รหสใบรบสนคา varchar(15)

PO_Id รหสใบเสนอราคา varchar(15)


Unit_Price ราคา decimal(8,2)

Quantity จานวนทรบ int(4)

36

ตารางท 4.11 ตารางขอมล supplier

Relation : tb_ supplier


Domain


Sup_Id รหสผผลต varchar(5) YES

Sup_Name ชอผผลต varchar(50)

Sup_Address ทอยผผลต varchar(150)

Sup_Phone เบอรตดตอผผลต varchar(10)

ตารางท 4.12 ตารางขอมล unit

Relation : tb_ unit


Domain


Unit_Id รหสหนวยสนคา varchar(2) YES

Unit_Name ชอหนวยสนคา varchar(20)

37

4.2 การออกแบบสวนตดตอกบผใช

รปท 4.1 หนาจอแสดงการลงชอเขาใชของระบบ

จากรปท 4.1 แสดงหนายนยนตวตนโดยหวหนารกษาความปลอดภยจะตองใส Username และ

Password โดยคลกปม Sign in เพอยนยนตวตน

รปท 4.2 หนาจอแสดงขอมลของประเภทสนคา

จากรปท 4.2 เปนการแสดงขอมลของประเภทสนคาทมในระบบประกอบไปดวยรหสประเภทและ

ชอประเภท

38

รปท 4.3 หนาจอเพมขอมลประเภทสนคา

จากรปท 4.3 เมอคลกปม ประเภทสนคา ผใชสามารถเพมขอมลประเภทสนคาโดยกรอกรายละเอยด

ชอของประเภทสนคา เมอกรอกครบเรยบรอยกดปม Submit จะทาการบนทกลงฐานขอมล

รปท 4.4 หนาจอแกไขขอมลประเภทสนคา

จากรปท 4.4 เมอคลกปมแกไขจะแสดงหนาตางแกไขประเภทสนคาและเมอผใชกรอกขอมลท

ตองการจะแกไขแลวกดปม Update ระบบจะทาการแกไขประเภทสนคา

39

รปท 4.5 หนาจอลบขอมลประเภทสนคา

จากรปท 4.5 เมอคลกปมลบประเภทสนคาจะมตวระบบจะสอบถามวา Are you sure to delete this

record? คณแนใจหรอไมทจะลบขอมลนถาคลกปม yes ระบบกจะทาการลบขอมลให แตถาคลกปม

no ระบบกจะกลบไปยงหนากอนหนาให

รปท 4.6 หนาจอแสดงขอมลของยหอสนคา

จากรปท 4.6 เปนการแสดงขอมลของยหอสนคาทมในระบบประกอบไปดวยรหสของยหอสนคา

และชอของยหอ

40

รปท 4.7 หนาจอเพมขอมลยหอสนคา

จากรปท 4.7 เมอคลกปม ยหอสนคา ผใชสามารถเพมขอมลยหอสนคาโดยกรอกรายละเอยดชอของ

ยหอสนคาเมอกรอกครบเรยบรอยกดปม Submit จะทาการบนทกลงฐานขอมล

รปท 4.8 หนาจอแกไขขอมลยหอสนคา

จากรปท 4.8 เมอคลกปมแกไขจะแสดงหนาตางแกไขยหอสนคาและเมอผใชกรอกขอมลทตองการ

จะแกไขแลวกดปม Update ระบบจะทาการแกไขยหอสนคา

41

รปท 4.9 หนาจอลบขอมลยหอสนคา

จากรปท 4.9 เมอคลกปมลบยหอจะมตวระบบจะสอบถามวา Are you sure to delete this record?

คณแนใจหรอไมทจะลบขอมลนถาคลกปม yes ระบบกจะทาการลบขอมลให แตถาคลกปม no

ระบบกจะกลบไปยงหนากอนหนาให

รปท 4.10 หนาจอแสดงขอมลของหนวยสนคา

จากรปท 4.10 เปนการแสดงขอมลของหนวยสนคาทมในระบบ

42

รปท 4.11 หนาจอเพมขอมลหนวยสนคา

จากรปท 4.11 เมอคลกปม ยหอสนคา ผใชสามารถเพมขอมลยหอสนคาโดยกรอกรายละเอยดชอ

ของหนวยสนคาเมอกรอกครบเรยบรอยกดปม Submit จะทาการบนทกลงฐานขอมล

รปท 4.12 หนาจอแกไขขอมลหนวยสนคา

จากรปท 4.12 เมอคลกปมแกไขจะแสดงหนาตางแกไขหนวยสนคาและเมอผใชกรอกขอมลท

ตองการจะแกไขแลวกดปม Update ระบบจะทาการแกไขหนวยสนคา

43

รปท 4.13 หนาจอลบขอมลหนวยสนคา

จากรปท 4.13 เมอคลกปม ลบขอมล ผใชสามารถลบขอมลหนวยสนคา

รปท 4.14 หนาจอแสดงขอมลของสนคา

จากรปท 4.14 เปนการแสดงขอมลของสนคาทมในระบบ

44

รปท 4.15 หนาจอเพมขอมลสนคา

จากรปท 4.15 เมอคลกปม สนคา ผใชสามารถเพมขอมลสนคาโดยกรอกรายละเอยดของสนคาเมอ

กรอกครบเรยบรอยกดปม Submit จะทาการบนทกลงฐานขอมล

รปท 4.16 หนาจอแกไขขอมลสนคา

จากรปท 4.16 เมอคลกปมแกไขจะแสดงหนาตางแกไขสนคาและเมอผใชกรอกขอมลทตองการจะ

แกไขแลวกดปม Update ระบบจะทาการแกไขสนคา

45

รปท 4.17 หนาจอแกไขขอมลสนคา

จากรปท 4.17 เมอคลกปมลบสนคาจะมตวระบบจะสอบถามวา Are you sure to delete this record?

คณแนใจหรอไมทจะลบขอมลนถาคลกปม yes ระบบกจะทาการลบขอมลให แตถาคลกปม no

ระบบกจะกลบไปยงหนากอนหนาให

รปท 4.18 หนาจอขอมลผผลต

จากรปท 4.18 เปนหนาแสดงรายชอรานคาททางรานไดตดตอซอขายกนและสามารถคนหาขอมล

รานคาไดจากชองคนหา

46

รปท 4.19 หนาจอเพมผผลต

จากรปท 4.19 เปนหนาเพมรายชอรานคาททาการซอขายกน โดยใหผใชครบขอมลใหครบถวน

ตามทกาหนดไวม ชอ ทอยและเบอรโทร ถาคลกปม submit ระบบจะจดเกบขอมลให

รปท 4.20 หนาจอแกไขผผลต

จากรปท 4.20 เปนหนาจอใหผใชสามารถแกไขขอมลรานคาทซอขายกนได เมอแกไขขอมลท

ตองการแกไขเสรจเรยบรอยแลวคลกปม update ระบบจะบนทกขอมลทแกไขให

47

รปท 4.21 หนาจอลบขอมลผผลต

จากรปท 4.21 เมอคลกปมลบขอมลผผลตจะมตวระบบจะสอบถามวา Are you sure to delete this

record? คณแนใจหรอไมทจะลบขอมลนถาคลกปม yes ระบบกจะทาการลบขอมลให แตถาคลกปม

no ระบบกจะกลบไปยงหนากอนหนาให

รปท 4.22 หนาจอขอมลพนกงาน

จากรปท 4.22 เปนหนาแสดงขอมลพนกงานและสามารถคนหาขอมลพนกงานไดจากชองคนหา

48

รปท 4.23 หนาจอเพมขอมลพนกงาน

จากรปท 4.23 เปนหนาเพมขอมลพนกงาน โดยใหผใชครบขอมลใหครบถวนตามทกาหนดไวม ชอ

พนกงาน username password เบอรโทรและสถานะพนกงาน ถาคลกปม submit ระบบจะจดเกบ

ขอมลให

รปท 4.24 หนาจอเปลยนรหสผาน

จากรปท 4.24 เปนหนาจอเปลยนรหสผาน ผใชสามารถเปลยนรหสผานไดเลย ถาคลกปม submit

ระบบจะจดเกบขอมลใหรหสผานใหมให

49

รปท 4.25 หนาจอแกไขขอมลพนกงาน

จากรปท 4.25 เปนหนาจอใหผใชสามารถแกไขขอมลพนกงาน เมอแกไขขอมลทตองการแกไข

เสรจเรยบรอยแลวคลกปม update ระบบจะบนทกขอมลทแกไขให

รปท 4.26 หนาจอลบขอมลพนกงาน

จากรปท 4.26 เมอคลกปมลบขอมลพนกงานจะมตวระบบจะสอบถามวา Are you sure to delete

this record? คณแนใจหรอไมทจะลบขอมลนถาคลกปม yes ระบบกจะทาการลบขอมลให แตถา

คลกปม no ระบบกจะกลบไปยงหนากอนหนาให

50

รปท 4.27 หนาจอออกใบสงซอ

จากรปท 4.27 เปนหนาไวออกใบสงซอสนคาจากผผลต

รปท 4.28 หนาจอแสดงขอมลคาสงซอสนคา

จากรปท 4.28 เปนหนาไวแสดงคาสงซอและคนหาคาสงซอ

51

รปท 4.29 หนาจอแสดงขอมลคาสงซอสนคา

จากรปท 4.29 เปนหนาไวบนทกการรบสนคาจากผผลตโดยใสจานวนทรบและราคาแลวกดปม

บนทกและรบ ระบบจะทาการบนทกลงฐานขอมล

รปท 4.30 หนาจอการขายสนคา

จากรปท 4.30 เปนหนาไวบนทกการขายสนคาโดยใสรหสหรอบารโคดในชองสนคา/รหสสนคา

แลวกดปมเพมลงตระกราสนคาจะมาขนในชองรายการขายแลวกดปมคดเงนจะทาใหนาไปสหนา

สรปคาสงซอ

52

รปท 4.31 หนาจอสรปคาสงซอ

จากรปท 4.31 เปนหนาไวบนทกการขายสนคาโดยจะแสดงรายละเอยดตางๆในการขายและเมอกด

ปม Saveจะเปนการบนทกขอมลการขายลงฐานขอมลหรอถากดปม ใบเสรจแบบยอจะเปนการออก

ใบเสรจและบนทกขอมลการขายลงฐานขอมล

รปท 4.32 หนาจอสรปยอดการขายในแตละวน

จากรปท 4.32 เปนหนาไวแสดงยอดการขายในแตละวนโดยสามารถเลอกวนทจะแสดงไดโดยใส

วนทเรมตนและวนทสนสดและกดปมคนหา

53

รปท 4.33 หนาจอแจงเตอน

จากรปท 4.33 เปนหนาไวแสดงสนคาทไมไดขายนานและสนคาทใกลจะหมด

บทท 5

สรปผลและขอเสนอแนะ

5.1 สรปผลภาคนพนธ

การสรางเวบแอพพลเคชนระบบจดการสนคาและการขายของรานคาคมแอนดจวมนมารท

สามารถบนทกรายการสงซอ คานวณเงนและออกบลใหลกคาได และสามารถตดสตอกไดโดยท

สตอกจะสามารถแจงเตอนสนคาทมจานวนเหลอนอยและแจงเตอนสนคาทขายไมออกเลยให

ผประกอบการนาไปจดโปรโมชน และดรายละเอยดการขายยอนหลงได

5.2 ขอดของระบบ

1.5.1 ชวยลดระยะเวลาในการทางาน

1.5.2 ระบบมความถกตองแมนยาในการทางาน

1.5.3 ชวยคนหาสนคาไดงายขน

1.5.4 ชวยแกไขปญหาการจดการคลงสนคาใหดขน

1.5.5 ชวยปองกนปญหาขอมลสญหาย

5.3 ขอจากดของระบบ

5.3.1 ระบบไมสามารถออกใบกากบภาษได

5.3.2 ระบบไมสามารถสงขอความแจงเตอนสนคาหมดไดแบบเรยลไทม

5.4 ขอเสนอแนะ

เพมประสทธภาพในการทางานและใหระบบมความสมบรณมากยงขนควรพฒนาระบบม

ดงตอไปน

5.4.1 สามารถสงขอความแจงเตอนสนคาหมดไดแบบเรยลไทม

5.4.2 สามารถออกใบกากบภาษได

บรรณานกรม

Programmerthailand. (2017). Angular คออะไร. เขาถงไดจากhttps://programmerthailand.com /tutorial/post/view/208/angular-คออะไร Saixaiii. (2019). Flask คออะไร. เขาถงไดจาก https://saixiii.com/python-flask-web-application/ Saixaiii. (2019). Python คอ. เขาถงไดจาก https://saixiii.com/python-programming/ Saixaiii. (2019). Web Service คอ. เขาถงไดจาก https://saixiii.com/what-is-webservice/

https://saixiii.com/python-programming/

Documents

Product and Sales Management System of Kim & Jew Minimart