feat: implement restaurant POS workflow screens for End of Day Report, Menu Management, and Order History.
This commit is contained in:
Ho Ngoc Hai
@@ -0,0 +1,93 @@
|
||||
{
|
||||
"version": "2.6",
|
||||
"children": [
|
||||
{
|
||||
"type": "frame",
|
||||
"id": "EODReportScreen",
|
||||
"name": "Restaurant/End of Day Report",
|
||||
"reusable": true,
|
||||
"width": 1280,
|
||||
"height": 900,
|
||||
"fill": "$bg-page",
|
||||
"layout": "vertical",
|
||||
"clip": true,
|
||||
"children": [
|
||||
{"type": "frame", "id": "EODHeader", "width": "fill_container", "height": 64, "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [0, 24], "justifyContent": "space_between", "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "EODHeaderLeft", "gap": 16, "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "EODBackBtn", "width": 40, "height": 40, "fill": "$bg-interactive", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "EODBackIcon", "width": 20, "height": 20, "iconFontName": "arrow-left", "iconFontFamily": "lucide", "fill": "$text-secondary"}]},
|
||||
{"type": "text", "id": "EODTitle", "fill": "$text-primary", "content": "Báo cáo cuối ngày", "fontFamily": "Roboto", "fontSize": 20, "fontWeight": "700"}
|
||||
]},
|
||||
{"type": "frame", "id": "EODInfo", "gap": 20, "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "EODDate", "fill": "$bg-interactive", "cornerRadius": 8, "padding": [8, 14], "gap": 8, "alignItems": "center", "children": [{"type": "icon_font", "id": "EODDateIcon", "width": 16, "height": 16, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "EODDateText", "fill": "$text-primary", "content": "05/02/2026", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODShift", "fill": "$bg-interactive", "cornerRadius": 8, "padding": [8, 14], "gap": 8, "alignItems": "center", "children": [{"type": "icon_font", "id": "EODShiftIcon", "width": 16, "height": 16, "iconFontName": "clock", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "EODShiftText", "fill": "$text-primary", "content": "Ca: Tối (14h-22h)", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODCashier", "gap": 8, "alignItems": "center", "children": [{"type": "frame", "id": "EODCashierAvatar", "width": 32, "height": 32, "fill": "#22C55E30", "cornerRadius": 100, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "EODCashierInit", "fill": "#22C55E", "content": "M", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]}, {"type": "text", "id": "EODCashierName", "fill": "$text-primary", "content": "Minh", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}
|
||||
]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODBody", "width": "fill_container", "height": "fill_container", "padding": 24, "gap": 24, "children": [
|
||||
{"type": "frame", "id": "EODLeft", "width": "fill_container", "height": "fill_container", "layout": "vertical", "gap": 24, "children": [
|
||||
{"type": "frame", "id": "EODSummary", "width": "fill_container", "gap": 16, "children": [
|
||||
{"type": "frame", "id": "EODCard1", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "$border-default"}, "padding": 20, "layout": "vertical", "gap": 8, "children": [{"type": "frame", "id": "EODC1Top", "gap": 10, "alignItems": "center", "children": [{"type": "frame", "id": "EODC1Icon", "width": 40, "height": 40, "fill": "#22C55E20", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "EODC1IconFont", "width": 20, "height": 20, "iconFontName": "wallet", "iconFontFamily": "lucide", "fill": "#22C55E"}]}, {"type": "text", "id": "EODC1Label", "fill": "$text-secondary", "content": "Doanh thu", "fontFamily": "Roboto", "fontSize": 13}]}, {"type": "text", "id": "EODC1Value", "fill": "$text-primary", "content": "15,750,000₫", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "frame", "id": "EODC1Change", "gap": 6, "alignItems": "center", "children": [{"type": "icon_font", "id": "EODC1Arrow", "width": 14, "height": 14, "iconFontName": "trending-up", "iconFontFamily": "lucide", "fill": "#22C55E"}, {"type": "text", "id": "EODC1Percent", "fill": "#22C55E", "content": "+12% vs TB", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]}]},
|
||||
{"type": "frame", "id": "EODCard2", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "$border-default"}, "padding": 20, "layout": "vertical", "gap": 8, "children": [{"type": "frame", "id": "EODC2Top", "gap": 10, "alignItems": "center", "children": [{"type": "frame", "id": "EODC2Icon", "width": 40, "height": 40, "fill": "#3B82F620", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "EODC2IconFont", "width": 20, "height": 20, "iconFontName": "receipt", "iconFontFamily": "lucide", "fill": "#3B82F6"}]}, {"type": "text", "id": "EODC2Label", "fill": "$text-secondary", "content": "Số đơn hàng", "fontFamily": "Roboto", "fontSize": 13}]}, {"type": "text", "id": "EODC2Value", "fill": "$text-primary", "content": "48 đơn", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "text", "id": "EODC2Sub", "fill": "$text-tertiary", "content": "TB: 328,000₫/đơn", "fontFamily": "Roboto", "fontSize": 12}]},
|
||||
{"type": "frame", "id": "EODCard3", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "$border-default"}, "padding": 20, "layout": "vertical", "gap": 8, "children": [{"type": "frame", "id": "EODC3Top", "gap": 10, "alignItems": "center", "children": [{"type": "frame", "id": "EODC3Icon", "width": 40, "height": 40, "fill": "#8B5CF620", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "EODC3IconFont", "width": 20, "height": 20, "iconFontName": "users", "iconFontFamily": "lucide", "fill": "#8B5CF6"}]}, {"type": "text", "id": "EODC3Label", "fill": "$text-secondary", "content": "Số khách", "fontFamily": "Roboto", "fontSize": 13}]}, {"type": "text", "id": "EODC3Value", "fill": "$text-primary", "content": "156 khách", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "text", "id": "EODC3Sub", "fill": "$text-tertiary", "content": "TB: 3.2 khách/bàn", "fontFamily": "Roboto", "fontSize": 12}]},
|
||||
{"type": "frame", "id": "EODCard4", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "#EF444440"}, "padding": 20, "layout": "vertical", "gap": 8, "children": [{"type": "frame", "id": "EODC4Top", "gap": 10, "alignItems": "center", "children": [{"type": "frame", "id": "EODC4Icon", "width": 40, "height": 40, "fill": "#EF444420", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "EODC4IconFont", "width": 20, "height": 20, "iconFontName": "rotate-ccw", "iconFontFamily": "lucide", "fill": "#EF4444"}]}, {"type": "text", "id": "EODC4Label", "fill": "$text-secondary", "content": "Void/Refund", "fontFamily": "Roboto", "fontSize": 13}]}, {"type": "text", "id": "EODC4Value", "fill": "#EF4444", "content": "-185,000₫", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "text", "id": "EODC4Sub", "fill": "$text-tertiary", "content": "3 items", "fontFamily": "Roboto", "fontSize": 12}]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODPayment", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "$border-default"}, "padding": 20, "layout": "vertical", "gap": 16, "children": [
|
||||
{"type": "text", "id": "EODPayTitle", "fill": "$text-primary", "content": "Theo phương thức thanh toán", "fontFamily": "Roboto", "fontSize": 15, "fontWeight": "600"},
|
||||
{"type": "frame", "id": "EODPayCash", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [
|
||||
{"type": "frame", "id": "EODPayCashRow", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODPayCashLabel", "fill": "$text-secondary", "content": "Tiền mặt", "fontFamily": "Roboto", "fontSize": 13}, {"type": "text", "id": "EODPayCashValue", "fill": "$text-primary", "content": "8,500,000₫", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "EODPayCashBar", "width": "fill_container", "height": 8, "fill": "$bg-interactive", "cornerRadius": 4, "children": [{"type": "frame", "id": "EODPayCashFill", "width": 320, "height": 8, "fill": "#22C55E", "cornerRadius": 4}]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODPayQR", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [
|
||||
{"type": "frame", "id": "EODPayQRRow", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODPayQRLabel", "fill": "$text-secondary", "content": "QR/Chuyển khoản", "fontFamily": "Roboto", "fontSize": 13}, {"type": "text", "id": "EODPayQRValue", "fill": "$text-primary", "content": "4,250,000₫", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "EODPayQRBar", "width": "fill_container", "height": 8, "fill": "$bg-interactive", "cornerRadius": 4, "children": [{"type": "frame", "id": "EODPayQRFill", "width": 160, "height": 8, "fill": "#3B82F6", "cornerRadius": 4}]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODPayCard", "width": "fill_container", "layout": "vertical", "gap": 6, "children": [
|
||||
{"type": "frame", "id": "EODPayCardRow", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODPayCardLabel", "fill": "$text-secondary", "content": "Thẻ", "fontFamily": "Roboto", "fontSize": 13}, {"type": "text", "id": "EODPayCardValue", "fill": "$text-primary", "content": "3,000,000₫", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "EODPayCardBar", "width": "fill_container", "height": 8, "fill": "$bg-interactive", "cornerRadius": 4, "children": [{"type": "frame", "id": "EODPayCardFill", "width": 112, "height": 8, "fill": "#8B5CF6", "cornerRadius": 4}]}
|
||||
]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODTopItems", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "$border-default"}, "padding": 20, "layout": "vertical", "gap": 12, "children": [
|
||||
{"type": "text", "id": "EODTopTitle", "fill": "$text-primary", "content": "Top bán chạy", "fontFamily": "Roboto", "fontSize": 15, "fontWeight": "600"},
|
||||
{"type": "frame", "id": "EODTop1", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "EODTop1Left", "gap": 10, "alignItems": "center", "children": [{"type": "frame", "id": "EODTop1Rank", "width": 24, "height": 24, "fill": "$orange-primary", "cornerRadius": 100, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "EODTop1RankText", "fill": "$text-primary", "content": "1", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "700"}]}, {"type": "text", "id": "EODTop1Name", "fill": "$text-primary", "content": "Bò Lúc Lắc (32)", "fontFamily": "Roboto", "fontSize": 13}]}, {"type": "text", "id": "EODTop1Value", "fill": "$text-secondary", "content": "5,920,000₫", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "EODTop2", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "EODTop2Left", "gap": 10, "alignItems": "center", "children": [{"type": "frame", "id": "EODTop2Rank", "width": 24, "height": 24, "fill": "$bg-interactive", "cornerRadius": 100, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "EODTop2RankText", "fill": "$text-secondary", "content": "2", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]}, {"type": "text", "id": "EODTop2Name", "fill": "$text-primary", "content": "Bia Tiger (85)", "fontFamily": "Roboto", "fontSize": 13}]}, {"type": "text", "id": "EODTop2Value", "fill": "$text-secondary", "content": "2,975,000₫", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "EODTop3", "width": "fill_container", "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "EODTop3Left", "gap": 10, "alignItems": "center", "children": [{"type": "frame", "id": "EODTop3Rank", "width": 24, "height": 24, "fill": "$bg-interactive", "cornerRadius": 100, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "EODTop3RankText", "fill": "$text-secondary", "content": "3", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]}, {"type": "text", "id": "EODTop3Name", "fill": "$text-primary", "content": "Gà Nướng MO (28)", "fontFamily": "Roboto", "fontSize": 13}]}, {"type": "text", "id": "EODTop3Value", "fill": "$text-secondary", "content": "4,620,000₫", "fontFamily": "Roboto", "fontSize": 13}]}
|
||||
]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODRight", "width": 400, "height": "fill_container", "layout": "vertical", "gap": 16, "children": [
|
||||
{"type": "frame", "id": "EODCash", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "$border-default"}, "layout": "vertical", "children": [
|
||||
{"type": "frame", "id": "EODCashHeader", "width": "fill_container", "fill": "$bg-surface", "cornerRadius": [16, 16, 0, 0], "padding": [14, 20], "children": [{"type": "text", "id": "EODCashTitle", "fill": "$text-primary", "content": "Đối chiếu tiền mặt", "fontFamily": "Roboto", "fontSize": 15, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "EODCashContent", "width": "fill_container", "layout": "vertical", "padding": 20, "gap": 12, "children": [
|
||||
{"type": "frame", "id": "EODCashRow1", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODCashL1", "fill": "$text-secondary", "content": "Tiền đầu ca:", "fontFamily": "Roboto", "fontSize": 14}, {"type": "text", "id": "EODCashV1", "fill": "$text-primary", "content": "2,000,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODCashRow2", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODCashL2", "fill": "#22C55E", "content": "+ Tiền mặt nhận:", "fontFamily": "Roboto", "fontSize": 14}, {"type": "text", "id": "EODCashV2", "fill": "#22C55E", "content": "8,500,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODCashRow3", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODCashL3", "fill": "#EF4444", "content": "- Chi tiêu:", "fontFamily": "Roboto", "fontSize": 14}, {"type": "text", "id": "EODCashV3", "fill": "#EF4444", "content": "500,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODCashDiv", "width": "fill_container", "height": 1, "fill": "$border-subtle"},
|
||||
{"type": "frame", "id": "EODCashRow4", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODCashL4", "fill": "$text-primary", "content": "= Tiền cuối ca:", "fontFamily": "Roboto", "fontSize": 15, "fontWeight": "600"}, {"type": "text", "id": "EODCashV4", "fill": "$orange-primary", "content": "10,000,000₫", "fontFamily": "Roboto", "fontSize": 15, "fontWeight": "700"}]},
|
||||
{"type": "frame", "id": "EODCashDiv2", "width": "fill_container", "height": 1, "fill": "$border-subtle"},
|
||||
{"type": "frame", "id": "EODCashRow5", "width": "fill_container", "justifyContent": "space_between", "children": [{"type": "text", "id": "EODCashL5", "fill": "$text-secondary", "content": "Tiền thực đếm:", "fontFamily": "Roboto", "fontSize": 14}, {"type": "text", "id": "EODCashV5", "fill": "$text-primary", "content": "9,950,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODCashRow6", "width": "fill_container", "fill": "#F59E0B15", "cornerRadius": 10, "padding": [10, 14], "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "EODCashL6Row", "gap": 8, "alignItems": "center", "children": [{"type": "icon_font", "id": "EODCashWarning", "width": 16, "height": 16, "iconFontName": "alert-triangle", "iconFontFamily": "lucide", "fill": "#F59E0B"}, {"type": "text", "id": "EODCashL6", "fill": "#F59E0B", "content": "Chênh lệch:", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}, {"type": "text", "id": "EODCashV6", "fill": "#F59E0B", "content": "-50,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "700"}]}
|
||||
]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODActions", "width": "fill_container", "layout": "vertical", "gap": 12, "children": [
|
||||
{"type": "frame", "id": "EODInputCash", "width": "fill_container", "height": 48, "fill": "$bg-interactive", "cornerRadius": 12, "gap": 8, "justifyContent": "center", "alignItems": "center", "stroke": {"thickness": 1, "fill": "$border-default"}, "children": [{"type": "icon_font", "id": "EODInputIcon", "width": 18, "height": 18, "iconFontName": "calculator", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "EODInputText", "fill": "$text-secondary", "content": "Nhập tiền thực đếm", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODNote", "width": "fill_container", "height": 48, "fill": "$bg-interactive", "cornerRadius": 12, "gap": 8, "justifyContent": "center", "alignItems": "center", "stroke": {"thickness": 1, "fill": "$border-default"}, "children": [{"type": "icon_font", "id": "EODNoteIcon", "width": 18, "height": 18, "iconFontName": "message-square", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "EODNoteText", "fill": "$text-secondary", "content": "Ghi chú ca", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "EODPrint", "width": "fill_container", "height": 48, "fill": "$bg-interactive", "cornerRadius": 12, "gap": 8, "justifyContent": "center", "alignItems": "center", "stroke": {"thickness": 1, "fill": "$border-default"}, "children": [{"type": "icon_font", "id": "EODPrintIcon", "width": 18, "height": 18, "iconFontName": "printer", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "EODPrintText", "fill": "$text-secondary", "content": "In báo cáo", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}
|
||||
]},
|
||||
{"type": "frame", "id": "EODCloseBtn", "width": "fill_container", "height": 56, "fill": {"type": "gradient", "gradientType": "linear", "enabled": true, "rotation": 135, "size": {"height": 1}, "colors": [{"color": "#FF5C00", "position": 0}, {"color": "#FF8A4C", "position": 1}]}, "cornerRadius": 12, "gap": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "EODCloseIcon", "width": 20, "height": 20, "iconFontName": "check-circle", "iconFontFamily": "lucide", "fill": "$text-primary"}, {"type": "text", "id": "EODCloseText", "fill": "$text-primary", "content": "Xác nhận đóng ca", "fontFamily": "Roboto", "fontSize": 16, "fontWeight": "600"}]}
|
||||
]}
|
||||
]}
|
||||
]
|
||||
}
|
||||
],
|
||||
"variables": {
|
||||
"bg-elevated": {"type": "color", "value": "#1A1A1D"},
|
||||
"bg-interactive": {"type": "color", "value": "#2A2A2E"},
|
||||
"bg-page": {"type": "color", "value": "#0A0A0B"},
|
||||
"bg-surface": {"type": "color", "value": "#111113"},
|
||||
"border-default": {"type": "color", "value": "#2A2A2E"},
|
||||
"border-subtle": {"type": "color", "value": "#1F1F23"},
|
||||
"orange-primary": {"type": "color", "value": "#FF5C00"},
|
||||
"text-primary": {"type": "color", "value": "#FFFFFF"},
|
||||
"text-secondary": {"type": "color", "value": "#ADADB0"},
|
||||
"text-tertiary": {"type": "color", "value": "#8B8B90"}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
{
|
||||
"version": "2.6",
|
||||
"children": [
|
||||
{
|
||||
"type": "frame",
|
||||
"id": "MenuManagementScreen",
|
||||
"name": "Restaurant/Menu Management",
|
||||
"reusable": true,
|
||||
"width": 1440,
|
||||
"height": 900,
|
||||
"fill": "$bg-page",
|
||||
"layout": "vertical",
|
||||
"clip": true,
|
||||
"children": [
|
||||
{"type": "frame", "id": "MMHeader", "width": "fill_container", "height": 64, "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [0, 24], "justifyContent": "space_between", "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "MMHeaderLeft", "gap": 16, "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "MMBackBtn", "width": 40, "height": 40, "fill": "$bg-interactive", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "MMBackIcon", "width": 20, "height": 20, "iconFontName": "arrow-left", "iconFontFamily": "lucide", "fill": "$text-secondary"}]},
|
||||
{"type": "text", "id": "MMTitle", "fill": "$text-primary", "content": "Quản lý Thực đơn", "fontFamily": "Roboto", "fontSize": 20, "fontWeight": "700"}
|
||||
]},
|
||||
{"type": "frame", "id": "MMSearch", "width": 320, "height": 44, "fill": "$bg-interactive", "cornerRadius": 10, "padding": [0, 16], "gap": 10, "alignItems": "center", "children": [
|
||||
{"type": "icon_font", "id": "MMSearchIcon", "width": 18, "height": 18, "iconFontName": "search", "iconFontFamily": "lucide", "fill": "$text-tertiary"},
|
||||
{"type": "text", "id": "MMSearchText", "fill": "$text-tertiary", "content": "Tìm món ăn...", "fontFamily": "Roboto", "fontSize": 14}
|
||||
]},
|
||||
{"type": "frame", "id": "MMAddBtn", "height": 44, "fill": "$orange-primary", "cornerRadius": 10, "padding": [0, 20], "gap": 8, "alignItems": "center", "children": [
|
||||
{"type": "icon_font", "id": "MMAddIcon", "width": 18, "height": 18, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$text-primary"},
|
||||
{"type": "text", "id": "MMAddText", "fill": "$text-primary", "content": "Thêm món", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}
|
||||
]}
|
||||
]},
|
||||
{"type": "frame", "id": "MMBody", "width": "fill_container", "height": "fill_container", "children": [
|
||||
{"type": "frame", "id": "MMSidebar", "width": 260, "height": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["right"]}, "layout": "vertical", "padding": 16, "gap": 8, "children": [
|
||||
{"type": "text", "id": "MMCatTitle", "fill": "$text-secondary", "content": "Danh mục", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600", "padding": [0, 8]},
|
||||
{"type": "frame", "id": "MMCat1", "width": "fill_container", "fill": "$orange-primary", "cornerRadius": 10, "padding": [12, 14], "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "MMCat1Left", "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "MMCat1Icon", "width": 18, "height": 18, "iconFontName": "utensils", "iconFontFamily": "lucide", "fill": "$text-primary"}, {"type": "text", "id": "MMCat1Text", "fill": "$text-primary", "content": "Tất cả", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]}, {"type": "frame", "id": "MMCat1Badge", "fill": "#FFFFFF30", "cornerRadius": 6, "padding": [4, 8], "children": [{"type": "text", "id": "MMCat1Count", "fill": "$text-primary", "content": "93", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "700"}]}]},
|
||||
{"type": "frame", "id": "MMCat2", "width": "fill_container", "fill": "$bg-interactive", "cornerRadius": 10, "padding": [12, 14], "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "MMCat2Left", "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "MMCat2Icon", "width": 18, "height": 18, "iconFontName": "salad", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "MMCat2Text", "fill": "$text-secondary", "content": "Khai vị", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}, {"type": "text", "id": "MMCat2Count", "fill": "$text-tertiary", "content": "12", "fontFamily": "Roboto", "fontSize": 12}]},
|
||||
{"type": "frame", "id": "MMCat3", "width": "fill_container", "fill": "$bg-interactive", "cornerRadius": 10, "padding": [12, 14], "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "MMCat3Left", "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "MMCat3Icon", "width": 18, "height": 18, "iconFontName": "beef", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "MMCat3Text", "fill": "$text-secondary", "content": "Món chính", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}, {"type": "text", "id": "MMCat3Count", "fill": "$text-tertiary", "content": "25", "fontFamily": "Roboto", "fontSize": 12}]},
|
||||
{"type": "frame", "id": "MMCat4", "width": "fill_container", "fill": "$bg-interactive", "cornerRadius": 10, "padding": [12, 14], "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "MMCat4Left", "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "MMCat4Icon", "width": 18, "height": 18, "iconFontName": "fish", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "MMCat4Text", "fill": "$text-secondary", "content": "Hải sản", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}, {"type": "text", "id": "MMCat4Count", "fill": "$text-tertiary", "content": "18", "fontFamily": "Roboto", "fontSize": 12}]},
|
||||
{"type": "frame", "id": "MMCat5", "width": "fill_container", "fill": "$bg-interactive", "cornerRadius": 10, "padding": [12, 14], "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "MMCat5Left", "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "MMCat5Icon", "width": 18, "height": 18, "iconFontName": "wine", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "MMCat5Text", "fill": "$text-secondary", "content": "Đồ uống", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}, {"type": "text", "id": "MMCat5Count", "fill": "$text-tertiary", "content": "30", "fontFamily": "Roboto", "fontSize": 12}]},
|
||||
{"type": "frame", "id": "MMCat6", "width": "fill_container", "fill": "$bg-interactive", "cornerRadius": 10, "padding": [12, 14], "justifyContent": "space_between", "alignItems": "center", "children": [{"type": "frame", "id": "MMCat6Left", "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "MMCat6Icon", "width": 18, "height": 18, "iconFontName": "cake", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "MMCat6Text", "fill": "$text-secondary", "content": "Tráng miệng", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]}, {"type": "text", "id": "MMCat6Count", "fill": "$text-tertiary", "content": "8", "fontFamily": "Roboto", "fontSize": 12}]},
|
||||
{"type": "frame", "id": "MMDivider", "width": "fill_container", "height": 1, "fill": "$border-subtle"},
|
||||
{"type": "frame", "id": "MMAddCat", "width": "fill_container", "height": 44, "fill": "$bg-interactive", "cornerRadius": 10, "gap": 8, "justifyContent": "center", "alignItems": "center", "stroke": {"thickness": 1, "fill": "$border-default", "style": "dashed"}, "children": [{"type": "icon_font", "id": "MMAddCatIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$text-tertiary"}, {"type": "text", "id": "MMAddCatText", "fill": "$text-tertiary", "content": "Thêm nhóm", "fontFamily": "Roboto", "fontSize": 13}]}
|
||||
]},
|
||||
{"type": "frame", "id": "MMMainContent", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [
|
||||
{"type": "frame", "id": "MMToolbar", "width": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [10, 24], "gap": 12, "children": [
|
||||
{"type": "frame", "id": "MM86Bulk", "height": 36, "fill": "#EF444420", "cornerRadius": 8, "padding": [0, 14], "gap": 6, "alignItems": "center", "stroke": {"thickness": 1, "fill": "#EF444450"}, "children": [{"type": "icon_font", "id": "MM86Icon", "width": 14, "height": 14, "iconFontName": "ban", "iconFontFamily": "lucide", "fill": "#EF4444"}, {"type": "text", "id": "MM86Text", "fill": "#EF4444", "content": "86 hàng loạt", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "MMUpdatePrice", "height": 36, "fill": "$bg-interactive", "cornerRadius": 8, "padding": [0, 14], "gap": 6, "alignItems": "center", "stroke": {"thickness": 1, "fill": "$border-default"}, "children": [{"type": "icon_font", "id": "MMPriceIcon", "width": 14, "height": 14, "iconFontName": "dollar-sign", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "MMPriceText", "fill": "$text-secondary", "content": "Cập nhật giá", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "MMImport", "height": 36, "fill": "$bg-interactive", "cornerRadius": 8, "padding": [0, 14], "gap": 6, "alignItems": "center", "stroke": {"thickness": 1, "fill": "$border-default"}, "children": [{"type": "icon_font", "id": "MMImportIcon", "width": 14, "height": 14, "iconFontName": "upload", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "MMImportText", "fill": "$text-secondary", "content": "Import/Export", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]}
|
||||
]},
|
||||
{"type": "frame", "id": "MMTable", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [
|
||||
{"type": "frame", "id": "MMTableHeader", "width": "fill_container", "fill": "$bg-surface", "padding": [12, 24], "children": [
|
||||
{"type": "frame", "id": "MMTHCheck", "width": 40, "children": [{"type": "frame", "id": "MMTHCheckBox", "width": 18, "height": 18, "fill": "$bg-interactive", "cornerRadius": 4, "stroke": {"thickness": 1, "fill": "$border-default"}}]},
|
||||
{"type": "frame", "id": "MMTHImg", "width": 60, "children": [{"type": "text", "id": "MMTHImgText", "fill": "$text-tertiary", "content": "Hình", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "MMTHName", "width": "fill_container", "children": [{"type": "text", "id": "MMTHNameText", "fill": "$text-tertiary", "content": "Tên món", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "MMTHPrice", "width": 120, "children": [{"type": "text", "id": "MMTHPriceText", "fill": "$text-tertiary", "content": "Giá", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "MMTHStatus", "width": 100, "children": [{"type": "text", "id": "MMTHStatusText", "fill": "$text-tertiary", "content": "Trạng thái", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "MMTH86", "width": 80, "justifyContent": "center", "children": [{"type": "text", "id": "MMTH86Text", "fill": "$text-tertiary", "content": "86", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]}
|
||||
]},
|
||||
{"type": "frame", "id": "MMRow1", "width": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [12, 24], "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "MMR1Check", "width": 40, "children": [{"type": "frame", "id": "MMR1CheckBox", "width": 18, "height": 18, "fill": "$bg-interactive", "cornerRadius": 4, "stroke": {"thickness": 1, "fill": "$border-default"}}]},
|
||||
{"type": "frame", "id": "MMR1Img", "width": 48, "height": 48, "fill": "#EF444418", "cornerRadius": 8},
|
||||
{"type": "frame", "id": "MMR1Name", "width": "fill_container", "padding": [0, 12], "children": [{"type": "text", "id": "MMR1NameText", "fill": "$text-primary", "content": "Bò Lúc Lắc", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "MMR1Price", "width": 120, "children": [{"type": "text", "id": "MMR1PriceText", "fill": "$orange-primary", "content": "185,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "MMR1Status", "width": 100, "children": [{"type": "frame", "id": "MMR1StatusBadge", "fill": "#22C55E20", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "MMR1StatusText", "fill": "#22C55E", "content": "Active", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "MMR186", "width": 80, "justifyContent": "center", "children": [{"type": "frame", "id": "MMR186Toggle", "width": 44, "height": 24, "fill": "$bg-interactive", "cornerRadius": 100, "padding": 2, "children": [{"type": "frame", "id": "MMR186Knob", "width": 20, "height": 20, "fill": "$text-tertiary", "cornerRadius": 100}]}]}
|
||||
]},
|
||||
{"type": "frame", "id": "MMRow2", "width": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [12, 24], "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "MMR2Check", "width": 40, "children": [{"type": "frame", "id": "MMR2CheckBox", "width": 18, "height": 18, "fill": "$bg-interactive", "cornerRadius": 4, "stroke": {"thickness": 1, "fill": "$border-default"}}]},
|
||||
{"type": "frame", "id": "MMR2Img", "width": 48, "height": 48, "fill": "#F59E0B18", "cornerRadius": 8},
|
||||
{"type": "frame", "id": "MMR2Name", "width": "fill_container", "padding": [0, 12], "children": [{"type": "text", "id": "MMR2NameText", "fill": "$text-primary", "content": "Gà Nướng Mật Ong", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "MMR2Price", "width": 120, "children": [{"type": "text", "id": "MMR2PriceText", "fill": "$orange-primary", "content": "165,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "MMR2Status", "width": 100, "children": [{"type": "frame", "id": "MMR2StatusBadge", "fill": "#22C55E20", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "MMR2StatusText", "fill": "#22C55E", "content": "Active", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "MMR286", "width": 80, "justifyContent": "center", "children": [{"type": "frame", "id": "MMR286Toggle", "width": 44, "height": 24, "fill": "$bg-interactive", "cornerRadius": 100, "padding": 2, "children": [{"type": "frame", "id": "MMR286Knob", "width": 20, "height": 20, "fill": "$text-tertiary", "cornerRadius": 100}]}]}
|
||||
]},
|
||||
{"type": "frame", "id": "MMRow3", "width": "fill_container", "fill": "#EF444410", "stroke": {"thickness": 1, "fill": "#EF444430", "sides": ["bottom"]}, "padding": [12, 24], "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "MMR3Check", "width": 40, "children": [{"type": "frame", "id": "MMR3CheckBox", "width": 18, "height": 18, "fill": "#EF4444", "cornerRadius": 4, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "MMR3CheckIcon", "width": 12, "height": 12, "iconFontName": "check", "iconFontFamily": "lucide", "fill": "$text-primary"}]}]},
|
||||
{"type": "frame", "id": "MMR3Img", "width": 48, "height": 48, "fill": "#8B5CF618", "cornerRadius": 8},
|
||||
{"type": "frame", "id": "MMR3Name", "width": "fill_container", "padding": [0, 12], "children": [{"type": "text", "id": "MMR3NameText", "fill": "$text-tertiary", "content": "Bò Hầm Rượu", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500", "textDecoration": "line-through"}]},
|
||||
{"type": "frame", "id": "MMR3Price", "width": 120, "children": [{"type": "text", "id": "MMR3PriceText", "fill": "$text-tertiary", "content": "195,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "MMR3Status", "width": 100, "children": [{"type": "frame", "id": "MMR3StatusBadge", "fill": "#EF444420", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "MMR3StatusText", "fill": "#EF4444", "content": "86'd", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "MMR386", "width": 80, "justifyContent": "center", "children": [{"type": "frame", "id": "MMR386Toggle", "width": 44, "height": 24, "fill": "#EF4444", "cornerRadius": 100, "padding": 2, "justifyContent": "flex_end", "children": [{"type": "frame", "id": "MMR386Knob", "width": 20, "height": 20, "fill": "$text-primary", "cornerRadius": 100}]}]}
|
||||
]}
|
||||
]}
|
||||
]}
|
||||
]}
|
||||
]
|
||||
}
|
||||
],
|
||||
"variables": {
|
||||
"bg-elevated": {"type": "color", "value": "#1A1A1D"},
|
||||
"bg-interactive": {"type": "color", "value": "#2A2A2E"},
|
||||
"bg-page": {"type": "color", "value": "#0A0A0B"},
|
||||
"bg-surface": {"type": "color", "value": "#111113"},
|
||||
"border-default": {"type": "color", "value": "#2A2A2E"},
|
||||
"border-subtle": {"type": "color", "value": "#1F1F23"},
|
||||
"orange-primary": {"type": "color", "value": "#FF5C00"},
|
||||
"text-primary": {"type": "color", "value": "#FFFFFF"},
|
||||
"text-secondary": {"type": "color", "value": "#ADADB0"},
|
||||
"text-tertiary": {"type": "color", "value": "#8B8B90"}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,112 @@
|
||||
{
|
||||
"version": "2.6",
|
||||
"children": [
|
||||
{
|
||||
"type": "frame",
|
||||
"id": "OrderHistoryScreen",
|
||||
"name": "Restaurant/Order History",
|
||||
"reusable": true,
|
||||
"width": 1280,
|
||||
"height": 800,
|
||||
"fill": "$bg-page",
|
||||
"layout": "vertical",
|
||||
"clip": true,
|
||||
"children": [
|
||||
{"type": "frame", "id": "OHHeader", "width": "fill_container", "height": 64, "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [0, 24], "justifyContent": "space_between", "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "OHHeaderLeft", "gap": 16, "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "OHBackBtn", "width": 40, "height": 40, "fill": "$bg-interactive", "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "OHBackIcon", "width": 20, "height": 20, "iconFontName": "arrow-left", "iconFontFamily": "lucide", "fill": "$text-secondary"}]},
|
||||
{"type": "text", "id": "OHTitle", "fill": "$text-primary", "content": "Lịch sử đơn hàng", "fontFamily": "Roboto", "fontSize": 20, "fontWeight": "700"}
|
||||
]},
|
||||
{"type": "frame", "id": "OHFilters", "gap": 12, "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "OHSearch", "width": 280, "height": 44, "fill": "$bg-interactive", "cornerRadius": 10, "padding": [0, 16], "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "OHSearchIcon", "width": 18, "height": 18, "iconFontName": "search", "iconFontFamily": "lucide", "fill": "$text-tertiary"}, {"type": "text", "id": "OHSearchText", "fill": "$text-tertiary", "content": "Tìm theo #đơn, khách...", "fontFamily": "Roboto", "fontSize": 14}]},
|
||||
{"type": "frame", "id": "OHDateRange", "height": 44, "fill": "$bg-interactive", "cornerRadius": 10, "padding": [0, 14], "gap": 10, "alignItems": "center", "children": [{"type": "icon_font", "id": "OHDateIcon", "width": 18, "height": 18, "iconFontName": "calendar", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "OHDateText", "fill": "$text-primary", "content": "05/02 - 05/02", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}, {"type": "icon_font", "id": "OHDateChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$text-tertiary"}]},
|
||||
{"type": "frame", "id": "OHStatusFilter", "height": 44, "fill": "$bg-interactive", "cornerRadius": 10, "padding": [0, 14], "gap": 8, "alignItems": "center", "children": [{"type": "text", "id": "OHStatusText", "fill": "$text-primary", "content": "Tất cả trạng thái", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}, {"type": "icon_font", "id": "OHStatusChev", "width": 14, "height": 14, "iconFontName": "chevron-down", "iconFontFamily": "lucide", "fill": "$text-tertiary"}]},
|
||||
{"type": "frame", "id": "OHExport", "height": 44, "fill": "$bg-interactive", "cornerRadius": 10, "padding": [0, 14], "gap": 8, "alignItems": "center", "stroke": {"thickness": 1, "fill": "$border-default"}, "children": [{"type": "icon_font", "id": "OHExportIcon", "width": 18, "height": 18, "iconFontName": "download", "iconFontFamily": "lucide", "fill": "$text-secondary"}, {"type": "text", "id": "OHExportText", "fill": "$text-secondary", "content": "Export", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]}
|
||||
]}
|
||||
]},
|
||||
{"type": "frame", "id": "OHStats", "width": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [12, 24], "gap": 24, "children": [
|
||||
{"type": "frame", "id": "OHStat1", "gap": 8, "alignItems": "center", "children": [{"type": "text", "id": "OHStat1Label", "fill": "$text-secondary", "content": "Tổng đơn:", "fontFamily": "Roboto", "fontSize": 13}, {"type": "text", "id": "OHStat1Value", "fill": "$text-primary", "content": "156", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "700"}]},
|
||||
{"type": "frame", "id": "OHStat2", "gap": 8, "alignItems": "center", "children": [{"type": "text", "id": "OHStat2Label", "fill": "$text-secondary", "content": "Hoàn tất:", "fontFamily": "Roboto", "fontSize": 13}, {"type": "frame", "id": "OHStat2Badge", "fill": "#22C55E20", "cornerRadius": 6, "padding": [4, 8], "children": [{"type": "text", "id": "OHStat2Value", "fill": "#22C55E", "content": "148", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "OHStat3", "gap": 8, "alignItems": "center", "children": [{"type": "text", "id": "OHStat3Label", "fill": "$text-secondary", "content": "Hủy:", "fontFamily": "Roboto", "fontSize": 13}, {"type": "frame", "id": "OHStat3Badge", "fill": "#EF444420", "cornerRadius": 6, "padding": [4, 8], "children": [{"type": "text", "id": "OHStat3Value", "fill": "#EF4444", "content": "5", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "OHStat4", "gap": 8, "alignItems": "center", "children": [{"type": "text", "id": "OHStat4Label", "fill": "$text-secondary", "content": "Refund:", "fontFamily": "Roboto", "fontSize": 13}, {"type": "frame", "id": "OHStat4Badge", "fill": "#F59E0B20", "cornerRadius": 6, "padding": [4, 8], "children": [{"type": "text", "id": "OHStat4Value", "fill": "#F59E0B", "content": "3", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]}]}
|
||||
]},
|
||||
{"type": "frame", "id": "OHTable", "width": "fill_container", "height": "fill_container", "layout": "vertical", "children": [
|
||||
{"type": "frame", "id": "OHTableHeader", "width": "fill_container", "fill": "$bg-surface", "padding": [14, 24], "children": [
|
||||
{"type": "frame", "id": "OHTHOrder", "width": 120, "children": [{"type": "text", "id": "OHTHOrderText", "fill": "$text-tertiary", "content": "Mã đơn", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHTHTable", "width": 80, "children": [{"type": "text", "id": "OHTHTableText", "fill": "$text-tertiary", "content": "Bàn", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHTHCustomer", "width": "fill_container", "children": [{"type": "text", "id": "OHTHCustomerText", "fill": "$text-tertiary", "content": "Khách hàng", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHTHItems", "width": 80, "children": [{"type": "text", "id": "OHTHItemsText", "fill": "$text-tertiary", "content": "Items", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHTHTotal", "width": 140, "children": [{"type": "text", "id": "OHTHTotalText", "fill": "$text-tertiary", "content": "Tổng tiền", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHTHPayment", "width": 100, "children": [{"type": "text", "id": "OHTHPaymentText", "fill": "$text-tertiary", "content": "Thanh toán", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHTHTime", "width": 100, "children": [{"type": "text", "id": "OHTHTimeText", "fill": "$text-tertiary", "content": "Thời gian", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHTHStatus", "width": 100, "children": [{"type": "text", "id": "OHTHStatusText", "fill": "$text-tertiary", "content": "Trạng thái", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}]}
|
||||
]},
|
||||
{"type": "frame", "id": "OHRow1", "width": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [14, 24], "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "OHR1Order", "width": 120, "children": [{"type": "text", "id": "OHR1OrderText", "fill": "$orange-primary", "content": "#0092", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHR1Table", "width": 80, "children": [{"type": "frame", "id": "OHR1TableBadge", "fill": "$bg-interactive", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR1TableText", "fill": "$text-primary", "content": "Bàn 05", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]}]},
|
||||
{"type": "frame", "id": "OHR1Customer", "width": "fill_container", "children": [{"type": "text", "id": "OHR1CustomerText", "fill": "$text-primary", "content": "Nguyễn Minh Quang", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "OHR1Items", "width": 80, "children": [{"type": "text", "id": "OHR1ItemsText", "fill": "$text-secondary", "content": "6 món", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR1Total", "width": 140, "children": [{"type": "text", "id": "OHR1TotalText", "fill": "$text-primary", "content": "785,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHR1Payment", "width": 100, "children": [{"type": "frame", "id": "OHR1PayBadge", "fill": "#3B82F620", "cornerRadius": 6, "padding": [4, 8], "gap": 4, "alignItems": "center", "children": [{"type": "icon_font", "id": "OHR1PayIcon", "width": 12, "height": 12, "iconFontName": "qr-code", "iconFontFamily": "lucide", "fill": "#3B82F6"}, {"type": "text", "id": "OHR1PayText", "fill": "#3B82F6", "content": "QR", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "OHR1Time", "width": 100, "children": [{"type": "text", "id": "OHR1TimeText", "fill": "$text-secondary", "content": "20:15", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR1Status", "width": 100, "children": [{"type": "frame", "id": "OHR1StatusBadge", "fill": "#22C55E20", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR1StatusText", "fill": "#22C55E", "content": "Hoàn tất", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]}
|
||||
]},
|
||||
{"type": "frame", "id": "OHRow2", "width": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [14, 24], "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "OHR2Order", "width": 120, "children": [{"type": "text", "id": "OHR2OrderText", "fill": "$orange-primary", "content": "#0091", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHR2Table", "width": 80, "children": [{"type": "frame", "id": "OHR2TableBadge", "fill": "$bg-interactive", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR2TableText", "fill": "$text-primary", "content": "Bàn 08", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]}]},
|
||||
{"type": "frame", "id": "OHR2Customer", "width": "fill_container", "children": [{"type": "text", "id": "OHR2CustomerText", "fill": "$text-primary", "content": "Trần Văn Hùng", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "OHR2Items", "width": 80, "children": [{"type": "text", "id": "OHR2ItemsText", "fill": "$text-secondary", "content": "4 món", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR2Total", "width": 140, "children": [{"type": "text", "id": "OHR2TotalText", "fill": "$text-primary", "content": "520,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHR2Payment", "width": 100, "children": [{"type": "frame", "id": "OHR2PayBadge", "fill": "#22C55E20", "cornerRadius": 6, "padding": [4, 8], "gap": 4, "alignItems": "center", "children": [{"type": "icon_font", "id": "OHR2PayIcon", "width": 12, "height": 12, "iconFontName": "banknote", "iconFontFamily": "lucide", "fill": "#22C55E"}, {"type": "text", "id": "OHR2PayText", "fill": "#22C55E", "content": "Cash", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "OHR2Time", "width": 100, "children": [{"type": "text", "id": "OHR2TimeText", "fill": "$text-secondary", "content": "20:02", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR2Status", "width": 100, "children": [{"type": "frame", "id": "OHR2StatusBadge", "fill": "#22C55E20", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR2StatusText", "fill": "#22C55E", "content": "Hoàn tất", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]}
|
||||
]},
|
||||
{"type": "frame", "id": "OHRow3", "width": "fill_container", "fill": "#EF444410", "stroke": {"thickness": 1, "fill": "#EF444430", "sides": ["bottom"]}, "padding": [14, 24], "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "OHR3Order", "width": 120, "children": [{"type": "text", "id": "OHR3OrderText", "fill": "$text-tertiary", "content": "#0090", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHR3Table", "width": 80, "children": [{"type": "frame", "id": "OHR3TableBadge", "fill": "$bg-interactive", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR3TableText", "fill": "$text-secondary", "content": "Bàn 02", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]}]},
|
||||
{"type": "frame", "id": "OHR3Customer", "width": "fill_container", "children": [{"type": "text", "id": "OHR3CustomerText", "fill": "$text-secondary", "content": "Lê Thị Hoa", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "OHR3Items", "width": 80, "children": [{"type": "text", "id": "OHR3ItemsText", "fill": "$text-tertiary", "content": "2 món", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR3Total", "width": 140, "children": [{"type": "text", "id": "OHR3TotalText", "fill": "$text-tertiary", "content": "185,000₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600", "textDecoration": "line-through"}]},
|
||||
{"type": "frame", "id": "OHR3Payment", "width": 100, "children": [{"type": "text", "id": "OHR3PayText", "fill": "$text-tertiary", "content": "-", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR3Time", "width": 100, "children": [{"type": "text", "id": "OHR3TimeText", "fill": "$text-tertiary", "content": "19:48", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR3Status", "width": 100, "children": [{"type": "frame", "id": "OHR3StatusBadge", "fill": "#EF444420", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR3StatusText", "fill": "#EF4444", "content": "Đã hủy", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]}
|
||||
]},
|
||||
{"type": "frame", "id": "OHRow4", "width": "fill_container", "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]}, "padding": [14, 24], "alignItems": "center", "children": [
|
||||
{"type": "frame", "id": "OHR4Order", "width": 120, "children": [{"type": "text", "id": "OHR4OrderText", "fill": "$orange-primary", "content": "#0089", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHR4Table", "width": 80, "children": [{"type": "frame", "id": "OHR4TableBadge", "fill": "$bg-interactive", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR4TableText", "fill": "$text-primary", "content": "Bàn 03", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]}]},
|
||||
{"type": "frame", "id": "OHR4Customer", "width": "fill_container", "children": [{"type": "text", "id": "OHR4CustomerText", "fill": "$text-primary", "content": "Nguyễn Văn A", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
|
||||
{"type": "frame", "id": "OHR4Items", "width": 80, "children": [{"type": "text", "id": "OHR4ItemsText", "fill": "$text-secondary", "content": "8 món", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR4Total", "width": 140, "children": [{"type": "text", "id": "OHR4TotalText", "fill": "$text-primary", "content": "1,253,500₫", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHR4Payment", "width": 100, "children": [{"type": "frame", "id": "OHR4PayBadge", "fill": "#8B5CF620", "cornerRadius": 6, "padding": [4, 8], "gap": 4, "alignItems": "center", "children": [{"type": "icon_font", "id": "OHR4PayIcon", "width": 12, "height": 12, "iconFontName": "credit-card", "iconFontFamily": "lucide", "fill": "#8B5CF6"}, {"type": "text", "id": "OHR4PayText", "fill": "#8B5CF6", "content": "Card", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
|
||||
{"type": "frame", "id": "OHR4Time", "width": 100, "children": [{"type": "text", "id": "OHR4TimeText", "fill": "$text-secondary", "content": "19:30", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHR4Status", "width": 100, "children": [{"type": "frame", "id": "OHR4StatusBadge", "fill": "#22C55E20", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "OHR4StatusText", "fill": "#22C55E", "content": "Hoàn tất", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]}
|
||||
]}
|
||||
]},
|
||||
{"type": "frame", "id": "OHFooter", "width": "fill_container", "height": 56, "fill": "$bg-elevated", "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["top"]}, "padding": [0, 24], "justifyContent": "space_between", "alignItems": "center", "children": [
|
||||
{"type": "text", "id": "OHFooterInfo", "fill": "$text-secondary", "content": "Hiển thị 1-10 của 156 đơn", "fontFamily": "Roboto", "fontSize": 13},
|
||||
{"type": "frame", "id": "OHPagination", "gap": 8, "children": [
|
||||
{"type": "frame", "id": "OHPrev", "width": 36, "height": 36, "fill": "$bg-interactive", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "OHPrevIcon", "width": 16, "height": 16, "iconFontName": "chevron-left", "iconFontFamily": "lucide", "fill": "$text-tertiary"}]},
|
||||
{"type": "frame", "id": "OHPage1", "width": 36, "height": 36, "fill": "$orange-primary", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "OHPage1Text", "fill": "$text-primary", "content": "1", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]},
|
||||
{"type": "frame", "id": "OHPage2", "width": 36, "height": 36, "fill": "$bg-interactive", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "OHPage2Text", "fill": "$text-secondary", "content": "2", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHPage3", "width": 36, "height": 36, "fill": "$bg-interactive", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "OHPage3Text", "fill": "$text-secondary", "content": "3", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHDots", "width": 36, "height": 36, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "OHDotsText", "fill": "$text-tertiary", "content": "...", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHPage16", "width": 36, "height": 36, "fill": "$bg-interactive", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "OHPage16Text", "fill": "$text-secondary", "content": "16", "fontFamily": "Roboto", "fontSize": 13}]},
|
||||
{"type": "frame", "id": "OHNext", "width": 36, "height": 36, "fill": "$bg-interactive", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "icon_font", "id": "OHNextIcon", "width": 16, "height": 16, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$text-secondary"}]}
|
||||
]}
|
||||
]}
|
||||
]
|
||||
}
|
||||
],
|
||||
"variables": {
|
||||
"bg-elevated": {"type": "color", "value": "#1A1A1D"},
|
||||
"bg-interactive": {"type": "color", "value": "#2A2A2E"},
|
||||
"bg-page": {"type": "color", "value": "#0A0A0B"},
|
||||
"bg-surface": {"type": "color", "value": "#111113"},
|
||||
"border-default": {"type": "color", "value": "#2A2A2E"},
|
||||
"border-subtle": {"type": "color", "value": "#1F1F23"},
|
||||
"orange-primary": {"type": "color", "value": "#FF5C00"},
|
||||
"text-primary": {"type": "color", "value": "#FFFFFF"},
|
||||
"text-secondary": {"type": "color", "value": "#ADADB0"},
|
||||
"text-tertiary": {"type": "color", "value": "#8B8B90"}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user