From 539348bbbb27a3804bc8defe37adcf065e8ee265 Mon Sep 17 00:00:00 2001 From: Laurent Destailleur Date: Mon, 27 Jan 2020 01:31:39 +0100 Subject: [PATCH] Responsive TakePOS with Bar. --- htdocs/langs/en_US/cashdesk.lang | 1 + htdocs/takepos/admin/setup.php | 9 ++++ htdocs/takepos/css/pos.css | 85 ++++++++++++++++++++++++++++---- htdocs/takepos/takepos.php | 61 ++++++++++++++++++----- 4 files changed, 136 insertions(+), 20 deletions(-) diff --git a/htdocs/langs/en_US/cashdesk.lang b/htdocs/langs/en_US/cashdesk.lang index 964bd7c436c..8c34ef482a4 100644 --- a/htdocs/langs/en_US/cashdesk.lang +++ b/htdocs/langs/en_US/cashdesk.lang @@ -81,3 +81,4 @@ CustomReceipt=Custom Receipt ReceiptName=Receipt Name ProductSupplements=Product Supplements SupplementCategory=Supplement category +HeadBar=Head Bar \ No newline at end of file diff --git a/htdocs/takepos/admin/setup.php b/htdocs/takepos/admin/setup.php index ebd0e0659e4..691451ced50 100644 --- a/htdocs/takepos/admin/setup.php +++ b/htdocs/takepos/admin/setup.php @@ -82,6 +82,7 @@ if (GETPOST('action', 'alpha') == 'set') $res = dolibarr_set_const($db, "TAKEPOS_NUM_TERMINALS", GETPOST('TAKEPOS_NUM_TERMINALS', 'alpha'), 'chaine', 0, '', $conf->entity); $res = dolibarr_set_const($db, "TAKEPOS_DIRECT_PAYMENT", GETPOST('TAKEPOS_DIRECT_PAYMENT', 'int'), 'int', 0, '', $conf->entity); $res = dolibarr_set_const($db, "TAKEPOS_CUSTOM_RECEIPT", GETPOST('TAKEPOS_CUSTOM_RECEIPT', 'int'), 'int', 0, '', $conf->entity); + //$res = dolibarr_set_const($db, "TAKEPOS_HEAD_BAR", GETPOST('TAKEPOS_HEAD_BAR', 'int'), 'int', 0, '', $conf->entity); $res = dolibarr_set_const($db, "TAKEPOS_EMAIL_TEMPLATE_INVOICE", GETPOST('TAKEPOS_EMAIL_TEMPLATE_INVOICE', 'alpha'), 'chaine', 0, '', $conf->entity); if (!empty($conf->global->TAKEPOS_ENABLE_SUMUP)) { $res = dolibarr_set_const($db, "TAKEPOS_SUMUP_AFFILIATE", GETPOST('TAKEPOS_SUMUP_AFFILIATE', 'alpha'), 'chaine', 0, '', $conf->entity); @@ -270,6 +271,14 @@ print ''; print $form->selectyesno("TAKEPOS_CUSTOM RECEIPT", $conf->global->TAKEPOS_CUSTOM_RECEIPT, 1); print "\n"; +// Head Bar +/*print ''; +print $langs->trans('HeadBar'); +print ''; +print $form->selectyesno("TAKEPOS_HEAD_BAR", $conf->global->TAKEPOS_HEAD_BAR, 1); +print "\n"; +*/ + // Email template for send invoice print ''; print $langs->trans('EmailTemplate'); diff --git a/htdocs/takepos/css/pos.css b/htdocs/takepos/css/pos.css index e8e53a0c8bf..5e32381d0a5 100644 --- a/htdocs/takepos/css/pos.css +++ b/htdocs/takepos/css/pos.css @@ -1,6 +1,6 @@ html,body { box-sizing: border-box; - padding:3px; + padding:0px; margin:0; height:100%; width:100%; @@ -35,7 +35,7 @@ button.calcbutton { text-align: center; overflow: visible; /* removes extra width in IE */ width: calc(25% - 2px); - height: 24%; + height: calc(25% - 2px); font-weight: bold; background-color: #8c907e; color: #fff; @@ -57,7 +57,7 @@ button.calcbutton2 { text-align: center; overflow: visible; /* removes extra width in IE */ width: calc(25% - 2px); - height: 24%; + height: calc(25% - 2px); font-weight: bold; } @@ -72,7 +72,7 @@ button.calcbutton3 { font-size:120%; overflow: visible; /* removes extra width in IE */ width: calc(25% - 2px); - height: 24%; + height: calc(25% - 2px); } button.actionbutton { @@ -91,7 +91,7 @@ button.actionbutton { text-align: center; overflow: visible; /* removes extra width in IE */ width:33%; - height:24%; + height: calc(25% - 2px); } .takepospay { @@ -107,7 +107,7 @@ div.wrapper{ float:left; /* important */ position:relative; /* important(so we can absolutely position the description div */ width:25%; - height:25%; + height:33%; margin:0; padding:1px; border: 2px solid #EEE; @@ -121,7 +121,7 @@ div.wrapper2{ float:left; /* important */ position:relative; /* important(so we can absolutely position the description div */ width:12.5%; - height:25%; + height:33%; margin:0; /* padding:1px; */ border: 2px solid #EEE; @@ -206,12 +206,25 @@ div.paymentbordline height: 34%; } +.row1withhead{ + margin: 0 auto; + width: 100%; + height: calc(50% - 35px); + padding-top: 5px; +} + .row2{ margin: 0 auto; width: 100%; height: 66%; } +.row2withhead{ + margin: 0 auto; + width: 100%; + height: 50%; +} + .div1{ height:100%; width: 34%; @@ -221,9 +234,10 @@ div.paymentbordline overflow: auto; /* background-color:white; */ padding-top: 0; - padding-bottom: 10px; + padding-bottom: 0; padding-right: 5px; padding-left: 5px; + min-height: 180px; } .div2{ @@ -233,7 +247,7 @@ div.paymentbordline float: left; box-sizing: border-box; padding-top: 0; - padding-bottom: 10px; + padding-bottom: 0; padding-right: 5px; padding-left: 5px; min-height: 180px; @@ -325,6 +339,45 @@ div.description_content { padding-right: 2px; } +.header{ + margin: 0 auto; + width: 100%; + height: 35px; + background: rgb(60,70,100); +} + +.topnav{ + background-color: rgb(60,70,100); + overflow: hidden; + height: 100%; +} + +.topnav a{ + float: left; + color: #f2f2f2; + text-align: center; + padding: 6px 16px; + text-decoration: none; + font-size: 17px; +} + +.topnav a:hover{ + background-color: #ddd; + color: black; +} + +.topnav-right{ + float: right; +} + +.topnav input[type="text"] { + background-color: #fff; + color: #000; + float: left; + border-bottom: none !important; + margin-top: 4px; +} + @media screen and (min-width: 892px) { .calcbutton{ font-size: 18px; @@ -382,6 +435,12 @@ div.description_content { /* For small screens */ @media screen and (max-width: 767px) { + .topnav-right { + float: unset; + } + .header { + height: unset; + } div.container { overflow-x: scroll; } @@ -392,6 +451,10 @@ div.description_content { width: 25%; } + div.div1 { + padding-bottom: 0; + margin-bottom: 10px; + } div.div1, div.div2, div.div3 { width: 100%; } @@ -404,6 +467,10 @@ div.description_content { min-height: unset; } + div.div3 { + height: unset; + } + button.calcbutton, button.calcbutton2 { min-height: 30px; } diff --git a/htdocs/takepos/takepos.php b/htdocs/takepos/takepos.php index 0508cecbb9d..0b10b9a2c23 100644 --- a/htdocs/takepos/takepos.php +++ b/htdocs/takepos/takepos.php @@ -54,8 +54,8 @@ $langs->loadLangs(array("bills", "orders", "commercial", "cashdesk", "receiptpri $categorie = new Categorie($db); -$maxcategbydefaultforthisdevice = 16; -$maxproductbydefaultforthisdevice = 32; +$maxcategbydefaultforthisdevice = 12; +$maxproductbydefaultforthisdevice = 24; if ($conf->browser->layout == 'phone') { $maxcategbydefaultforthisdevice = 8; @@ -622,6 +622,10 @@ function DirectPayment(){ }); } +function FullScreen() { + document.documentElement.requestFullscreen(); +} + $( document ).ready(function() { PrintCategories(0); LoadProducts(0); @@ -642,7 +646,35 @@ $( document ).ready(function() { if ($conf->global->TAKEPOS_NUM_TERMINALS != "1" && $_SESSION["takeposterminal"] == "") print '
'.$langs->trans('TerminalSelect').'
'; ?>
-
+ +global->TAKEPOS_HIDE_HEAD_BAR)) { +?> + + + +
@@ -710,7 +742,9 @@ else $menus[$r++] = array('title'=>'
'.$langs->trans("Place").'
', 'action'=>'Floors();'); } -$menus[$r++] = array('title'=>'
'.$langs->trans("Customer").'
', 'action'=>'Customer();'); +if (! empty($conf->global->TAKEPOS_HIDE_HEAD_BAR)) { + $menus[$r++] = array('title'=>'
'.$langs->trans("Customer").'
', 'action'=>'Customer();'); +} $menus[$r++] = array('title'=>'
'.$langs->trans("History").'
', 'action'=>'History();'); $menus[$r++] = array('title'=>'
'.$langs->trans("FreeZone").'
', 'action'=>'FreeZone();'); $menus[$r++] = array('title'=>'
'.$langs->trans("Payment").'
', 'action'=>'CloseBill();'); @@ -764,7 +798,10 @@ if (!empty($reshook)) { if ($r % 3 == 2) $menus[$r++]=array('title'=>'', 'style'=>'visibility: hidden;'); $menus[$r++]=array('title'=>'
'.$langs->trans("BackOffice").'
', 'action'=>'window.open(\''.(DOL_URL_ROOT ? DOL_URL_ROOT : '/').'\', \'_backoffice\');'); -$menus[$r++]=array('title'=>'
'.$langs->trans("Logout").'
', 'action'=>'window.location.href=\''.DOL_URL_ROOT.'/user/logout.php\';'); + +if (! empty($conf->global->TAKEPOS_HIDE_HEAD_BAR)) { + $menus[$r++]=array('title'=>'
'.$langs->trans("Logout").'
', 'action'=>'window.location.href=\''.DOL_URL_ROOT.'/user/logout.php\';'); +} ?> @@ -783,16 +820,18 @@ $menus[$r++]=array('title'=>'< else echo ''; } - print ''."\n"; - print '
'; - print ' '; - print ''.img_picto('', 'searchclear').''; - print '
'; + if (! empty($conf->global->TAKEPOS_HIDE_HEAD_BAR)) { + print ''."\n"; + print '
'; + print ' '; + print ''.img_picto('', 'searchclear').''; + print '
'; + } ?>
-
+