30
มหาวิ ทยาลั ยราชภั ฏธนบุ รี บทที่ 3 การวิเคราะห์และออกแบบระบบ การวิเคราะห์และการออกแบบการพัฒนาเว็บไซต์ขายกระเป๋าออนไลน์ ร้าน The bag fashion shop ให้มีประสิทธิภาพในการใช้งานให้ได้มากตามขั้นตอนในการดําเนินการ ดังต่อไปนี3.1 ประชากรและกลุ่มตัวอย่าง 3.2 เครื่องมือที่ใช้ในการพัฒนาระบบ 3.3 แผนการดําเนินงาน 3.4 การวิเคราะห์ระบบ 3.5 การออกแบบระบบ 3.6 การออกแบบฐานข้อมูล 3.7 การออกแบบหน้าจอการใช้งาน 3.1 ประชากรและกลุ่มตัวอย่าง ประชากรที่และกลุ่มตัวอย่าง คือ อาจารย์ผู้เชี่ยวชาญด้านระบบ จํานวน 4 คน ซึ่งได้มาโดยการ สุ่มตัวอย่างแบบเฉพาะเจาะจง เพื่อเป็นผู้ทดลองใช้ระบบที่สร้างขึ้นมาในงานวิจัยครั้งนี3.2 เครื่องมือที่ใช้ในการพัฒนาระบบ 3.2.1 อุปกรณ์ 1) เครื่องคอมพิวเตอร์ 2 ชุด 2) เครื่องปริ้นเตอร์ 1 ชุด 3.2.2 โปรแกรม (Program/Software) 1) โปรแกรมที่ใช้ในการจําลองระบบฐานข้อมูล 2) โปรแกรมที่ใช้พัฒนาเว็บไซต์ 3) โปรแกรมจัดการเอกสาร 4) โปรแกรมตกแต่งรูปภาพ 5) โปรแกรมวาดแผนผังงาน

การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

  • Upload
    others

  • View
    5

  • Download
    0

Embed Size (px)

Citation preview

Page 1: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

บทท 3

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

การวเคราะหและการออกแบบการพฒนาเวบไซตขายกระเปาออนไลน ราน The bag fashion shop ใหมประสทธภาพในการใชงานใหไดมากตามขนตอนในการดาเนนการ ดงตอไปน

3.1 ประชากรและกลมตวอยาง 3.2 เครองมอทใชในการพฒนาระบบ 3.3 แผนการดาเนนงาน 3.4 การวเคราะหระบบ 3.5 การออกแบบระบบ 3.6 การออกแบบฐานขอมล 3.7 การออกแบบหนาจอการใชงาน

3.1 ประชากรและกลมตวอยาง ประชากรทและกลมตวอยาง คอ อาจารยผเชยวชาญดานระบบ จานวน 4 คน ซงไดมาโดยการสมตวอยางแบบเฉพาะเจาะจง เพอเปนผทดลองใชระบบทสรางขนมาในงานวจยครงน

3.2 เครองมอทใชในการพฒนาระบบ 3.2.1 อปกรณ 1) เครองคอมพวเตอร 2 ชด 2) เครองปรนเตอร 1 ชด 3.2.2 โปรแกรม (Program/Software) 1) โปรแกรมทใชในการจาลองระบบฐานขอมล 2) โปรแกรมทใชพฒนาเวบไซต 3) โปรแกรมจดการเอกสาร 4) โปรแกรมตกแตงรปภาพ 5) โปรแกรมวาดแผนผงงาน

Page 2: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

35

3.2.3 เครองมอในการวจย/วธการวเคราะหขอมล 1) แบบประเมนประสทธภาพของระบบ 2) แบบประเมนคณภาพของผเชยวชาญจะกาหนดใหคะแนนตามระดบคณภาพของผตอบ คาถามทมตอการใชการพฒนาเวบไซตขายออนไลน โดยแตละคาถามจะกาหนดคะแนน เปน 5 ระดบ โดยมเกณฑการใหคะแนนทแสดงระดบคณภาพแบงออกเปน 5 ระดบ ดงน

คะแนน 5 หมายถง ดมาก คะแนน 4 หมายถง ด คะแนน 3 หมายถง ปานกลาง คะแนน 2 หมายถง นอย คะแนน 1 หมายถง นอยทสด

เกณฑการแปลความหมายของคะแนนเฉลย จากการประเมนคณภาพดานเนอหาและดานสอ มลตมเดย ตามวธของ Likert เปนมาตราสวน 5 ระดบ โดยการกาหนดความหมายคะแนนของ ตวเลอกในแบบประเมนแตละขอ มเกณฑ ดงน

คะแนนเฉลย 4.50 – 5.00 หมายถง ดมาก คะแนนเฉลย 3.50 – 4.49 หมายถง ด คะแนนเฉลย 2.50 – 3.49 หมายถง ปานกลาง คะแนนเฉลย 1.50 – 2.49 หมายถง นอย คะแนนเฉลย 1.00 – 1.49 หมายถง นอยทสด

สถตทใชในการวเคราะหความตองการของผใชไดแกคานวณหาคาเฉลย ( x ) และ คาเบยงเบนมาตรฐาน (S.D.)

3.3 แผนการด าเนนงาน 3.3.1 ระยะเวลาการดาเนนงาน ระยะเวลาทใชในการดาเนนงานการศกษาและพฒนาระบบ โดยใชเวลาดาเนนงานประมาณ 4 เดอน เรมตงแต เดอนธนวาคม 2559 ถงเดอน กมภาพนธ 2560

Page 3: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

36

ตารางท 3.1 แสดงระยะเวลาการดาเนนงาน

กจกรรม ระยะเวลา

ธ.ค. 60 ม.ค. 61 ก.พ. 61 ม.ค. 61 1. ศกษาเอกสาร และทฤษฎทเกยวของ 2. วเคราะหและออกแบบระบบใหม 3. สรางระบบใหมตามทออกแบบ 4. ทดสอบและแกไข 5. เกบขอมลการวจย 6. จดทารายงานและเตรยมเสนองาน

3.3.2 ขนตอนการดาเนนงาน การดาเนนงานในการศกษาโครงการ การพฒนาเวบไซตขายกระเปาออนไลน ม ขนตอนการดาเนนงานดงน 1) ศกษาเอกสาร และทฤษฎทเกยวของ 1.1) ศกษาระบบงานเดมทปฏบตงานในปจจบน 1.2) ทฤษฎและขอมลทเกยวของ 2) วเคราะหและออกแบบระบบใหม 2.1) รวบรวมขอมล 2.2) วเคราะหและศกษาปญหา 2.3) ออกแบบระบบงานใหม 3) สรางระบบใหมตามทออกแบบ 3.1) กาหนดขอบเขตของระบบ 4) ทดสอบและแกไข 4.1) ออกแบบรปรางหนาตาโปรแกรม 4.2) ทดสอบโปรแกรมเพอปรบปรงแกไขและใชงานได 5) เกบขอมลการวจย 5.1) การเกบขอมลจากแบบสอบถาม 6) จดทารายงานและเตรยมเสนองาน 6.1) ปรบปรงแกไขโปรแกรมใหสมบรณ 6.2) จดทาเอกสาร

Page 4: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

37

3.4 การวเคราะหระบบ (Analysis Phase) 3.4.1 การวเคราะหระบบงานเดม เนองจากรานขายกระเปาในปจจบนมขดในดานตาง ๆ เชน การขายกระเปาไดเฉพาะหนาราน และรานมการจดเกบขอมลสนคาโดยการจดลงสมดทมขอมลซบซอน ไมมการเกบขอมลลกคาทเปนสมาชก รานมบคคลทรจกนอยมาก เพราะขาดการประชาสมพนธ และลกคาตองมาเลอกชมสนคาดวยตนเอง จงทาใหลาบากในการเดนทางไกล และสถานทไมอานวยในการจอดรถ

ภาพท 3.1 แสดงแผนภมกางปลาทแสดงถงปญหาของระบบรานขายออนไลน

Page 5: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

38

3.5 การออกแบบระบบ 3.5.1 แผนภาพกระแสขอมลระดบสง (Context Diagram)

ภาพท 3.2 แสดงแผนภาพกระแสขอมล Data Flow Diagram Level 0

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

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

สนคาได เมอสงซอสนคาสมาชกกสามารถตรวจสอบการสงซอ ยนยนการชาระได ยงส ามารถด

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

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

0

The Bag Fashion Shop

Page 6: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

39

3.5.2 แผนภาพแสดงตาแหนงของโปรเซสในระบบ(Process Decomposition Diagram)

ภาพท 3.3 แผนภาพแสดงตาแหนงของโปรเซสในระบบรานขายกระเปาออนไลน

Page 7: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

40

3.5.3 แผนภาพขอมลระดบท 1 (Data Flow Diagram Leve 1)

/

/

/

3

2

/

1

/

4

D1

D2

D1

D2

D3

D4

ภาพท 3.4 แสดงแผนภาพกระแสขอมลระดบท 1 ระบบรานขายกระเปาออนไลน

Page 8: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

41

จากภาพท 3.4 แสดงใหเหนรายละเอยดของกระแสขอมลกระกอบดวย 4 โปรเซส คอ

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

ตองการทจะคนหาขอมลสนคา และประเภทสนคา โปรเซสท 2 สมาชกใชสาหรบบคคลทวไปไดสมคร

สมาชกเพอทจะไดสทธในการสงซอสนคา โปรเซสท 3 สงซอสนคาใชสาหรบสมาชกในการ เลอกซอ

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

สระบบกอน โปรเซส 4 จดการขอมลระบบใชสาหรบผดแลระบบจะตองเขาไปจดการขอมลสนคา

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

3.5.4 แผนภาพกระแสขอมลระดบท 2 โปรเซส 1 (Data Flow Diagram Level 2) 1) DFD Fragment 1: เรยกดสนคา

ภาพท 3.5 แสดงแผนภาพกระแสขอมลระดบท 2 โปรเซสท 1

จากภาพท 3.5 แสดงแผนภาพกระแสขอมลระดบท 2 โปรเซสแสดงขอมลสนคาทประกอบดวย 3 สวน คอ โปรเซสท 1 เปนโปรเซสยอยสาหรบแสดงขอมลสนคา โปรเซสท 2 เปนโปรเซสยอยสาหรบบคคลทวไป และสมาชกเลอกดสนคา โปรเซสท 3 เปนโปรเซสยอยสาหรบบคคลทวไป และสมาชกคนหาสนคา

Page 9: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

42

2) DFD Fragment 2: สมครสมาชก

ภาพท 3.6 แสดงภาพกระแสขอมลระดบท 2 โปรเซสท 2

จากภาพท 3.6 แสดงใหเหนรายละเอยดของกระแสขอมลระดบท 2 ของโปรเซสสมาชก ซงประกอบดวย 3 สวน คอ โปรเซสท 1 เปนโปรเซสทยอยสาหรบสมครสมาชก โปรเซสท 2 เปนโปรเซสยอยสาหรบเขาสระบบ โปรเซสท 3 เปนโปรเซสยอยสาหรบจดการขอมลสมาชก

Page 10: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

43

3) DFD Fragment 3: การสงซอสนคา

ภาพท 3.7 แสดงแผนภาพกระแสขอมลระดบท 2 โปรเซส 3

จากภาพท 3.7 แสดงใหเหนรายละเอยดกระแสขอมลระดบท 2 ของโปรเซสสงซอสนคาซงประกอบดวย 6 โปรเซส คอ โปรเซสท 1 เปนโปรเซสยอยสาหรบเขาสระบบ โปรเซสท 2 เปนโปรเซสยอยสาหรบเลอกซอสนคา โปรเซสท 3 เปนโปรเซสยอยสาหรบยนยนการสงซอสนคา โปรเซสท 4 เปนโปรเซสยอยสาหรบตรวจสอบการสงซอสนคา โปรเซสท 5 เปนโปรเซสยอยสาหรบยนยนการชาระ โปรเซสท 6 เปนโปรเซสยอยสาหรบตรวจสอบสภานะการสงสนคา

Page 11: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

44

4) DFD Fragment 4: การจดการขอมลระบบ

ภาพท 3.8 แสดงแผนภาพกระแสขอมลระดบท 2 โปรเซส 4 จากภาพท 3.8 แสดงใหเหนรายละเอยดของกระแสขอมลระดบท 2 ของโปรเซสจดการขอมลระบบซงประกอบดวย 5 โปรเซส คอ โปรเซสท 1 เปนโปรเซสยอยสาหรบเขาสระบบ โปรเซสท 2 เปนโปรเซสยอยสาหรบจดการขอมลการสงซอ โปรเซสท 3 เปนโปรเซสยอยสาหรบขอมลสนคา โปรเซสท 4 เปนโปรเซสยอยสาหรบจดการขอมลสมาชก โปรเซสท 5 เปนโปรเซสยอยสาหรบรายงาน

Page 12: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

45

3.5.5 คาอธบายการประมาลผล (Process Description) ตารางท 3.2 แสดงคาอธบายการประมวลผลของโปรเซสท 1 : เรยกดสนคา

Process Description System: การพฒนาเวบไซตขายกระเปาออนไลน DFD number: 1 Process name: - เขาสระบบ Input Data Flows: - ระบชอสนคา Output Data Flow: - สนคาทคนหา Data Stored Used: - ขอมลสนคา Description: เปนโปรเซสทเกยวกบการเรยกดสนคาประกอบดวยโปรเซสยอย ๆ ดงน

- คนหา/เรยกดขอมล - เลอกดสนคา - แสดงสนคา

ตารางท 3.3 แสดงคาอธบายการประมวลผลของโปรเซสท 2 : สมครสมาชก

Process Description System: การพฒนาเวบไซตขายกระเปาออนไลน DFD number: 2 Process name: - สมคร/เขาสระบบ Input Data Flows: - เพมขอมลสมาชก Output Data Flow: - ขอมลสมาชก Data Stored Used: - ขอมลสมาชก Description: เปนโปรเซสทเกยวกบการเรยกดสนคาประกอบดวยโปรเซสยอย ๆ ดงน

- สมครสมาชก - เขาสระบบ - จดการขอมลสมาชก

Page 13: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

46

ตารางท 3.4 แสดงคาอธบายการประมวลผลของโปรเซสท 3 : สงซอสนคา

Process Description System: การพฒนาเวบไซตขายกระเปาออนไลน DFD number: 3 Process name: - สงซอสนคา Input Data Flows: - ขอมลการสงสนคา

- ขอมลสถานะการชาระเงน Output Data Flow: - ขอมลการสงสนคา Data Stored Used: - ขอมลสนคา Description: เปนโปรเซสทเกยวกบการเรยกดสนคาประกอบดวยโปรเซสยอย ๆ ดงน

- เขาสระบบ - เลอกซอสนคา - ยนยนการสงซอสนคา - ตรวจสอบการสงซอสนคา - ยนยนการชาระเงน - ตรวจสอบสถานะการสงสนคา

Page 14: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

47

ตารางท 3.5 แสดงคาอธบายการประมวลผลของโปรเซสท 4 : การจดการขอมลระบบ

Process Description System: การพฒนาเวบไซตขายกระเปาออนไลน DFD number: 4 Process name: - จดการระบบ Input Data Flows: - ขอมลสนคาทขาย Output Data Flow: - รายละเอยดสนคา Data Stored Used: - ขอมลสนคา

ขอมลสมาชก - ขอมลการสงซอ - ขอมลรายละเอยดการสงซอสนคา

Description: เปนโปรเซสทเกยวกบการเรยกดสนคาประกอบดวยโปรเซสยอย ๆ ดงน - เขาสระบบ - จดการขอมลการสงซอ - จดการขอมลสนคา - รายงาน - จดการขอมลสมาชก

Page 15: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

48

3.6 การออกแบบฐานขอมล 3.6.1 แบบจาลองความสมพนธเอนทต (Entity Relationship Diagram)

ภาพท 3.9 แบบจาลองความสมพนธเอนทต (Entity Relationship Diagram)

Page 16: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

49

3.6.2 พจนานกรมขอมล (Data Dictionary) ตารางท 3.6 แฟมตารางทเกยวของในเวบไซต

ลาดบ ชอแฟมตารางภาษาไทย ชอแฟมตารางภาษาองกฤษ

1 อาเภอ amphur

2 ธนาคาร bank

3 ตดตอ Contact

4 ตงคาระบบ control

5 ลกคา customer

6 ตาบล district

7 สถานะการชาระเงน Payment_statatus

8 สนคา product

9 จงหวด province

10 สถานะ status

11 ออเดอร Ty_order

12 ออเดอรสนคา Ty_order_product

13 แจงชาระเงน Ty_payment

14 แอดมน users

15 รหสไปษณย zipcode

ตารางท 3.7 แสดงตารางอ าเภอ

Entity name: amphur

Description: ตารางอาเภอ

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 amphur_id int 5 รหสอาเภอ PK

2 amphur_name varchar 150 อาเภอ

3 province_id int 5 รหสจงหวด FK

Page 17: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

50

ตารางท 3.8 แสดงขอมลธนาคาร

Entity name: bank

Description: ตารางขอมลธนาคาร

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 id int 11 รหส PK

2 name varchar 100 ชอธนาคาร

3 img varchar 255 โลโก

4 no varchar 13 เลขทบญช

5 name_bun varchar 100 ชอบญช

6 branch varchar 100 สาขา

7 cat varchar 100 ประเภทบญช

ตารางท 3.9 แสดงขอมลระบบ

Entity name: control

Description: ตารางขอมลระบบ

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 id int 11 รหส PK

2 title varchar 100 แทกไตเตล FK

3 keyw varchar 200 คยเวรด

4 des text เดสคลปชน

5 logo varchar 255 โลโก

6 analytics text Google analytics

Page 18: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

51

ตารางท 3.10 แสดงขอมลลกคาทลงทะเบยน

Entity name: customer

Description: ตารางการลกคา

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 customer_id int 11 รหส PK

2 name varchar 50 ชอ

3 address_1 varchar 200 ทอย

4 province varchar 200 จงหวด

5 city varchar 200 อาเภอ

6 district varchar 200 ตาบล

7 postcode varchar 10 รหสไปษณย

8 email varchar 96 อเมล

9 telephone varchar 32 เบอรโทรศพท

10 password varchar 40 รหสผาน

11 line varchar 30 ไอดไลน

12 facebook varchar 50 เฟสบค

13 picture () varchar 500 รปภาพ

ตารางท 3.11 ตารางต าบล

Entity name: district

Description: ตารางตาบล

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 district_id int 5 รหส PK

2 district_name varchar 150 ตาบล

3 amphur_id int 5 รหสอาเภอ FK

4 province_id int 5 รหสจงหวด FK

Page 19: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

52

ตารางท 3.12 ตารางสถานการณชาระเงน

Entity name: payment_status

Description: ตารางสถานะการชาระเงน

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 payment_status_id int 11 รหส PK

2 name varchar 100 สถานะ

ตารางท 3.13 ตารางการสนคา

Entity name: product

Description: ตารางการสนคา

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 product_id int 11 รหส PK

2 product_content_th text รายละเอยด

3 price int 11 ราคา

4 price_preorder int 11 ราคา

5 product_picture varchar 255 รปภาพ

6 date date เวลา

7 promotion int 11 โปรโมชน

8 status_id int 11 สถานะ FK

ตารางท 3.14 ตารางจงหวด Entity name: province

Description: ตารางจงหวด

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 province_id int 5 รหส PK

2 province_name varchar 150 จงหวด

Page 20: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

53

ตารางท 3.15 ตารางการสถานะ

Entity name: status

Description: ตารางการสถานะ

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 status_id int 11 รหส PK

2 status_name varchar 255 สถานะ

ตารางท 3.16 ตารางออเดอร

Entity name: ty_order

Description: ตารางออเดอร

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 order_id int 11 รหส PK

2 invoice_no varchar 20 รหสสงซอ

3 customer_id int 11 รหสลกคา

4 shipping_name varchar 100 ชอ

5 shipping_address_1 varchar 200 ทอย

6 shipping_province varchar 200 จงหวด

7 shipping_city varchar 200 อาเภอ

8 shipping_district varchar 200 ตาบล

9 shipping_postcode varchar 10 รหสไปษณย

10 shipping_telephone varchar 15 เบอรโทรศพท

11 shipping_email varchar 150 อเมล

12 shipping_method varchar 128 การสง

13 total decimal 15,4 ราคารวม

14 payment_status_id int 5 สถานะการชาระเงน

15 date_added datetime เวลา

16 status_send varchar 20 สถานะการสง

17 tracking varchar 13 เลข ems

Page 21: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

54

ตารางท 3.17 ตารางการออเดอรสนคา

Entity name: ty_order_product

Description: ตารางการออเดอรสนคา

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 order_product_id int 11 รหส PK

2 order_id int 11 รหสออเดอร

3 product_id int 11 รหสสนคา

4 name varchar 255 ชอสนคา

5 quantity int 4 จานวน

6 price decimal 15,4 ราคา

7 total decimal 15,4 ราคารวม

8 date date เวลา

ตารางท 3.18 ตารางแจงชาระเงน

Entity name: ty_payment

Description: ตารางแจงชาระเงน

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 payment_idPrimary int 11 รหส PK

2 order_id int 11 รหสออเดอร

3 invoice_prefix varchar 20 เลขทสงซอ

4 name varchar 64 ชอ

5 email varchar 128 เมล

6 total_old int 11 จานวน

7 total decimal 15,2 รวม

8 arrearage int 11

9 bank varchar 64 ธนาคาร

10 paid_date varchar 255 วนท

11 paid_time varchar 255 เวลา

Page 22: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

55

12 enquiry text ตรวจสอบ

13 date_added datetime วนเวลาทารายการ

14 image varchar 255 สลป

15 payment_status_id varchar 11 สถานะ

ตารางท 3.21 ตารางการสงซอ

Entity name: users

Description: ตารางการสงซอ

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 id tinyint 4 รหส PK

2 username varchar 10 ชอผใช

3 password varchar 500 รหสผาน

4 level enum

ตารางท 3.22 ตารางรายละเอยดการสงซอ

Entity name: zipcode

Description: ตารางรายละเอยดการสงซอ

ลาดบ ชอฟลด ชนดขอมล ความยาว คาอธบาย หมายเหต

1 zipcode_idPrimary int 5 รหส PK

2 district_code varchar 100 รหสไปษณย FK

3 province_id varchar 100 รหสจงหวด

4 amphur_id varchar 100 รหสอาเภอ

6 zipcode varchar 5 รหสไปษณย

Page 23: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

56

3.7 การวางผงหนาเวบงาน 3.7.1 ผงหนาเวบสาหรบผเขาชมเวบไซต มรายละเอยดดงน

ภาพท 3.10 ผงหนาเวบสาหรบผเขาชมเวบไซต 3.7.2 ผงหนาเวบการสมครสมาชก มรายละเอยดดงน

ภาพท 3.11 ผงหนาเวบการสมครสมาชก

Page 24: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

57

3.7.3 ผงหนาเวบการเขาสระบบสาหรบผเขาชมเวบไซต มรายละเอยดดงน

ภาพท 3.12 ผงหนาเวบการเขาสระบบ

Page 25: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

58

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

ภาพท 3.13 ผงหนาเวบเพจแสดงการหยบสนคาใสตะกรา

Page 26: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

59

3.7.5 ผงหนาเวบเพจแสดงการสงซอสนคา มรายละเอยดดงน

ภาพท 3.14 ผงหนาเวบเพจแสดงการสงซอสนคา

Page 27: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

60

3.7.6 ผงหนาเวบเพจแสดงแจงชาระเงน มรายละเอยดดงน

ภาพท 3.15 ผงหนาเวบเพจแสดงแจงชาระเงน

3.7.7 ระบบหนาแรกสาหรบผดแลระบบ มรายละเอยดดงน

ภาพท 3.16 ระบบหนาแรกสาหรบผดแลระบบ

Page 28: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

61

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

ภาพท 3.17 แสดงหนาเวบเพจจดการแกไขขอมลสมาชกสาหรบผดแลระบบ

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

ภาพท 3.18 แสดงหนาเวบเพจจดการขอมลสนคาสาหรบผดแลระบบ

Page 29: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

62

3.7.10 ผงหนาเวบเพจจดการ order สาหรบผดแลระบบ

The bag fashion shop

dashboaed� MemberOrder

-

xxxxxx xxxxxxx xxxxxxx xxxxxx xxxxxxxxxxxx xxxxxxxxxxxx xxxxxxx xxxxxxxx xxxxxxxxx xx moer

ภาพท 3.19 แสดงหนาเวบเพจจดการ order สาหรบผดแลระบบ

3.7.11 ผงหนาเวบเพจแสดงการแจงชาระสาหรบผดแลระบบ

ภาพท 3.20 แสดงหนาเวบเพจแสดงการแจงชาระสาหรบผดแลระบบ

Page 30: การวิเคราะห์และออกแบบระบบcms.dru.ac.th/jspui/bitstream/123456789/1349/7/Unit 3.pdfการวิเคราะห์และออกแบบระบบ

มหาวท

ยาลยราชภฏธนบร

63

3.7.12 ผงหนาเวบเพจแสดงการแกไขสนคา สาหรบผดแลระบบ

ภาพท 3.21 หนาเวบเพจแสดงการแกไขสนคา สาหรบผดแลระบบ

3.7.13 ผงหนาเวบเพจแสดงการแกไขสมาชก สาหรบผดแลระบบ

The bag fashion shop

dashboaed� MemberOrder

- ........................................ .................................................... ........................................ ...............................................

ภาพท 3.22 หนาเวบเพจแสดงการแกไขสมาชก