Updates to order screen
This commit is contained in:
@@ -1,186 +1,207 @@
|
||||
let Application : ApplicationState = {
|
||||
keyboard : null,
|
||||
mode: [],
|
||||
languageVars: {}
|
||||
}
|
||||
/// <reference path="./typings/currency.d.ts" />
|
||||
|
||||
const Application: ApplicationState = {
|
||||
keyboard: null,
|
||||
mode: [],
|
||||
languageVars: {}
|
||||
}
|
||||
|
||||
|
||||
/** Parses a language variable. */
|
||||
let lang = (key: string, replacements?: string[] | string) => {
|
||||
let finalValue = Application.languageVars[key] || ''
|
||||
/** Parses a language variable. */
|
||||
const lang = (key: string, replacements?: string[] | string) => {
|
||||
let finalValue = Application.languageVars[key] || ''
|
||||
|
||||
if(!replacements) return finalValue
|
||||
if(typeof replacements === 'string') replacements = [replacements]
|
||||
if (!replacements) return finalValue
|
||||
if (typeof replacements === 'string') replacements = [replacements]
|
||||
|
||||
replacements.forEach( (replacement, index) => {
|
||||
let correctIndex = index+1
|
||||
finalValue = finalValue.replace(`[${correctIndex}]`, replacement)
|
||||
})
|
||||
replacements.forEach((replacement, index) => {
|
||||
const correctIndex = index + 1
|
||||
finalValue = finalValue.replace(`[${correctIndex}]`, replacement)
|
||||
})
|
||||
|
||||
return finalValue
|
||||
}
|
||||
return finalValue
|
||||
}
|
||||
|
||||
/** Check if a variable is defined */
|
||||
let defined = (variable: any) => {
|
||||
return typeof variable !== 'undefined'
|
||||
}
|
||||
/** Check if a variable is defined */
|
||||
const defined = (variable: any) => {
|
||||
return typeof variable !== 'undefined'
|
||||
}
|
||||
|
||||
/** Call an Ajax function asynchronously */
|
||||
let ajax = (endpoint : string, data: any, method = 'POST', successFunction : Function , errorFunction : Function, beforeFunction: any) => {
|
||||
data = (data == null) ? data : JSON.stringify(data)
|
||||
return $.ajax({
|
||||
/** Call an Ajax function asynchronously */
|
||||
const ajax = (endpoint: string, data: any, method = 'POST', successFunction: Function, errorFunction: Function, beforeFunction: any) => {
|
||||
data = (data == null) ? data : JSON.stringify(data)
|
||||
return $.ajax({
|
||||
url: endpoint,
|
||||
method: method,
|
||||
data: data,
|
||||
success: (response: ajaxResult) => {
|
||||
if (successFunction && response.status == 'success')
|
||||
successFunction(JSON.parse(response.data))
|
||||
else if (errorFunction && response.status != 'success') {
|
||||
errorFunction(JSON.parse(response.data))
|
||||
}
|
||||
},
|
||||
error: (error) => console.log(error.statusCode),
|
||||
beforeSend: beforeFunction
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
For the flow of the app, synchronous is commonly preferred
|
||||
though trying to keep its usage as low as possible.
|
||||
*/
|
||||
const ajaxSync = (endpoint: string, data?: any, method = 'POST') => {
|
||||
const response = JSON.parse(
|
||||
$.ajax({
|
||||
url: endpoint,
|
||||
method: method,
|
||||
data: data,
|
||||
success: (response: ajaxResult) => {
|
||||
if(successFunction && response.status == 'success')
|
||||
successFunction(JSON.parse(response.data))
|
||||
else if (errorFunction && response.status != 'success'){
|
||||
errorFunction(JSON.parse(response.data))
|
||||
}
|
||||
},
|
||||
error: (error) => console.log(error.statusCode),
|
||||
beforeSend: beforeFunction
|
||||
data: JSON.stringify(data),
|
||||
async: false,
|
||||
}).responseText)
|
||||
|
||||
if (response.data) {
|
||||
response.data = JSON.parse(response.data)
|
||||
return response.data
|
||||
}
|
||||
|
||||
return response
|
||||
}
|
||||
|
||||
/* Redirect to a specific URL */
|
||||
const redirect = (url: string): void => location.assign(url)
|
||||
|
||||
const resize = () => {
|
||||
$('#pageContainer').height(window.innerHeight + "px");
|
||||
}
|
||||
|
||||
const setupCore = (languageVars: Record<string, string>) => {
|
||||
Application.languageVars = languageVars
|
||||
const doc = $(document)
|
||||
doc.on('click', '#alertNo, #alertOk', hideAlerts)
|
||||
window.addEventListener('resize', resize)
|
||||
resize()
|
||||
|
||||
setElementVisibilityByMode()
|
||||
}
|
||||
|
||||
|
||||
const posAlert = (message: string, title = 'Message') => {
|
||||
const alertBox = $('#alert')
|
||||
alertBox.css('display', 'flex');
|
||||
alertBox.data('value', '');
|
||||
$('#alertHeading').text(title);
|
||||
$('#alertMessage').text(message);
|
||||
|
||||
$('#alertOk').css('display', 'flex');
|
||||
$('#alertYes').css('display', 'none');
|
||||
$('#alertNo').css('display', 'none');
|
||||
}
|
||||
|
||||
const confirmation = (message: string, data: any, title = 'Confirm', submitFunction = (data: any) => {hideAlerts()}) => {
|
||||
const alert = $('#alert')
|
||||
|
||||
$(document).on('click', '#alert #alertYes', () => {
|
||||
hideAlerts()
|
||||
submitFunction(data)
|
||||
$(document).off('click', '#alert #alertYes')
|
||||
})
|
||||
|
||||
alert.css('display', 'flex')
|
||||
$('#alertHeading').html(title)
|
||||
$('#alertMessage').html(message)
|
||||
|
||||
$('#alertOk').css('display', 'none')
|
||||
$('#alertYes').css('display', 'flex')
|
||||
$('#alertNo').css('display', 'flex')
|
||||
}
|
||||
|
||||
|
||||
const hideAlerts = () => $('#alert').hide()
|
||||
|
||||
const turnOnMode = (mode: PosMode) => {
|
||||
Application.mode.push(mode)
|
||||
setElementVisibilityByMode()
|
||||
}
|
||||
|
||||
const turnOffMode = (mode: PosMode) => {
|
||||
Application.mode = Application.mode.filter((value) => value != mode)
|
||||
setElementVisibilityByMode()
|
||||
}
|
||||
|
||||
const toggleMode = (mode: PosMode) => {
|
||||
if (!isInMode(mode))
|
||||
turnOnMode(mode)
|
||||
else
|
||||
turnOffMode(mode)
|
||||
}
|
||||
|
||||
const clearModes = () => {
|
||||
Application.mode = []
|
||||
setElementVisibilityByMode()
|
||||
}
|
||||
|
||||
const isInMode = (mode: PosMode) => Application.mode.includes(mode)
|
||||
|
||||
const setElementVisibilityByMode = () => {
|
||||
const mode = Application.mode
|
||||
const elements = $('[data-visible-in-mode]')
|
||||
|
||||
elements.each((index, elem) => {
|
||||
const element = $(elem)
|
||||
const visibleInModes: PosModes = element.data('visible-in-mode')
|
||||
|
||||
const showElement = visibleInModes.every(visibleMode => {
|
||||
return mode.includes(visibleMode)
|
||||
});
|
||||
|
||||
if (element.hasClass('useVisibility')) {
|
||||
if (showElement) {
|
||||
element.css('visibility', 'visible')
|
||||
} else element.css('visibility', 'hidden')
|
||||
} else element.toggle(showElement)
|
||||
})
|
||||
|
||||
const invisibleElements = $('[data-invisible-in-mode]')
|
||||
invisibleElements.each((index, elem) => {
|
||||
const element = $(elem)
|
||||
const inVisibleInModes: PosModes = element.data('invisible-in-mode')
|
||||
const hideElement = inVisibleInModes.some(invisibleMode => {
|
||||
return mode.includes(invisibleMode)
|
||||
})
|
||||
element.toggle(!hideElement)
|
||||
})
|
||||
|
||||
|
||||
$('[data-active-in-mode]').each((index, elem) => {
|
||||
const button = $(elem)
|
||||
const activeInMode: PosMode = button.data('active-in-mode')
|
||||
|
||||
mode.includes(activeInMode)
|
||||
? button.addClass('active')
|
||||
: button.removeClass('active')
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
const pulseElement = (element: JQuery) => element.addClass('pulse').on('animationend', () => element.removeClass('pulse'))
|
||||
|
||||
Array.prototype.where = function<x>(this: x[], property: string, value: any) {
|
||||
return this.filter( item => (item as any)[property] === value)[0] || null
|
||||
}
|
||||
|
||||
const money = (amount: number) => currency(amount, {fromCents: true})
|
||||
const moneyFromString = (amount: string) => currency(amount)
|
||||
|
||||
//Id generator.
|
||||
function* newestId(){
|
||||
let id = 0
|
||||
while(true){
|
||||
id++
|
||||
yield id
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
For the flow of the app, synchronous is commonly preferred
|
||||
though trying to keep its usage as low as possible.
|
||||
*/
|
||||
let ajaxSync = (endpoint : string, data?: any, method = 'POST') => {
|
||||
let response = JSON.parse(
|
||||
$.ajax({
|
||||
url: endpoint,
|
||||
method: method,
|
||||
data: JSON.stringify(data),
|
||||
async:false,
|
||||
}).responseText)
|
||||
|
||||
if(response.data) {
|
||||
response.data = JSON.parse(response.data)
|
||||
return response.data
|
||||
}
|
||||
|
||||
return response
|
||||
}
|
||||
|
||||
/* Redirect to a specific URL */
|
||||
let redirect = (url: string) : void => location.assign(url)
|
||||
|
||||
|
||||
|
||||
const resize = () => {
|
||||
$('#pageContainer').height(window.innerHeight + "px");
|
||||
}
|
||||
|
||||
let setupCore = (languageVars: Record<string, string>) => {
|
||||
Application.languageVars = languageVars
|
||||
const doc = $(document)
|
||||
doc.on('click', '#alertNo, #alertOk', hideAlerts)
|
||||
window.addEventListener('resize', resize)
|
||||
resize()
|
||||
|
||||
setElementVisibilityByMode()
|
||||
}
|
||||
|
||||
|
||||
// @ts-ignore
|
||||
let posAlert = (message: string, title='Message') => {
|
||||
let alertBox = $('#alert')
|
||||
alertBox.css('display', 'flex');
|
||||
alertBox.data('value', '');
|
||||
$('#alertHeading').text(title);
|
||||
$('#alertMessage').text(message);
|
||||
|
||||
$('#alertOk').css('display', 'flex');
|
||||
$('#alertYes').css('display', 'none');
|
||||
$('#alertNo').css('display', 'none');
|
||||
}
|
||||
|
||||
let confirmation = (message: string, data: any, title='Confirm', submitFunction = (data: any) => {hideAlerts()}) => {
|
||||
let alert = $('#alert')
|
||||
|
||||
$(document).on('click', '#alert #alertYes', () => {
|
||||
hideAlerts()
|
||||
submitFunction(data)
|
||||
$(document).off('click', '#alert #alertYes')
|
||||
})
|
||||
|
||||
alert.css('display', 'flex')
|
||||
$('#alertHeading').html(title)
|
||||
$('#alertMessage').html(message)
|
||||
|
||||
$('#alertOk').css('display', 'none')
|
||||
$('#alertYes').css('display', 'flex')
|
||||
$('#alertNo').css('display', 'flex')
|
||||
}
|
||||
|
||||
|
||||
let hideAlerts = () => $('#alert').hide()
|
||||
|
||||
let turnOnMode = (mode : PosMode) => {
|
||||
Application.mode.push(mode)
|
||||
setElementVisibilityByMode()
|
||||
}
|
||||
|
||||
let turnOffMode = (mode : PosMode) => {
|
||||
Application.mode = Application.mode.filter((value) => value != mode)
|
||||
setElementVisibilityByMode()
|
||||
|
||||
}
|
||||
|
||||
let toggleMode = (mode: PosMode) => {
|
||||
if(!isInMode(mode))
|
||||
turnOnMode(mode)
|
||||
else
|
||||
turnOffMode(mode)
|
||||
}
|
||||
|
||||
let clearModes = () => {Application.mode = []}
|
||||
let isInMode = (mode: PosMode) => Application.mode.includes(mode)
|
||||
|
||||
let setElementVisibilityByMode = () => {
|
||||
const mode = Application.mode
|
||||
const elements = $('[data-visible-in-mode]')
|
||||
|
||||
elements.each((index, elem) => {
|
||||
let element = $(elem)
|
||||
let visibleInModes : PosModes = element.data('visible-in-mode')
|
||||
|
||||
let showElement = visibleInModes.every( visibleMode => {
|
||||
return mode.includes(visibleMode)
|
||||
});
|
||||
|
||||
if(element.hasClass('useVisibility')){
|
||||
if(showElement) {
|
||||
element.css('visibility', 'visible')
|
||||
} else element.css('visibility', 'hidden')
|
||||
} else element.toggle(showElement)
|
||||
})
|
||||
|
||||
const invisibleElements = $('[data-invisible-in-mode]')
|
||||
invisibleElements.each((index, elem) => {
|
||||
let element = $(elem)
|
||||
let inVisibleInModes: PosModes = element.data('invisible-in-mode')
|
||||
let hideElement = inVisibleInModes.some(invisibleMode => {
|
||||
return mode.includes(invisibleMode)
|
||||
})
|
||||
element.toggle(!hideElement)
|
||||
})
|
||||
|
||||
|
||||
$('[data-active-in-mode]').each((index, elem) =>{
|
||||
const button = $(elem)
|
||||
const activeInMode : PosMode = button.data('active-in-mode')
|
||||
|
||||
mode.includes(activeInMode)
|
||||
? button.addClass('active')
|
||||
: button.removeClass('active')
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
$( () => ajax('/ajax/languageVars', null, 'GET', setupCore, null, null))
|
||||
$(() => ajax('/ajax/languageVars', null, 'GET', setupCore, null, null))
|
||||
@@ -1,9 +1,25 @@
|
||||
interface OrderScreen{
|
||||
type OrderScreenData = {
|
||||
order_screen_pages: order_screen_page[]
|
||||
sales_categories: sales_category[]
|
||||
}
|
||||
|
||||
|
||||
type OrderScreen = {
|
||||
order_screen_pages: order_screen_page[]
|
||||
last_added_item: orderItem
|
||||
order_items: orderItem[]
|
||||
sales_categories: sales_category[]
|
||||
order_item_id_generator: Generator
|
||||
selected_item_ids: number[]
|
||||
}
|
||||
|
||||
let OrderScreen : OrderScreen = {
|
||||
order_screen_pages: null
|
||||
order_screen_pages: null,
|
||||
last_added_item: null,
|
||||
order_items: [],
|
||||
sales_categories: [],
|
||||
order_item_id_generator: newestId(),
|
||||
selected_item_ids: []
|
||||
}
|
||||
|
||||
const loadPageGroup = (e: Event) => {
|
||||
@@ -14,6 +30,7 @@ const loadPageGroup = (e: Event) => {
|
||||
$('.pageGroup').hide()
|
||||
let activeGrid = $(`.pageGroup[data-page-group-id=${pageGroupId}]`)
|
||||
let navButtons = $('.pageNavigation')
|
||||
navButtons.css('display', 'flex')
|
||||
|
||||
activeGrid.find('.gridPage').length > 1
|
||||
? navButtons.show()
|
||||
@@ -22,12 +39,20 @@ const loadPageGroup = (e: Event) => {
|
||||
activeGrid.css('display', 'inline-flex')
|
||||
}
|
||||
|
||||
const setupOrderScreen = (data: OrderScreen) => {
|
||||
OrderScreen = data
|
||||
const setupOrderScreen = (data: OrderScreenData) => {
|
||||
OrderScreen.order_screen_pages = data.order_screen_pages
|
||||
OrderScreen.sales_categories = data.sales_categories
|
||||
let doc = $(document)
|
||||
doc.on('click', '.nextButton', goToNextPage)
|
||||
doc.on('click', '.prevButton', goToPrevPage)
|
||||
doc.on('click', '.loadPageGroup', loadPageGroup)
|
||||
doc.on('click', '[data-primary-action=item]', itemButtonClicked)
|
||||
doc.on('click', 'tr', itemRowClicked)
|
||||
doc.on('click', '.voidButton', voidButtonClicked)
|
||||
doc.on('dblclick', '.voidButton', voidLastItem)
|
||||
doc.on('click', '.accumulateButton', () => toggleMode('accumulate'))
|
||||
|
||||
turnOnMode('accumulate')
|
||||
|
||||
$('.loadPageGroup').first().trigger('click')
|
||||
}
|
||||
@@ -43,5 +68,204 @@ const navigatePage = (direction: number) => {
|
||||
const goToNextPage = () => navigatePage(1)
|
||||
const goToPrevPage = () => navigatePage(-1)
|
||||
|
||||
const addNewItem = (item: item) => {
|
||||
let salesCategory = OrderScreen.sales_categories.where('id', item.item_category)
|
||||
const existingOrderItem = isInMode('accumulate') && item.item_type != 'instruction' ? OrderScreen.order_items.where('item', item) : null
|
||||
let orderItem : orderItem = existingOrderItem || {
|
||||
id: OrderScreen.order_item_id_generator.next().value,
|
||||
item: item,
|
||||
qty: 0,
|
||||
sales_category: salesCategory,
|
||||
}
|
||||
|
||||
saveOrderItem(orderItem)
|
||||
renderOrderBox()
|
||||
}
|
||||
|
||||
const renderOrderBox = () => {
|
||||
const orderBox = $('.orderBoxTable')
|
||||
const tbody = orderBox.children('tbody')
|
||||
const newTbody = $('<tbody />')
|
||||
OrderScreen.order_items.forEach(orderItem => {
|
||||
const newRow = createOrderRow(orderItem)
|
||||
newTbody.append(newRow)
|
||||
if(orderItem.id == OrderScreen.last_added_item?.id){
|
||||
pulseElement(newRow)
|
||||
}
|
||||
|
||||
if(OrderScreen.selected_item_ids.includes(orderItem.id)){
|
||||
selectRow(newRow)
|
||||
}
|
||||
})
|
||||
|
||||
tbody.replaceWith(newTbody)
|
||||
const element = orderBox.find('tbody tr').last().get()[0]
|
||||
element.scrollIntoView()
|
||||
OrderScreen.last_added_item = null
|
||||
}
|
||||
|
||||
const createOrderRow = (orderItem: orderItem) => {
|
||||
const row = $('.orderBoxTable').EmptyRow()
|
||||
const price = money(orderItem.item.price1)
|
||||
row.data('order-item-id', orderItem.id)
|
||||
row.addClass(`${orderItem.item.item_type}Row`)
|
||||
row
|
||||
.setColumnValue(lang('qty_header'), orderItem.qty)
|
||||
.setColumnValue(lang('item_header'), orderItem.item.item_name)
|
||||
.setColumnValue(lang('price_header'), price)
|
||||
.setColumnValue(lang('total_price_header'), price)
|
||||
.setColumnValue(lang('printgroup_header'), OrderScreen.sales_categories.where('id', orderItem.item.item_category)?.name)
|
||||
.data('order-item-id', orderItem.id)
|
||||
|
||||
return row
|
||||
}
|
||||
|
||||
const saveOrderItem = (orderItem: orderItem) => {
|
||||
const selectedRows = $('.orderBoxTable tbody tr.selected').get()
|
||||
const currentQty = orderItem.qty
|
||||
orderItem.qty = currentQty + 1
|
||||
if( isInMode('accumulate') && orderItem.qty > 1) {
|
||||
OrderScreen.order_items = OrderScreen.order_items.map(
|
||||
existingOrderItem => {
|
||||
if (existingOrderItem == orderItem) return orderItem
|
||||
else return existingOrderItem
|
||||
})
|
||||
} else if(orderItem.item.item_type == 'instruction' && selectedRows.length > 0){
|
||||
const selectedOrderItemIds : number[] = selectedRows.map(row => {
|
||||
const orderItem = OrderScreen.order_items.where('id', $(row).data('order-item-id'))
|
||||
if (orderItem.item && orderItem.item.item_type != 'instruction') {
|
||||
return orderItem.id
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
}).filter(number => number)
|
||||
|
||||
selectedOrderItemIds.forEach(id => {
|
||||
let item = OrderScreen.order_items.where('id', id)
|
||||
let index = OrderScreen.order_items.indexOf(item) + 1
|
||||
OrderScreen.order_items.splice(index, 0, orderItem)
|
||||
})
|
||||
|
||||
} else {
|
||||
OrderScreen.order_items.push(orderItem)
|
||||
}
|
||||
|
||||
OrderScreen.last_added_item = orderItem
|
||||
|
||||
return orderItem
|
||||
}
|
||||
|
||||
|
||||
const itemButtonClicked = (e: JQuery.TriggeredEvent) => {
|
||||
const existingItemRows = $('.itemRow')
|
||||
const button = $(e.target).closest('.posButton')
|
||||
const item : item = button.data('item')
|
||||
|
||||
if(item.item_type == 'instruction' && existingItemRows.length < 1) return
|
||||
|
||||
addNewItem(item)
|
||||
|
||||
}
|
||||
|
||||
|
||||
const itemRowClicked = (e: JQuery.TriggeredEvent) => {
|
||||
const row = $(e.target).closest('tr')
|
||||
|
||||
if(isInMode('void')){
|
||||
voidRows(row)
|
||||
turnOffMode('void')
|
||||
return
|
||||
}
|
||||
|
||||
if(!row.hasClass('selected')) selectRow(row)
|
||||
else deselectRow(row)
|
||||
|
||||
}
|
||||
|
||||
const selectRow = (row: JQuery) => {
|
||||
row.addClass('selected')
|
||||
const id = row.data('order-item-id')
|
||||
if(!OrderScreen.selected_item_ids.includes(id))
|
||||
OrderScreen.selected_item_ids.push(id)
|
||||
|
||||
const instructionRows = row.nextUntil('.itemRow')
|
||||
|
||||
if(row.hasClass('itemRow') && instructionRows.length){
|
||||
instructionRows.each((index, row) => {
|
||||
selectRow($(row))
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const deselectRow = (row: JQuery) => {
|
||||
row.removeClass('selected')
|
||||
const instructionRows = row.nextUntil('.itemRow')
|
||||
OrderScreen.selected_item_ids = OrderScreen.selected_item_ids.filter(id => id != row.data('order-item-id'))
|
||||
|
||||
if(row.hasClass('itemRow') && instructionRows.length){
|
||||
deselectRow(instructionRows)
|
||||
}
|
||||
}
|
||||
|
||||
const deleteRow = (row: JQuery) => row.find('*:not(.hidden)').slideUp('fast', () => {
|
||||
OrderScreen.order_items = OrderScreen.order_items.filter(orderItem => orderItem.id != row.data('order-item-id'))
|
||||
row.remove()
|
||||
})
|
||||
|
||||
const voidInstructionRow = (row: JQuery) => {
|
||||
const parentRow = row.prevAll('.itemRow').first()
|
||||
const parentOrderItem = OrderScreen.order_items.where('id', parentRow.data('order-item-id'))
|
||||
if(!parentRow.hasClass('selected') || (parentOrderItem && parentOrderItem?.qty == 0) || !parentOrderItem)
|
||||
decrementQty(OrderScreen.order_items.where('id', row.data('order-item-id')))
|
||||
}
|
||||
|
||||
const voidItemRow = (row : JQuery) => {
|
||||
const newQty = Number(row.getColumnValue(lang('qty_header'))) - 1
|
||||
const orderItem = OrderScreen.order_items.where('id', row.data('order-item-id'))
|
||||
const instructionRows = row.nextUntil('.itemRow')
|
||||
|
||||
if(newQty < 1)
|
||||
voidRows(instructionRows)
|
||||
|
||||
decrementQty(orderItem)
|
||||
}
|
||||
|
||||
const voidRow = (row: JQuery) => {
|
||||
if(row.hasClass('itemRow')) voidItemRow(row)
|
||||
else voidInstructionRow(row)
|
||||
}
|
||||
|
||||
const voidRows = (rows: JQuery) => rows.each((index, row) => voidRow($(row)))
|
||||
|
||||
const voidButtonClicked = () => {
|
||||
const selectedRows = $('.orderBox tr.selected')
|
||||
if(isInMode('void')){
|
||||
turnOffMode('void')
|
||||
} else if(selectedRows.length){
|
||||
voidRows(selectedRows)
|
||||
} else {
|
||||
turnOnMode('void')
|
||||
}
|
||||
}
|
||||
|
||||
const voidLastItem = () => {
|
||||
if(OrderScreen.order_items.length < 1) return
|
||||
let orderItem = OrderScreen.order_items[OrderScreen.order_items.length-1]
|
||||
let row = getOrderItemRow(orderItem)
|
||||
voidRows(row)
|
||||
}
|
||||
|
||||
const decrementQty = (orderItem: orderItem) => {
|
||||
const row = getOrderItemRow(orderItem)
|
||||
if(orderItem.qty <= 1){
|
||||
OrderScreen.order_items = OrderScreen.order_items.filter(item => item != orderItem)
|
||||
deleteRow(row)
|
||||
} else {
|
||||
orderItem.qty--
|
||||
row.setColumnValue(lang('qty_header'), orderItem.qty)
|
||||
}
|
||||
}
|
||||
|
||||
const getOrderItemRow = (orderItem: orderItem) => $('tr').filterByData('order-item-id', orderItem.id)
|
||||
|
||||
$(() => ajax('/orderScreen/getOrderScreenData/1', null, 'get', setupOrderScreen, null, null) )
|
||||
47
wwwroot/scripts/ts/dredgepos.tables.ts
Normal file
47
wwwroot/scripts/ts/dredgepos.tables.ts
Normal file
@@ -0,0 +1,47 @@
|
||||
interface JQuery {
|
||||
getColumnValue(columnHeading: string) : string
|
||||
setColumnValue(columnHeading: string, value: any) : JQuery
|
||||
getColumnIndex(columnHeading: string) : number
|
||||
EmptyRow() : JQuery<HTMLTableRowElement>
|
||||
filterByData(prop: string, value: any) : JQuery
|
||||
}
|
||||
|
||||
$.fn.EmptyRow = function(this: JQuery) {
|
||||
const headingRow = this.find('th').first().closest('tr')
|
||||
const headingCells = headingRow.find('th')
|
||||
const newRow = $('<tr/>')
|
||||
headingCells.each( (index, cell) => {
|
||||
const newCell = $('<td/>')
|
||||
const attributes = Array.from(cell.attributes)
|
||||
newCell.data('column', cell.innerText.trim())
|
||||
newCell.data('column-index', index)
|
||||
attributes.forEach(attribute => newCell.attr(attribute.name, attribute.value))
|
||||
newRow.append(newCell)
|
||||
})
|
||||
|
||||
return newRow as JQuery<HTMLTableRowElement>
|
||||
}
|
||||
|
||||
$.fn.getColumnIndex = function(this: JQuery, columnHeading: string){
|
||||
return this
|
||||
.find('td')
|
||||
.filterByData('column', columnHeading)
|
||||
.data('column-index')
|
||||
}
|
||||
|
||||
$.fn.getColumnValue = function(this: JQuery, columnHeading: string){
|
||||
return this.find('td').filterByData('column', columnHeading).text()
|
||||
}
|
||||
|
||||
$.fn.setColumnValue = function(this: JQuery, columnHeading: string, value: any){
|
||||
this.find('td').filterByData('column', columnHeading).text(value)
|
||||
return this
|
||||
}
|
||||
|
||||
$.fn.filterByData = function(prop: string, val: any) {
|
||||
return this.filter(
|
||||
function() {
|
||||
return $(this).data(prop)==val
|
||||
}
|
||||
)
|
||||
}
|
||||
@@ -1,6 +1,25 @@
|
||||
type PosMode = "edit" | "void" | "transfer" | "default" | "tableSelected" | "decorationSelected" | "activeTableSelected" | "merge" | "reservedTableSelected"
|
||||
type PosMode = "edit" | "void" | "transfer" | "default" | "tableSelected" | "decorationSelected" | "activeTableSelected" | "merge" | "reservedTableSelected" | "accumulate"
|
||||
type PosModes = PosMode[]
|
||||
|
||||
interface order {
|
||||
clerk: string
|
||||
split: boolean
|
||||
items: orderItem[]
|
||||
}
|
||||
|
||||
interface orderItem {
|
||||
id: number,
|
||||
qty: number,
|
||||
sales_category: sales_category
|
||||
item: item
|
||||
}
|
||||
|
||||
interface printGroup {
|
||||
id: number,
|
||||
name: string,
|
||||
printer: number,
|
||||
venue_id: number,
|
||||
}
|
||||
|
||||
interface ajaxResult {
|
||||
status: string
|
||||
@@ -69,3 +88,27 @@ interface keyboard {
|
||||
interface order_screen_page{id: number; order_screen_page_group_id: number; grid_id: number}
|
||||
interface grid {id: number; grid_name: string; grid_rows: number; grid_cols: number; grid_data: string}
|
||||
|
||||
interface item {
|
||||
id: number
|
||||
item_code: string
|
||||
item_category: number
|
||||
item_name: string
|
||||
item_type: string
|
||||
price1: number
|
||||
price2: number
|
||||
price3: number
|
||||
price4: number
|
||||
price5: number
|
||||
}
|
||||
|
||||
type sales_category = {
|
||||
id: number
|
||||
parent: number
|
||||
name: string
|
||||
print_group: string
|
||||
venue_id: number
|
||||
}
|
||||
|
||||
interface Array<T> {
|
||||
where(property: string, value: any): T
|
||||
}
|
||||
36
wwwroot/scripts/ts/typings/currency.d.ts
vendored
36
wwwroot/scripts/ts/typings/currency.d.ts
vendored
@@ -1,26 +1,26 @@
|
||||
declare namespace currency {
|
||||
declare namespace currency {
|
||||
type Any = number | string | currency;
|
||||
type Format = (currency?: currency, opts?: Options) => string;
|
||||
interface Constructor {
|
||||
(value: currency.Any, opts?: currency.Options): currency,
|
||||
new(value: currency.Any, opts?: currency.Options): currency
|
||||
(value: currency.Any, opts?: currency.Options): currency,
|
||||
new(value: currency.Any, opts?: currency.Options): currency
|
||||
}
|
||||
interface Options {
|
||||
symbol?: string,
|
||||
separator?: string,
|
||||
decimal?: string,
|
||||
errorOnInvalid?: boolean,
|
||||
precision?: number,
|
||||
increment?: number,
|
||||
useVedic?: boolean,
|
||||
pattern?: string,
|
||||
negativePattern?: string,
|
||||
format?: currency.Format,
|
||||
fromCents?: boolean
|
||||
symbol?: string,
|
||||
separator?: string,
|
||||
decimal?: string,
|
||||
errorOnInvalid?: boolean,
|
||||
precision?: number,
|
||||
increment?: number,
|
||||
useVedic?: boolean,
|
||||
pattern?: string,
|
||||
negativePattern?: string,
|
||||
format?: currency.Format,
|
||||
fromCents?: boolean
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
interface currency {
|
||||
interface currency {
|
||||
add(number: currency.Any): currency;
|
||||
subtract(number: currency.Any): currency;
|
||||
multiply(number: currency.Any): currency;
|
||||
@@ -33,6 +33,6 @@
|
||||
toJSON(): number;
|
||||
readonly intValue: number;
|
||||
readonly value: number;
|
||||
}
|
||||
}
|
||||
|
||||
declare const currency: currency.Constructor;
|
||||
declare const currency: currency.Constructor;
|
||||
|
||||
Reference in New Issue
Block a user