changeset
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.
Wed, 23 Jan 2019 22:36:31 +0100
- author
- Michiel Broek <mbroek@mbse.eu>
- date
- Wed, 23 Jan 2019 22:36:31 +0100
- changeset 198
- f0ec83e1e01f
- parent 197
- 63174cff2cc1
- child 199
- dad62ec9af18
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(); });
