Wed, 23 Jan 2019 22:36:31 +0100
Switches yeasts inventory to indexed names and translations. Database save is using POST instead of GET. Redesigned the web page. Added total cost display which updates on inventory changes.
--- a/README.design Wed Jan 23 19:43:55 2019 +0100 +++ b/README.design Wed Jan 23 22:36:31 2019 +0100 @@ -39,7 +39,7 @@ inventory_miscs Ok. inventory_suppliers Ok. Ok. inventory_water Ok. Ok. -inventory_yeasts Ok. Ok. +inventory_yeasts Ok. Ok. Ok. Ok. Ok. Ok. profile_mash Ok. Ok. profile_profiles Ok. Ok. Ok. profile_styles Ok. Ok.
--- a/www/import/from_brouwhulp.php Wed Jan 23 19:43:55 2019 +0100 +++ b/www/import/from_brouwhulp.php Wed Jan 23 22:36:31 2019 +0100 @@ -223,15 +223,53 @@ foreach ($yeasts->YEAST as $yeast) { $sql = "INSERT INTO inventory_yeasts SET name='" . mysqli_real_escape_string($db, $yeast->NAME); - $sql .= "', type='" . $yeast->TYPE; - $sql .= "', form='" . $yeast->FORM; + + if ($yeast->TYPE == 'Lager') + $sql .= "', type='0"; + else if ($yeast->TYPE == 'Ale') + $sql .= "', type='1"; + else if ($yeast->TYPE == 'Wheat') + $sql .= "', type='2"; + else if ($yeast->TYPE == 'Wine') + $sql .= "', type='3"; + else if ($yeast->TYPE == 'Champagne') + $sql .= "', type='4"; + else + echo "Unknown TYPE " . $yeast->TYPE . PHP_EOL; + + if ($yeast->FORM == 'Liquid') + $sql .= "', form='0"; + else if ($yeast->FORM == 'Dry') + $sql .= "', form='1"; + else if ($yeast->FORM == 'Slant') + $sql .= "', form='2"; + else if ($yeast->FORM == 'Culture') + $sql .= "', form='3"; + else if ($yeast->FORM == 'Frozen') + $sql .= "', form='4"; + else if ($yeast->FORM == 'Bottle') + $sql .= "', form='5"; + else + echo "Unknown FORM " . $yeast->FORM . PHP_EOL; + $sql .= "', laboratory='" . mysqli_real_escape_string($db, $yeast->LABORATORY); $sql .= "', product_id='" . mysqli_real_escape_string($db, $yeast->PRODUCT_ID); if ($yeast->MIN_TEMPERATURE) $sql .= "', min_temperature='" . floatval($yeast->MIN_TEMPERATURE); if ($yeast->MAX_TEMPERATURE) $sql .= "', max_temperature='" . floatval($yeast->MAX_TEMPERATURE); - $sql .= "', flocculation='" . $yeast->FLOCCULATION; + + if ($yeast->FLOCCULATION == 'Low') + $sql .= "', flocculation='0"; + else if ($yeast->FLOCCULATION == 'Medium') + $sql .= "', flocculation='1"; + else if ($yeast->FLOCCULATION == 'High') + $sql .= "', flocculation='2"; + else if ($yeast->FLOCCULATION == 'Very high') + $sql .= "', flocculation='3"; + else + echo "Unknown FLOCCULATION " . $yeast->FLOCCULATION . PHP_EOL; + if ($yeast->ATTENUATION) $sql .= "', attenuation='" . floatval($yeast->ATTENUATION); $sql .= "', notes='" . mysqli_real_escape_string($db, $yeast->NOTES);
--- a/www/includes/db_inventory_yeasts.php Wed Jan 23 19:43:55 2019 +0100 +++ b/www/includes/db_inventory_yeasts.php Wed Jan 23 22:36:31 2019 +0100 @@ -11,74 +11,71 @@ mysqli_set_charset($connect, "utf8" ); // get data and store in a json array -$query = "SELECT * FROM inventory_yeasts ORDER BY laboratory,product_id,name"; -if (isset($_GET['insert'])) { - // INSERT COMMAND - $sql = "INSERT INTO `inventory_yeasts` SET name='" . mysqli_real_escape_string($connect, $_GET['name']); - $sql .= "', type='" . $_GET['type']; - $sql .= "', form='" . $_GET['form']; - $sql .= "', laboratory='" . mysqli_real_escape_string($connect, $_GET['laboratory']); - $sql .= "', product_id='" . mysqli_real_escape_string($connect, $_GET['product_id']); - $sql .= "', min_temperature='" . $_GET['min_temperature']; - $sql .= "', max_temperature='" . $_GET['max_temperature']; - $sql .= "', flocculation='" . $_GET['flocculation']; - $sql .= "', attenuation='" . $_GET['attenuation']; - $sql .= "', notes='" . mysqli_real_escape_string($connect, $_GET['notes']); - $sql .= "', best_for='" . mysqli_real_escape_string($connect, $_GET['best_for']); - $sql .= "', max_reuse='" . $_GET['max_reuse']; - $sql .= "', inventory='" . floatval($_GET['inventory']) / 1000.0; - $sql .= "', cost='" . $_GET['cost']; - $sql .= "', production_date='" . $_GET['production_date']; - $sql .= "', tht_date='" . $_GET['tht_date']; - $sql .= "';"; +if (isset($_POST['insert']) || isset($_POST['update'])) { + if (isset($_POST['insert'])) { + $sql = "INSERT INTO `inventory_yeasts` SET "; + } + if (isset($_POST['update'])) { + $sql = "UPDATE `inventory_yeasts` SET "; + } + + $sql .= "name='" . mysqli_real_escape_string($connect, $_POST['name']); + $sql .= "', type='" . $_POST['type']; + $sql .= "', form='" . $_POST['form']; + $sql .= "', laboratory='" . mysqli_real_escape_string($connect, $_POST['laboratory']); + $sql .= "', product_id='" . mysqli_real_escape_string($connect, $_POST['product_id']); + $sql .= "', min_temperature='" . $_POST['min_temperature']; + $sql .= "', max_temperature='" . $_POST['max_temperature']; + $sql .= "', flocculation='" . $_POST['flocculation']; + $sql .= "', attenuation='" . $_POST['attenuation']; + $sql .= "', notes='" . mysqli_real_escape_string($connect, $_POST['notes']); + $sql .= "', best_for='" . mysqli_real_escape_string($connect, $_POST['best_for']); + $sql .= "', max_reuse='" . $_POST['max_reuse']; + $sql .= "', inventory='" . floatval($_POST['inventory']) / 1000.0; + $sql .= "', cost='" . $_POST['cost'] . "'"; + if ($_POST['production_date'] == '') + $sql .= ", production_date=NULL"; + else + $sql .= ", production_date='" . $_POST['production_date'] . "'"; + if ($_POST['tht_date'] == '') + $sql .= ", tht_date=NULL"; + else + $sql .= ", tht_date='" . $_POST['tht_date'] . "'"; + if (isset($_POST['insert'])) { + $sql .= ";"; + } + if (isset($_POST['update'])) { + $sql .= " WHERE record='" . $_POST['record'] . "';"; + } + syslog(LOG_NOTICE, $sql); + $result = mysqli_query($connect, $sql); if (! $result) { syslog(LOG_NOTICE, "db_inventory_yeasts: ".$sql." result: ".mysqli_error($connect)); } else { - syslog(LOG_NOTICE, "db_inventory_yeasts: inserted ".$_GET['name']); + if (isset($_POST['update'])) { + syslog(LOG_NOTICE, "db_inventory_yeasts: updated record ".$_POST['record']); + } else { + $lastid = mysqli_insert_id($connect); + syslog(LOG_NOTICE, "db_inventory_yeasts: inserted record ".$lastid); + } } echo $result; -} else if (isset($_GET['update'])) { - // UPDATE COMMAND - $sql = "UPDATE `inventory_yeasts` SET name='" . mysqli_real_escape_string($connect, $_GET['name']); - $sql .= "', type='" . $_GET['type']; - $sql .= "', form='" . $_GET['form']; - $sql .= "', laboratory='" . mysqli_real_escape_string($connect, $_GET['laboratory']); - $sql .= "', product_id='" . mysqli_real_escape_string($connect, $_GET['product_id']); - $sql .= "', min_temperature='" . $_GET['min_temperature']; - $sql .= "', max_temperature='" . $_GET['max_temperature']; - $sql .= "', flocculation='" . $_GET['flocculation']; - $sql .= "', attenuation='" . $_GET['attenuation']; - $sql .= "', notes='" . mysqli_real_escape_string($connect, $_GET['notes']); - $sql .= "', best_for='" . mysqli_real_escape_string($connect, $_GET['best_for']); - $sql .= "', max_reuse='" . $_GET['max_reuse']; - $sql .= "', inventory='" . floatval($_GET['inventory']) / 1000.0; - $sql .= "', cost='" . $_GET['cost']; - $sql .= "', production_date='" . $_GET['production_date']; - $sql .= "', tht_date='" . $_GET['tht_date']; - $sql .= "' WHERE record='" . $_GET['record'] . "';"; +} else if (isset($_POST['delete'])) { + // DELETE COMMAND + $sql = "DELETE FROM `inventory_yeasts` WHERE record='".$_POST['record']."';"; $result = mysqli_query($connect, $sql); if (! $result) { syslog(LOG_NOTICE, "db_inventory_yeasts: ".$sql." result: ".mysqli_error($connect)); } else { - syslog(LOG_NOTICE, "db_inventory_yeasts: updated record ".$_GET['record']); - } - echo $result; - -} else if (isset($_GET['delete'])) { - // DELETE COMMAND - $sql = "DELETE FROM `inventory_yeasts` WHERE record='".$_GET['record']."';"; - $result = mysqli_query($connect, $sql); - if (! $result) { - syslog(LOG_NOTICE, "db_inventory_yeasts: ".$sql." result: ".mysqli_error($connect)); - } else { - syslog(LOG_NOTICE, "db_inventory_yeasts: deleted record ".$_GET['record']); + syslog(LOG_NOTICE, "db_inventory_yeasts: deleted record ".$_POST['record']); } echo $result; } else { // SELECT COMMAND + $query = "SELECT * FROM inventory_yeasts ORDER BY laboratory,product_id,name"; $result = mysqli_query($connect, $query) or die("SQL Error 1: " . mysqli_error($connect)); while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) { $yeasts[] = array(
--- a/www/inv_yeasts.php Wed Jan 23 19:43:55 2019 +0100 +++ b/www/inv_yeasts.php Wed Jan 23 22:36:31 2019 +0100 @@ -13,62 +13,71 @@ <div id="popupWindow"> <div>Wijzig gist</div> <div style="overflow: hidden;"> - <table> + <table style="width: 100%;"> <tr> <td align="right" style="vertical-align: top;">Gist naam:</td> - <td align="left" style="vertical-align: top;"><input id="name" /></td> - <td align="right" style="vertical-align: top;">Minimum temperatuur:</td> - <td align="left"><div id="min_temperature"></div></td> - </tr> - <tr> - <td align="right" style="vertical-align: top;">Laboratorium:</td> - <td align="left" style="vertical-align: top;"><input id="laboratory" /></td> - <td align="right" style="vertical-align: top;">Maximum temperatuur:</td> - <td align="left"><div id="max_temperature"></div></td> + <td align="left" colspan="3" style="vertical-align: top;"><input id="name" /></td> </tr> <tr> <td align="right" style="vertical-align: top;">Productcode:</td> - <td align="left" style="vertical-align: top;"><input id="product_id" /></td> - <td align="right" style="vertical-align: top;">Flocculatie:</td> - <td align="left"><div id="flocculation"></div></td> - </tr> - <tr> - <td align="right" style="vertical-align: top;">Type:</td> - <td align="left"><div id="type"></div></td> - <td align="right" style="vertical-align: top;">Vergistingsgraad:</td> - <td align="left"><div id="attenuation"></div></td> - </tr> - <tr> - <td align="right" style="vertical-align: top;">Gist vorm:</td> - <td align="left"><div id="form"></div></td> - <td align="right" style="vertical-align: top;">Maximum Hergebruik:</td> - <td align="left"><div id="max_reuse"></div></td> + <td align="left" colspan="3" style="vertical-align: top;"><input id="product_id" /></td> </tr> <tr> <td align="right" style="vertical-align: top;">Opmerkingen:</td> <td align="left" colspan="3"><textarea id="notes"></textarea></td> </tr> <tr> - <td align="right" style="vertical-align: top;">Geschikt voor:</td> - <td align="left" colspan="3"><input id="best_for" /></td> + <td align="right" style="vertical-align: top;">Type:</td> + <td align="left"><div id="type"></div></td> + <td align="right" style="vertical-align: top;">Minimum temperatuur:</td> + <td align="left"><div id="min_temperature"></div></td> + </tr> + <tr> + <td align="right" style="vertical-align: top;">Gist vorm:</td> + <td align="left"><div id="form"></div></td> + <td align="right" style="vertical-align: top;">Maximum temperatuur:</td> + <td align="left"><div id="max_temperature"></div></td> + </tr> + <tr> + <td align="right" style="vertical-align: top;">Laboratorium:</td> + <td align="left" style="vertical-align: top;"><input id="laboratory" /></td> + <td align="right" style="vertical-align: top;">Vergistingsgraad:</td> + <td align="left"><div id="attenuation"></div></td> + </tr> + <tr> + <td rowspan="2" align="right" style="vertical-align: top;">Geschikt voor:</td> + <td rowspan="2" align="left"><textarea id="best_for"></textarea></td> + <td align="right" style="vertical-align: top;">Maximum Hergebruik:</td> + <td align="left"><div id="max_reuse"></div></td> + </tr> + <tr> + <td align="right" style="vertical-align: top;">Flocculatie:</td> + <td align="left"><div id="flocculation"></div></td> + </tr> + <tr> + <td colspan="4"><hr></td> </tr> <tr> <td align="right" style="vertical-align: top;">Voorraad gr/ml:</td> <td align="left"><div id="inventory"></div></td> + <td align="right" style="vertical-align: top;">Productie datum:</td> + <td align="left" style="vertical-align: top;"><div id="production_date"></div></td> + </tr> + <tr> <td align="right" style="vertical-align: top;">Prijs per kg:</td> <td align="left"><div id="cost"></div></td> - </tr> - <tr> - <td align="right" style="vertical-align: top;">Productie datum:</td> - <td align="left" style="vertical-align: top;"><div id="production_date"></div></td> <td align="right" style="vertical-align: top;">THT datum:</td> <td align="left" style="vertical-align: top;"><div id="tht_date"></div></td> </tr> <tr> - <td style="padding-top: 10px;" align="right"><input type="button" id="Delete" value="Delete" /></td> + <td align="right" style="vertical-align: top;">Waarde voorraad:</td> + <td align="left" colspan="3"><div id="totval"></div></td> + </tr> + <tr> + <td style="padding-top: 40px;" align="right"><input type="button" id="Delete" value="Verwijder" /></td> <td align="right"></td> <td align="right"></td> - <td style="padding-top: 10px;" align="right"><input style="margin-right: 5px;" type="button" id="Save" value="Save" /><input id="Cancel" type="button" value="Cancel" /></td> + <td style="padding-top: 40px;" align="left"><input style="margin-right: 5px;" type="button" id="Save" value="Sla op" /><input id="Cancel" type="button" value="Annuleer" /></td> </tr> </table> </div>
--- a/www/js/global.js Wed Jan 23 19:43:55 2019 +0100 +++ b/www/js/global.js Wed Jan 23 22:36:31 2019 +0100 @@ -125,6 +125,60 @@ }; var HopFormAdapter = new $.jqx.dataAdapter(HopFormSource); +var YeastTypeData = [ + { id: 0, en: 'Lager', nl: 'ondergist' }, + { id: 1, en: 'Ale', nl: 'bovengist' }, + { id: 2, en: 'Wheat', nl: 'weizengist' }, + { id: 3, en: 'Wine', nl: 'wijngist' }, + { id: 4, en: 'Champagne', nl: 'champagnegist' } +]; +var YeastTypeSource = { + localdata: YeastTypeData, + datatype: "array", + datafields: [{ name: 'id' }, { name: 'en' }, { name: 'nl' }] +}; +var YeastTypeAdapter = new $.jqx.dataAdapter(YeastTypeSource); + +var YeastFormData = [ + { id: 0, en: 'Liquid', nl: 'vloeibaar' }, + { id: 1, en: 'Dry', nl: 'droog' }, + { id: 2, en: 'Slant', nl: 'schuine buis' }, + { id: 3, en: 'Culture', nl: 'slurry' }, + { id: 4, en: 'Frozen', nl: 'ingevroren' }, + { id: 5, en: 'Bottle', nl: 'depot' } +]; +var YeastFormSource = { + localdata: YeastFormData, + datatype: "array", + datafields: [{ name: 'id' }, { name: 'en' }, { name: 'nl' }] +}; +var YeastFormAdapter = new $.jqx.dataAdapter(YeastFormSource); + +var FlocculationData = [ + { id: 0, en: 'Low', nl: 'laag' }, + { id: 1, en: 'Medium', nl: 'medium' }, + { id: 2, en: 'High', nl: 'hoog' }, + { id: 3, en: 'Very high', nl: 'zeer hoog' } +]; +var FlocculationSource = { + localdata: FlocculationData, + datatype: "array", + datafields: [{ name: 'id' }, { name: 'en' }, { name: 'nl' }] +}; +var FlocculationAdapter = new $.jqx.dataAdapter(FlocculationSource); + +var StarterTypeData = [ + { id: 0, en: 'Simple', nl: 'simpel' }, + { id: 1, en: 'Aerated', nl: 'belucht' }, + { id: 2, en: 'Stirred', nl: 'geroerd' } +]; +var StarterTypeSource = { + localdata: StarterTypeData, + datatype: "array", + datafields: [{ name: 'id' }, { name: 'en' }, { name: 'nl' }] +}; +var StarterTypeAdapter = new $.jqx.dataAdapter(StarterTypeSource); + @@ -176,6 +230,28 @@ spinButtons: true, spinButtonsStep: 0.05 }; +var YeastT = { + inputMode: 'simple', + spinMode: 'simple', + theme: theme, + width: 110, + height: 23, + min: 0, + max: 40, + decimalDigits: 1, + spinButtons: true, + spinButtonsStep: 0.5 +}; +var PosInt = { + inputMode: 'simple', + spinMode: 'simple', + theme: theme, + width: 110, + height: 23, + min: 0, + decimalDigits: 0, + spinButtons: true, +}; var Perc1dec5 = { inputMode: 'simple', spinMode: 'simple',
--- a/www/js/inv_yeasts.js Wed Jan 23 19:43:55 2019 +0100 +++ b/www/js/inv_yeasts.js Wed Jan 23 22:36:31 2019 +0100 @@ -1,5 +1,5 @@ /***************************************************************************** - * Copyright (C) 2014-2018 + * Copyright (C) 2014-2019 * * Michiel Broek <mbroek at mbse dot eu> * @@ -33,8 +33,8 @@ okButton: $('#delOk'), cancelButton: $('#delCancel'), initContent: function () { - $('#delOk').jqxButton({ width: '65px', theme: theme }); - $('#delCancel').jqxButton({ width: '65px', theme: theme }); + $('#delOk').jqxButton({ template: "danger", width: '65px', theme: theme }); + $('#delCancel').jqxButton({ template: "success", width: '65px', theme: theme }); $('#delCancel').focus(); } }); @@ -43,6 +43,14 @@ $(document).ready(function () { + + var dataRecord = {}; + + function calcTotal(cost, inventory) { + + $('#totval').val(cost * (inventory / 1000)); + } + var url = "includes/db_inventory_yeasts.php"; // prepare the data var source = { @@ -51,17 +59,17 @@ datafields: [ { name: 'record', type: 'number' }, { name: 'name', type: 'string' }, - { name: 'type', type: 'string' }, - { name: 'form', type: 'string' }, + { name: 'type', type: 'int' }, + { name: 'form', type: 'int' }, { name: 'laboratory', type: 'string' }, { name: 'product_id', type: 'string' }, - { name: 'min_temperature', type: 'number' }, - { name: 'max_temperature', type: 'number' }, - { name: 'flocculation', type: 'string' }, + { name: 'min_temperature', type: 'float' }, + { name: 'max_temperature', type: 'float' }, + { name: 'flocculation', type: 'int' }, { name: 'attenuation', type: 'float' }, { name: 'notes', type: 'string' }, { name: 'best_for', type: 'string' }, - { name: 'max_reuse', type: 'number' }, + { name: 'max_reuse', type: 'int' }, { name: 'inventory', type: 'float' }, { name: 'cost', type: 'float' }, { name: 'production_date', type: 'string' }, @@ -77,6 +85,7 @@ url: url, cache: false, data: data, + type: "POST", success: function (data, status, xhr) { // delete command is executed. commit(true); @@ -93,6 +102,7 @@ url: url, cache: false, data: data, + type: "POST", success: function (data, status, xhr) { commit(true); }, @@ -108,6 +118,7 @@ url: url, cache: false, data: data, + type: "POST", success: function (data, status, xhr) { // update command is executed. commit(true); @@ -118,28 +129,51 @@ }); } }; - var srcType = [ "Ale", "Lager", "Wheat", "Wine", "Champagne" ]; - var srcForm = [ "Liquid", "Dry", "Slant", "Culture", "Bottle", "Frozen" ]; - var srcFlocculation = [ "Low", "Medium", "High", "Very High" ]; // initialize the input fields. - $("#name").jqxInput({ theme: theme, width: 250, height: 23 }); - $("#laboratory").jqxInput({ theme: theme, width: 150, height: 23 }); - $("#product_id").jqxInput({ theme: theme, width: 120, height: 23 }); - $("#type").jqxDropDownList({ theme: theme, source: srcType, width: 90, height: 23, dropDownHeight: 170 }); - $("#form").jqxDropDownList({ theme: theme, source: srcForm, selectedIndex: 0, width: 90, height: 23, dropDownHeight: 195 }); - $("#notes").jqxInput({ theme: theme, width: 640, height: 120 }); - $("#best_for").jqxInput({ theme: theme, width: 640, height: 23 }); - $("#inventory").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, decimalDigits: 1, spinButtons: true }); - $("#production_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); - - $("#min_temperature").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 35, decimalDigits: 0, spinButtons: true }); - $("#max_temperature").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 35, decimalDigits: 0, spinButtons: true }); - $("#flocculation").jqxDropDownList({ theme: theme, source: srcFlocculation, width: 90, height: 23, dropDownHeight: 130 }); - $("#attenuation").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 50, max: 100, decimalDigits: 1, spinButtons: true }); - - $("#max_reuse").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 10, decimalDigits: 0, spinButtons: true }); - $("#cost").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, decimalDigits: 2, spinButtons: true }); - $("#tht_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); + $("#name").jqxInput({ theme: theme, width: 640, height: 23 }); + $("#laboratory").jqxInput({ theme: theme, width: 320, height: 23 }); + $("#product_id").jqxInput({ theme: theme, width: 320, height: 23 }); + $("#type").jqxDropDownList({ + theme: theme, + source: YeastTypeAdapter, + valueMember: 'id', + displayMember: 'nl', + width: 180, + height: 23, + autoDropDownHeight: true + }); + $("#form").jqxDropDownList({ + theme: theme, + source: YeastFormAdapter, + valueMember: 'id', + displayMember: 'nl', + selectedIndex: 0, + width: 180, + height: 23, + autoDropDownHeight: true + }); + $("#notes").jqxInput({ theme: theme, width: 800, height: 120 }); + $("#best_for").jqxInput({ theme: theme, width: 320, height: 50 }); + $("#inventory").jqxNumberInput( Spin1dec1 ); + $("#production_date").jqxDateTimeInput( Dateopts ); + $("#min_temperature").jqxNumberInput( YeastT ); + $("#max_temperature").jqxNumberInput( YeastT ); + $("#flocculation").jqxDropDownList({ + theme: theme, + source: FlocculationAdapter, + valueMember: 'id', + displayMember: 'nl', + width: 180, + height: 23, + autoDropDownHeight: true + }); + $("#attenuation").jqxNumberInput( Perc1dec1 ); + $("#max_reuse").jqxNumberInput( PosInt ); + $("#max_reuse").jqxNumberInput({ max: 10 }); + $("#cost").jqxNumberInput( Spin2dec1 ); + $("#tht_date").jqxDateTimeInput( Dateopts ); + $("#totval").jqxNumberInput( Spin2dec1 ); + $("#totval").jqxNumberInput({ width: 90, readOnly: true, spinButtons: false }); var dataAdapter = new $.jqx.dataAdapter(source); var editrow = -1; @@ -156,25 +190,25 @@ var addButton = $("<div style='float: right; margin-right: 15px;'><img style='position: relative; margin-top: 2px;' src='images/add.png'/><span style='margin-left: 4px; position: relative; top: -3px;'>Nieuw</span></div>"); container.append(addButton); statusbar.append(container); - addButton.jqxButton({ theme: theme, width: 120, height: 20 }); + addButton.jqxButton({ theme: theme, width: 90, height: 20 }); // add new row. addButton.click(function (event) { editrow = -1; - $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); + $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } }); $("#name").val(''); $("#laboratory").val(''); $("#product_id").val(''); - $("#type").val('Ale'); - $("#form").val('Liquid'); - $("#min_temperature").val(''); - $("#max_temperature").val(''); - $("#flocculation").val('Low'); - $("#attenuation").val('75.0'); + $("#type").val(0); + $("#form").val(0); + $("#min_temperature").val(18); + $("#max_temperature").val(22); + $("#flocculation").val(0); + $("#attenuation").val(77); $("#notes").val(''); $("#best_for").val(''); - $("#max_reuse").val(''); - $("#inventory").val(''); - $("#cost").val(''); + $("#max_reuse").val(10); + $("#inventory").val(0); + $("#cost").val(0); $("#production_date").val(''); $("#tht_date").val(''); $("#popupWindow").jqxWindow('open'); @@ -186,19 +220,27 @@ { text: 'Laboratorium', datafield: 'laboratory', width: 150 }, { text: 'Product ID', datafield: 'product_id', width: 120 }, { text: 'Gist naam', datafield: 'name' }, - { text: 'Type', datafield: 'type', align: 'center', cellsalign: 'center', width: 90 }, - { text: 'Vorm', datafield: 'form', align: 'center', cellsalign: 'center', width: 90 }, + { text: 'Type', datafield: 'type', align: 'center', cellsalign: 'center', width: 90, + cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) { + return "<div style='margin: 4px;' class='jqx-center-align'>" + YeastTypeData[value].nl + "</div>"; + } + }, + { text: 'Vorm', datafield: 'form', align: 'center', cellsalign: 'center', width: 90, + cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) { + return "<div style='margin: 4px;' class='jqx-center-align'>" + YeastFormData[value].nl + "</div>"; + } + }, { text: 'Vergistingsgraad', datafield: 'attenuation', width: 120, align: 'right', cellsalign: 'right', cellsformat: 'p0' }, { text: 'Voor. gr/ml', datafield: 'inventory', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1' }, { text: 'Prijs kg/l', datafield: 'cost', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'c2' }, - { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 120, align: 'center', cellsrenderer: function () { + { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 100, align: 'center', cellsrenderer: function () { return "Wijzig"; }, buttonclick: function (row) { // open the popup window when the user clicks a button. editrow = row; - $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); + $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } }); // get the clicked row's data and initialize the input fields. - var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); + dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); $("#name").val(dataRecord.name); $("#laboratory").val(dataRecord.laboratory); $("#product_id").val(dataRecord.product_id); @@ -215,20 +257,38 @@ $("#cost").val(dataRecord.cost); $("#production_date").val(dataRecord.production_date); $("#tht_date").val(dataRecord.tht_date); + calcTotal(dataRecord.cost, dataRecord.inventory); // show the popup window. $("#popupWindow").jqxWindow('open'); } } ] }); + + $("#cost").on('change', function (event) { + dataRecord.cost = parseFloat(event.args.value); + calcTotal(dataRecord.cost, dataRecord.inventory); + }); + $("#inventory").on('change', function (event) { + dataRecord.inventory = parseFloat(event.args.value); + calcTotal(dataRecord.cost, dataRecord.inventory); + }); + // initialize the popup window and buttons. $("#popupWindow").jqxWindow({ - width: 860, resizable: false, theme: theme, isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.40 + width: 1050, + height: 550, + resizable: false, + theme: theme, + isModal: true, + autoOpen: false, + cancelButton: $("#Cancel"), + modalOpacity: 0.40 }); $("#popupWindow").on('open', function () { $("#name").jqxInput('selectAll'); }); - $("#Delete").jqxButton({ theme: theme }); + $("#Delete").jqxButton({ template: "danger", width: '90px', theme: theme }); $("#Delete").click(function () { if (editrow >= 0) { // Open a popup to confirm this action. @@ -240,57 +300,40 @@ } $("#popupWindow").jqxWindow('hide'); }); - $("#Cancel").jqxButton({ theme: theme }); - $("#Save").jqxButton({ theme: theme }); + $("#Cancel").jqxButton({ template: "primary", width: '90px', theme: theme }); + $("#Save").jqxButton({ template: "success", width: '90px', theme: theme }); // update the edited row when the user clicks the 'Save' button. $("#Save").click(function () { + var rowID = -1; if (editrow >= 0) { - var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow); - var row = { - record: rowID, - name: $("#name").val(), - type: $("#type").val(), - form: $("#form").val(), - laboratory: $("#laboratory").val(), - product_id: $("#product_id").val(), - min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')), - max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')), - flocculation: $("#flocculation").val(), - attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')), - notes: $("#notes").val(), - best_for: $("#best_for").val(), - max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')), - inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), - cost: parseFloat($("#cost").jqxNumberInput('decimal')), - production_date: $("#production_date").val(), - tht_date: $("#tht_date").val() - }; + rowID = $('#jqxgrid').jqxGrid('getrowid', editrow); + } + var row = { + record: rowID, + name: $("#name").val(), + type: $("#type").val(), + form: $("#form").val(), + laboratory: $("#laboratory").val(), + product_id: $("#product_id").val(), + min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')), + max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')), + flocculation: $("#flocculation").val(), + attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')), + notes: $("#notes").val(), + best_for: $("#best_for").val(), + max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')), + inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), + cost: parseFloat($("#cost").jqxNumberInput('decimal')), + production_date: $("#production_date").val(), + tht_date: $("#tht_date").val() + }; + if (editrow >= 0) { $('#jqxgrid').jqxGrid('updaterow', rowID, row); - $("#popupWindow").jqxWindow('hide'); } else { - // Insert a record - var newrow = { - record: -1, - name: $("#name").val(), - type: $("#type").val(), - form: $("#form").val(), - laboratory: $("#laboratory").val(), - product_id: $("#product_id").val(), - min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')), - max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')), - flocculation: $("#flocculation").val(), - attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')), - notes: $("#notes").val(), - best_for: $("#best_for").val(), - max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')), - inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), - cost: parseFloat($("#cost").jqxNumberInput('decimal')), - production_date: $("#production_date").val(), - tht_date: $("#tht_date").val() - }; - $('#jqxgrid').jqxGrid('addrow', null, newrow); - $("#popupWindow").jqxWindow('hide'); + $('#jqxgrid').jqxGrid('addrow', null, row); } + $("#popupWindow").jqxWindow('hide'); + location.reload( true ); // reload ourself. }); createDelElements(); });