บทความนี้เราจะมาฝึกสร้างแอพขายกาแฟด้วยตัวเอง โดยใช้ฐานข้อมูล Google Drive กับ Appsheet กัน
ขั้นตอนแรกสุดให้เราไปที่กูเกิลไดร์ฟ ส่วนตัวของเรา สร้างโฟลเดอร์ขึ้นมา Coffee Pos V7
คลิกเข้าไปข้างในโฟลเดอร์ แล้วคลิก Create เพื่อสร้างไฟล์ตารางฐานข้อมูล กำหนดชื่อไฟล์ Google Drive เป็น Coffee Pos V7
สร้างตารางแรกชื่อว่า products
จำนวน 2 คอลัมน์คือ
ID
Product name
สร้างตารางขึ้นมากำหนดชื่อเป็น items
จำนวน 7 คอลัมน์
ID
Category
Name
Sub category
Unit price
Photo
Qty
จากนั้นไปที่ appsheet.com
คลิก New App
เลือกสร้างแอพ จากฐานข้อมูล Google sheet
ตั้งชื่อแอพเป็น Coffee Pos V7
แท็บ data คลิกตาราง Products กำหนด ชนิดของข้อมูลที่เหมาะสม และสอดคล้องกับความต้องการใช้งาน
ID เป็น Text และ ค่าเริ่มต้นเป็น UNIQUEID() และเป็น Key หลักของตารางด้วย
Product name เป็น Text และกำหนดแสดงป้ายข้อมูล Label
ตาราง items
คอลัมน์ Category กำหนดเป็น Enum และเพิ่มตัวเลือกเป็น กาแฟ ชา นม โซดา
คอลัมน์ Sub category เป็น Enume ตัวเลือก ร้อน เย็น ปั่น
คอลัมน์ Name เป็น Ref และระบุตารางเป็น Products
คอลัมน์ Qty ในช่อง show ใส่สูตร
Context("Viewtype")<>"Form"
มาที่ UX มุมมอง Product เป็นแบบ Desk หรือ Table แต่ตำแหน่ง Position เป็น Menu
ให้บันทึกข้อมูล กาแฟที่มีขายในตลาดลงไป สัก 2 ถึง 3 รายการ
เช่น ลาเต้ คาปูชิโน่ เอสเพราโซ่
สำหรับวิว items
ให้เรา กำหนดเป็น Desk และตำแหน่งเป็น Ref
ปิด Action bar ด้วย
จากนั้นเพิ่มสินค้าเข้ามาในระบบ 2 -3 รายการ พร้อมรูปภาพ
จบ EP1 ---------
เริ่ม EP2 ------เราจะสร้างตารางเพิ่มอีก 2 ตาราง คือ Sales และ Invoice
ตารางแรก Sales มีคอลัมน์
ID
status
Date time
Item ID
Item Name
Unit price
Qty
Subtotal
Invoice no
สูตรที่ต้องใช้งาน
คอมลันน์ Unit price
lookup([_thisrow].[Item id],"Items","Item ID","Unit Price")
คอลัมน์ Subtotal
[unit price]*[QTY]
ค่าเริ่มต้น
คอลัมน์ invoice no ใส่
MAX(Invoice[Invoice])+1
คอลัมน์ Item name เป็น Ref แหล่งตารางเป็น Products
ตาราง Invoice
มีจำนวน 1 คอลัมน์ คือ Invoice
ใส่ค่าแรกลงไปด้วยกำหนดเป็น 20230000
การสร้างตัวกรองข้อมูล slice จากตาราง Sales
ตั้งชื่อตัวกรองเป็น Cart
กำหนดเงื่อนไขเป็น
isblank([status])
ติ้กไม่อนุญาติการเพิ่ม Add ข้อมูล
การสร้างวิวมุมมอง 2 วิวด้วยกันคือ
Cart เป็นชนิดตาราง แหล่งตารางคือ Cart ตำแหน่งเป็น Ref
จัดกลุ่มโดย Date time
Group aggerate เป็น SUM: Subtotal
เรียงคอลัมน์ Item name, Unit price, Qty, Subtotal
ต่อไปสร้างมุมมองขึ้นมาคือ POS โดยกำหนดเป็น Dashboard
เพิ่ม entries เข้ามาแสดงจำนวน 2 วิวด้วยกันคือ
Items และ
Cart
--------- EP3-------------
จะเป็นการใช้คำสั่ง Action เพื่อควบคุมการทำงานของแอพพลิเคชั่นให้ทำงาน ตามที่เราต้องการ
คลิกแท็บ Action ไปตาราง Items คลิก +
กำหนดชื่อเป็น Add to cart
Do this : add a new row to another table...
Table to add to: Sales
Set these columns:
Item id = [Item ID]
Qty = [Qty]
ติ้ก Do not display
-----------------------------
สร้าง action สองคือ Input Qty
Do this: Set the value of some column in this row
Set these columns: Qty = input(qty,"")
ติ้ก Do not display
---------------------
สร้าง action สามคือ Set qty to zero
Do this: Set the value of some column in this row
Set these columns: Qty = " "
ติ้ก Do not display
-----------------------------------------
จัดเรียงลำดับการทำงานของแอกชั่น โดยสร้าง Group action
กำหนดชื่อเป็น Item group action
Do this: Grouped execute a sequence of actions
เรียงแอคชั่น ตามลำ
Input Qty
add to cart
set qty to zero
ติ้ก Do not display
-----------------------------------
กลับไปที่แท็บ UX
มุมมอง POS คลิก behavior
ตรง Event Actions เลือก Item group action
คลิก Save
----------------- จบ EP3----------------------
_______ EP4___________
ขั้นแรกไปที่แท็บ UX แล้วคลิกวิวหรือมุมมอง Item
ไปที่ คำสั่ง behavior แล้วกำหนดค่าของ Event action เป็น item group action
คลิก Save
สร้างตารางเก็บข้อมูลชำระเงินค่าสินค้า คือ payment จำนวน 10 คอลัมน์ดังนี้
ID
Date
Time
Payment type
Amount paid
Invoice no
Total sale
Change
Cashier ID
Customer
นำเข้าตารางในแอพให้เรียบร้อยแล้วคลิก แท็บ data และตาราง payment เพื่อกำหนดค่าแต่ละคอลัมน์
ดังนี้
ค่า key หลักตารางคือคอลัมน์ Invoice no
คอลัมน์ payment type เป็น Enum ใส่ค่า เงินสด และ ลงบิล
isblank([_THIS]) ในเงื่อนไข show ของคอลัมน์ Date และ Time
คอลัมน์ Total sale ใส่สูตร Sum(Select(Sales[Subtotal],[Invoice no]=[_THISROW].[invoice no]))
คอลัมน์เงินทอน Change ใส่สูตร [amount paid]-[total sale]
และเงื่อนไข show ใส่ [amount paid]>=[total sale]
คอลัมน์ invoice no ใส่ค่าเริ่มต้น Max(Invoice[Invoice])+1
ดูเพิ่มคอลัมน์เสมือน ขึ้นมาเองจากระบบคือ related sale
สร้างเอง 1 คอลัมน์ ชื่อ File และใส่สูตร Concatenate([invoice no],".pdf")
จากนั้นไปที่แท็บ UX
สร้างมุมมองชนิด เมนูขึ้นมาชื่อ payment
จัดกลุ่ม by Date
Group aggerate : Sum total sale
เรียงคอลัมน์ Order
Date
Time
Invoice no
Payment type
Total sale
Amount paid
จบขั้นตอนของ EP4 ----------
-----------ตอนที่ EP5 --------------- สร้างไอค่อนจ่ายเงินค่าสินค้า
มาที่แท็บ Action
คลิก + ตาราง sale เพื่อสร้าง action ขึ้นมาสำหรับการคัดลอกหมายเลขบิลขายจากตาราง sale ไปเขียนลงยังตาราง invoice
ชื่อของ Action = copy invoice no
ตาราง : sale
Do this : add a new row to another table
Table to add to: invoice
set these column : invoice = [invoice no]
prominence = do not display
คลิก UX แล้วคลิกวิว payment Form คลิก behavior แล้วคัดลอก LINKTOVIEW("Payment_Form")
กลับไปที่ แท็บ Action
ตาราง sale คลิก +
กำหนดชื่อเป็น payment form
table : sale
Do this : Go to another view
Target: = LINKTOVIEW("Payment_Form")
prominence= Display as primary
เลื่อนลงไปที่ คำสั่ง behavior กำหนดค่าไอค่อนตะกร้าสินค้าแสดงเฉพาะมีรายการขายเท่านั้น ใช้สูตร
isnotblank(Select(Cart[Subtotal],True))
คลิก need confirm information
ข้อความเป็น ยืนยันชำระค่าสินค้า?
ตรวจสอบความสัมพันธ์ระหว่างตารางแม่และลูก
ไปที่แท็บดาต้า ตาราง sale
คอลัมน์ invoice no เป็น ref และระบุแหล่ง source table เป็น payment
อย่าลืมติ้ก is a part of
---------- จบ EP5 --------------------------------
ไม่มีความคิดเห็น:
แสดงความคิดเห็น