รีวิวการสร้างแอพขายกาแฟ Coffee Pos 2023 V1

 บทความนี้เราจะมาฝึกสร้างแอพขายกาแฟด้วยตัวเอง โดยใช้ฐานข้อมูล 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]
Item name = [name]
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 --------------------------------


ليست هناك تعليقات:

إرسال تعليق