คู่มือการใช้งานระบบ
ANT Data Center

1 บทนำและภาพรวมระบบ

**ANT Data Center** เป็นระบบบริหารจัดการแฟ้มข้อมูล สิทธิ์ผู้ใช้งาน และระบบฐานข้อมูลเชิงลึก ที่ถูกออกแบบมาเพื่ออำนวยความสะดวกให้แก่อาจารย์และบุคลากรของวิทยาลัยเทคนิคอำนาจเจริญ ระบบนี้ผสานรวมการทำงานระหว่าง **File Manager**, **Code Editor (IDE)**, และ **Database Administrator** เข้าไว้ด้วยกันในแพลตฟอร์มเดียวผ่านหน้าเว็บเบราว์เซอร์

• รองรับการแสดงผลทุกอุปกรณ์ (Responsive Design)
• ระบบลากวางไฟล์ (Drag & Drop) เพื่ออัปโหลดและย้ายข้อมูล
• หน้าต่างแก้ไขโค้ดอัจฉริยะ พร้อมเครื่องมือค้นหา แทนที่ และคัดลอก
• ความปลอดภัยระดับสูงด้วยระบบจัดการ Role (Admin, Manager, User)

2 การเข้าสู่ระบบ (Login)

หน้าจอเข้าสู่ระบบถูกออกแบบมาในสไตล์ **Cyber Glassmorphism** พร้อมภาพพื้นหลัง **Matrix Digital Rain** ที่มีปฏิสัมพันธ์กับเมาส์ของผู้ใช้งาน

3 หน้าจอหลัก (Dashboard)

เมื่อเข้าสู่ระบบสำเร็จ จะพบกับหน้าจอหลักซึ่งประกอบด้วย 2 ส่วนสำคัญ:

4 ระบบจัดการไฟล์เบื้องต้น

เมนู "จัดการไฟล์ (Files)" เปรียบเสมือน File Explorer ส่วนตัวของผู้ใช้ ประกอบด้วยเครื่องมือดังนี้:

• สร้างโฟลเดอร์: กดปุ่ม "โฟลเดอร์" มุมขวาบน เพื่อสร้างพื้นที่จัดเก็บใหม่
• สร้างไฟล์: กดปุ่ม "สร้างไฟล์" รองรับการสร้างไฟล์นามสกุลต่างๆ เช่น .php, .html, .css
• เปลี่ยนชื่อ (Rename): คลิกไอคอนดินสอหลังชื่อไฟล์/โฟลเดอร์
• ลบข้อมูล (Delete): คลิกไอคอนถังขยะ ระบบจะถามยืนยันก่อนลบถาวรทุกครั้ง

5 การอัปโหลดและย้ายไฟล์ (Drag & Drop)

6 เครื่องมือแก้ไขโค้ด (Code Editor)

เมื่อคลิกที่ไอคอน ท้ายไฟล์ประเภท Text หรือ Source Code ระบบจะเปิดหน้าต่าง Ace Editor ขึ้นมา ซึ่งรองรับการเขียนโปรแกรมเต็มรูปแบบ

7 ระบบคลิปบอร์ดอัจฉริยะ

ในหน้าต่าง Code Editor มีการฝังระบบคลิปบอร์ดสำรอง (Internal Clipboard Buffer) เพื่อแก้ไขปัญหาเบราว์เซอร์บล็อกสิทธิ์การกดคัดลอกผ่านระบบ HTTP

• ตัด ตัดโค้ดที่คลุมดำไปเก็บไว้ในหน่วยความจำ
• คัดลอก คัดลอกโค้ดที่เลือกเก็บไว้ใช้งาน
• วาง วางโค้ดที่คัดลอกไว้ (หากเบราว์เซอร์บล็อก ให้ใช้ปุ่มลัด Ctrl+V แทน)

8 การพรีวิวผลลัพธ์ (Web Preview)

ผู้ใช้สามารถตรวจสอบผลลัพธ์ของไฟล์โปรแกรมที่เขียนขึ้นได้ทันที โดยไม่ต้องสลับแท็บไปพิมพ์ URL เอง

9 ระบบจัดการผู้ใช้งาน (User Management)

เมนูสิทธิ์เฉพาะสำหรับบัญชีระดับ Admin และ Manager เพื่อดูแลระบบโครงสร้างบุคลากรและนักศึกษา

หมายเหตุ: ระบบมีกลไกป้องกันความผิดพลาด (Guard) หาก Manager กดแก้ไขผู้ใช้ จะมองเห็นและเลือกได้เฉพาะสิทธิ์ "USER" เท่านั้น เพื่อป้องกันการเลื่อนขั้นสิทธิ์เกินขอบเขต

10 ระบบเลือกโฟลเดอร์จำลอง (Mini Browser)

ฟีเจอร์ล้ำสมัยในหน้าต่าง "เพิ่มผู้ใช้งาน" ที่ช่วยลดข้อผิดพลาดในการพิมพ์ชื่อ Path ของโฟลเดอร์

• Auto-generation: ทันทีที่พิมพ์ Username ระบบจะสร้างชื่อโฟลเดอร์ต่อท้าย Path ของ Manager ให้อัตโนมัติ
• Browse เลือกไฟล์: กดเพื่อเปิดหน้าต่าง Mini Explorer ย่อย สามารถกดเข้าไปดูโครงสร้างโฟลเดอร์จริง และกด "เลือกหน้านี้" ได้ทันที
• สร้างโฟลเดอร์ใหม่ (Inline Creation): ภายใน Mini Browser มีช่องให้พิมพ์ชื่อและกดสร้างโฟลเดอร์ใหม่ได้โดยไม่ต้องปิดหน้าต่างหลักทิ้ง
• ดึงพาร์ธที่เปิดอยู่: หากผู้ใช้เข้าโฟลเดอร์ลึกๆ ในหน้า File แล้วสลับมาหน้า User สามารถกดปุ่มนี้เพื่อโยน Path ปัจจุบันลงกล่องได้เลย

11 ระบบสิทธิ์ฐานข้อมูล (DB Admin)

ส่วนควบคุมและบริหารจัดการ MySQL Database ภายในระบบเซิร์ฟเวอร์แบบ Real-time (สำหรับ Admin และ Manager)

12 การออกรายงานฐานข้อมูล (Export CSV)

ระบบสามารถสรุปข้อมูลโครงสร้างฐานข้อมูลทั้งหมดที่มีอยู่บนเซิร์ฟเวอร์ ออกมาในรูปแบบเอกสาร Spreadsheet

เพียงคลิกที่ปุ่ม Export CSV ระบบจะทำการรวบรวมข้อมูล Database, User, และ Size โหลดลงเครื่องในรูปแบบไฟล์ .csv เพื่อใช้ประกอบการทำรายงาน หรือประเมินทรัพยากรการจัดเก็บ (Storage Audit)

13 การแสดงผลบนมือถือ (Mobile Responsive)

หน้าต่างแอปพลิเคชันทั้งหมด (UI) รองรับการยืดหยุ่นปรับขนาดตามหน้าจอสมาร์ทโฟนและแท็บเล็ต 100%

• เมนูแบบสไลด์: แถบเมนูด้านซ้ายจะถูกซ่อนอัตโนมัติบนมือถือ เปิดได้ผ่านปุ่ม Hamburger ()
• ตารางอัจฉริยะ (DataTables Style): คอลัมน์ที่ยาวเกินไปจะถูกพับเก็บ กดที่ไอคอนสามเหลี่ยม () หน้าชื่อไฟล์ เพื่อกางรายละเอียดและปุ่มจัดการลงมาด้านล่าง
• กลไกปัดนิ้ว (Horizontal Scroll): กล่องข้อความและตารางต่างๆ อนุญาตให้ใช้นิ้วปัดเลื่อนซ้ายขวาได้ ป้องกันหน้าเว็บล้นขอบ

14 ความปลอดภัยและการออกจากระบบ

เพื่อความปลอดภัยของศูนย์ข้อมูลดิจิทัล ผู้ใช้ควรปฏิบัติตามหลักเกณฑ์ความปลอดภัยดังนี้:

15 ข้อมูลติดต่อและการสนับสนุน

หากพบปัญหาการใช้งาน ระบบขัดข้อง หรือต้องการเสนอแนะฟีเจอร์เพิ่มเติม สามารถติดต่อผู้ดูแลระบบเครือข่ายได้ที่: