สร้างระบบ สร้าง/ค้นหา/ดาวน์โหลด เกียรติบัตรออนไลน์ จบในระบบเดียว
ที่มีคุณสมบัติดังนี้ :
1. หน้าเว็บที่สวยงามด้วย Tailwind CSS ใช้ฟอนต์ 'Sarabun', sans-serif ใช้ sweet alert, loading overlay
2. ส่วนหัวเว็บไซต์ที่มีชื่อ "ระบบ สร้าง/ค้นหา/ดาวน์โหลด เกียรติบัตรออนไลน์" และคำอธิบายสั้นๆ
3. ส่วนทำแบบทดสอบเพื่อรับเกียรติบัตร
- มีแบบทดสอบเกี่ยวกับวิชาเทคโนโลยี 5 ข้อ พร้อมบอกคะแนนและเปอร์เซ็นต์ที่ทำได้
- ถ้าทำถูกมากกว่า 80 เปอร์เซ็นต์ ให้สามารถกรอกข้อมูล(“IDเกียรติบัตร (สร้างอัตโนมัติ เริ่มจาก 001)”,“ชื่อผู้รับ”, “ตำแหน่ง”) เมื่อกดบันทึกข้อมูลแล้วให้สร้างเกียรติบัตร และกลับมาที่หน้าแบบทดสอบ และหน้าค้นหา ตามเดิม
4. ช่องค้นหาที่ผู้ใช้สามารถค้นหาด้วยชื่อหรือรหัส
5. ปุ่มค้นหาและปุ่มล้างการค้นหา (หากไม่พิมพ์ข้อความ แล้วกดค้นหา ให้แสดงข้อมูลทั้งหมด)
6. แสดงผลการค้นหาเป็นการ์ดที่มีข้อมูลต่อไปนี้:
- IDเกียรติบัตร
- ตำแหน่ง
- ชื่อผู้รับ
- ปุ่ม "ดูเอกสารเพื่อดาวน์โหลด"
7. เมื่อคลิกที่ "ดูเอกสารเพื่อดาวน์โหลด" ให้แสดงรูปภาพเกียรติบัตรในหน้าต่าง modal โดยใช้ SweetAlert2
8. เมื่อคลิกที่ "ดูเอกสารเพื่อดาวน์โหลด" ให้เปิดเอกสารในหน้าต่างใหม่
9. ใช้ URL รูปแบบ https://drive.google.com/file/d/{ID}/view สำหรับการเปิดในแท็ปใหม่
10. แสดงข้อความ "ไม่พบข้อมูลที่ค้นหา" เมื่อไม่พบผลลัพธ์
11. มีการแสดงผลแบบ responsive สำหรับทุกขนาดหน้าจอ
12. มีการแสดงตัวโหลดขณะกำลังดึงข้อมูล
13. ใช้วิธีการจัดการการอัปโหลดไฟล์โดยแปลงไฟล์เป็น base64 ในเบราว์เซอร์ การส่งข้อมูลไฟล์เป็นสตริง base64 พร้อมกับชื่อไฟล์และประเภท MIME ใน Apps Script ให้ถอดรหัสข้อมูล base64 และสร้างไฟล์จากข้อมูลนั้น ใช้ URLSearchParams แทน FormData เพื่อให้เข้ากันได้กับ Apps Script มากขึ้น เชื่อม App Script ที่ URL : XXX
แล้วให้นำ Url ของไฟล์บันทึกลงในชีต(พร้อมสร้างHeaderด้วย) แสดงสถานะขณะรอการบันทึกและบันทึกสำเร็จ เมื่อสร้างระบบเสร็จแล้วให้แสดงโค้ด GS (Google App Script) ในหน้าแชตนี้ด้วย
14. ส่วนท้ายเว็บไซต์แสดงข้อความ "© 2025 Copyright | พัฒนาโดย ตั้งชื่อ "
ตั้งค่า :
- การสร้างเกียรติบัตร ให้ใช้ TEMPLATE_SLIDE_ID : XXX
- ฐานข้อมูลสำหรับบันทึกข้อมูล และดึงข้อมูลมาใส่ใน TEMPLATE_SLIDE ({ID},{name}
,{position}) ให้ใช้ชีตที่ SHEET_ID : XXX
- เมื่อสร้าง SLIDE เกียรติบัตรแล้ว ให้บันทึกไฟล์เป็น PDF ลงใน FOLDER_ID : XXX แล้วบันทึกลิงค์ลง SHEET ด้วย และสามารถค้นหาได้
- ให้มีการตรวจสอบ ID ก่อนบันทึก โดยให้ใช้ ID ถัดไปเรื่อยๆ เมื่อมีคนมาสร้างข้อมูลเพื่อรับเกียรติบัตร เช่น ถ้ามี ID 1 แล้ว ต่อไปให้เป็น ID 2