www/js/inv_yeasts.js

changeset 198
f0ec83e1e01f
parent 37
9362eb9e9e5b
child 200
7b2f11652d67
equal deleted inserted replaced
197:63174cff2cc1 198:f0ec83e1e01f
1 /***************************************************************************** 1 /*****************************************************************************
2 * Copyright (C) 2014-2018 2 * Copyright (C) 2014-2019
3 * 3 *
4 * Michiel Broek <mbroek at mbse dot eu> 4 * Michiel Broek <mbroek at mbse dot eu>
5 * 5 *
6 * This file is part of BrewCloud 6 * This file is part of BrewCloud
7 * 7 *
31 isModal: true, 31 isModal: true,
32 modalOpacity: 0.4, 32 modalOpacity: 0.4,
33 okButton: $('#delOk'), 33 okButton: $('#delOk'),
34 cancelButton: $('#delCancel'), 34 cancelButton: $('#delCancel'),
35 initContent: function () { 35 initContent: function () {
36 $('#delOk').jqxButton({ width: '65px', theme: theme }); 36 $('#delOk').jqxButton({ template: "danger", width: '65px', theme: theme });
37 $('#delCancel').jqxButton({ width: '65px', theme: theme }); 37 $('#delCancel').jqxButton({ template: "success", width: '65px', theme: theme });
38 $('#delCancel').focus(); 38 $('#delCancel').focus();
39 } 39 }
40 }); 40 });
41 $('#eventWindow').jqxWindow('hide'); 41 $('#eventWindow').jqxWindow('hide');
42 } 42 }
43 43
44 44
45 $(document).ready(function () { 45 $(document).ready(function () {
46
47 var dataRecord = {};
48
49 function calcTotal(cost, inventory) {
50
51 $('#totval').val(cost * (inventory / 1000));
52 }
53
46 var url = "includes/db_inventory_yeasts.php"; 54 var url = "includes/db_inventory_yeasts.php";
47 // prepare the data 55 // prepare the data
48 var source = { 56 var source = {
49 datatype: "json", 57 datatype: "json",
50 cache: false, 58 cache: false,
51 datafields: [ 59 datafields: [
52 { name: 'record', type: 'number' }, 60 { name: 'record', type: 'number' },
53 { name: 'name', type: 'string' }, 61 { name: 'name', type: 'string' },
54 { name: 'type', type: 'string' }, 62 { name: 'type', type: 'int' },
55 { name: 'form', type: 'string' }, 63 { name: 'form', type: 'int' },
56 { name: 'laboratory', type: 'string' }, 64 { name: 'laboratory', type: 'string' },
57 { name: 'product_id', type: 'string' }, 65 { name: 'product_id', type: 'string' },
58 { name: 'min_temperature', type: 'number' }, 66 { name: 'min_temperature', type: 'float' },
59 { name: 'max_temperature', type: 'number' }, 67 { name: 'max_temperature', type: 'float' },
60 { name: 'flocculation', type: 'string' }, 68 { name: 'flocculation', type: 'int' },
61 { name: 'attenuation', type: 'float' }, 69 { name: 'attenuation', type: 'float' },
62 { name: 'notes', type: 'string' }, 70 { name: 'notes', type: 'string' },
63 { name: 'best_for', type: 'string' }, 71 { name: 'best_for', type: 'string' },
64 { name: 'max_reuse', type: 'number' }, 72 { name: 'max_reuse', type: 'int' },
65 { name: 'inventory', type: 'float' }, 73 { name: 'inventory', type: 'float' },
66 { name: 'cost', type: 'float' }, 74 { name: 'cost', type: 'float' },
67 { name: 'production_date', type: 'string' }, 75 { name: 'production_date', type: 'string' },
68 { name: 'tht_date', type: 'string' } 76 { name: 'tht_date', type: 'string' }
69 ], 77 ],
75 $.ajax({ 83 $.ajax({
76 dataType: 'json', 84 dataType: 'json',
77 url: url, 85 url: url,
78 cache: false, 86 cache: false,
79 data: data, 87 data: data,
88 type: "POST",
80 success: function (data, status, xhr) { 89 success: function (data, status, xhr) {
81 // delete command is executed. 90 // delete command is executed.
82 commit(true); 91 commit(true);
83 }, 92 },
84 error: function (jqXHR, textStatus, errorThrown) { 93 error: function (jqXHR, textStatus, errorThrown) {
91 $.ajax({ 100 $.ajax({
92 dataType: 'json', 101 dataType: 'json',
93 url: url, 102 url: url,
94 cache: false, 103 cache: false,
95 data: data, 104 data: data,
105 type: "POST",
96 success: function (data, status, xhr) { 106 success: function (data, status, xhr) {
97 commit(true); 107 commit(true);
98 }, 108 },
99 error: function(jqXHR, textStatus, errorThrown) { 109 error: function(jqXHR, textStatus, errorThrown) {
100 commit(false); 110 commit(false);
106 $.ajax({ 116 $.ajax({
107 dataType: 'json', 117 dataType: 'json',
108 url: url, 118 url: url,
109 cache: false, 119 cache: false,
110 data: data, 120 data: data,
121 type: "POST",
111 success: function (data, status, xhr) { 122 success: function (data, status, xhr) {
112 // update command is executed. 123 // update command is executed.
113 commit(true); 124 commit(true);
114 }, 125 },
115 error: function(jqXHR, textStatus, errorThrown) { 126 error: function(jqXHR, textStatus, errorThrown) {
116 commit(false); 127 commit(false);
117 } 128 }
118 }); 129 });
119 } 130 }
120 }; 131 };
121 var srcType = [ "Ale", "Lager", "Wheat", "Wine", "Champagne" ];
122 var srcForm = [ "Liquid", "Dry", "Slant", "Culture", "Bottle", "Frozen" ];
123 var srcFlocculation = [ "Low", "Medium", "High", "Very High" ];
124 // initialize the input fields. 132 // initialize the input fields.
125 $("#name").jqxInput({ theme: theme, width: 250, height: 23 }); 133 $("#name").jqxInput({ theme: theme, width: 640, height: 23 });
126 $("#laboratory").jqxInput({ theme: theme, width: 150, height: 23 }); 134 $("#laboratory").jqxInput({ theme: theme, width: 320, height: 23 });
127 $("#product_id").jqxInput({ theme: theme, width: 120, height: 23 }); 135 $("#product_id").jqxInput({ theme: theme, width: 320, height: 23 });
128 $("#type").jqxDropDownList({ theme: theme, source: srcType, width: 90, height: 23, dropDownHeight: 170 }); 136 $("#type").jqxDropDownList({
129 $("#form").jqxDropDownList({ theme: theme, source: srcForm, selectedIndex: 0, width: 90, height: 23, dropDownHeight: 195 }); 137 theme: theme,
130 $("#notes").jqxInput({ theme: theme, width: 640, height: 120 }); 138 source: YeastTypeAdapter,
131 $("#best_for").jqxInput({ theme: theme, width: 640, height: 23 }); 139 valueMember: 'id',
132 $("#inventory").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, decimalDigits: 1, spinButtons: true }); 140 displayMember: 'nl',
133 $("#production_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); 141 width: 180,
134 142 height: 23,
135 $("#min_temperature").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 35, decimalDigits: 0, spinButtons: true }); 143 autoDropDownHeight: true
136 $("#max_temperature").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 35, decimalDigits: 0, spinButtons: true }); 144 });
137 $("#flocculation").jqxDropDownList({ theme: theme, source: srcFlocculation, width: 90, height: 23, dropDownHeight: 130 }); 145 $("#form").jqxDropDownList({
138 $("#attenuation").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 50, max: 100, decimalDigits: 1, spinButtons: true }); 146 theme: theme,
139 147 source: YeastFormAdapter,
140 $("#max_reuse").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, max: 10, decimalDigits: 0, spinButtons: true }); 148 valueMember: 'id',
141 $("#cost").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 110, height: 23, min: 0, decimalDigits: 2, spinButtons: true }); 149 displayMember: 'nl',
142 $("#tht_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); 150 selectedIndex: 0,
151 width: 180,
152 height: 23,
153 autoDropDownHeight: true
154 });
155 $("#notes").jqxInput({ theme: theme, width: 800, height: 120 });
156 $("#best_for").jqxInput({ theme: theme, width: 320, height: 50 });
157 $("#inventory").jqxNumberInput( Spin1dec1 );
158 $("#production_date").jqxDateTimeInput( Dateopts );
159 $("#min_temperature").jqxNumberInput( YeastT );
160 $("#max_temperature").jqxNumberInput( YeastT );
161 $("#flocculation").jqxDropDownList({
162 theme: theme,
163 source: FlocculationAdapter,
164 valueMember: 'id',
165 displayMember: 'nl',
166 width: 180,
167 height: 23,
168 autoDropDownHeight: true
169 });
170 $("#attenuation").jqxNumberInput( Perc1dec1 );
171 $("#max_reuse").jqxNumberInput( PosInt );
172 $("#max_reuse").jqxNumberInput({ max: 10 });
173 $("#cost").jqxNumberInput( Spin2dec1 );
174 $("#tht_date").jqxDateTimeInput( Dateopts );
175 $("#totval").jqxNumberInput( Spin2dec1 );
176 $("#totval").jqxNumberInput({ width: 90, readOnly: true, spinButtons: false });
143 177
144 var dataAdapter = new $.jqx.dataAdapter(source); 178 var dataAdapter = new $.jqx.dataAdapter(source);
145 var editrow = -1; 179 var editrow = -1;
146 // initialize jqxGrid 180 // initialize jqxGrid
147 $("#jqxgrid").jqxGrid({ 181 $("#jqxgrid").jqxGrid({
154 renderstatusbar: function (statusbar) { 188 renderstatusbar: function (statusbar) {
155 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>"); 189 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>");
156 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>"); 190 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>");
157 container.append(addButton); 191 container.append(addButton);
158 statusbar.append(container); 192 statusbar.append(container);
159 addButton.jqxButton({ theme: theme, width: 120, height: 20 }); 193 addButton.jqxButton({ theme: theme, width: 90, height: 20 });
160 // add new row. 194 // add new row.
161 addButton.click(function (event) { 195 addButton.click(function (event) {
162 editrow = -1; 196 editrow = -1;
163 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); 197 $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } });
164 $("#name").val(''); 198 $("#name").val('');
165 $("#laboratory").val(''); 199 $("#laboratory").val('');
166 $("#product_id").val(''); 200 $("#product_id").val('');
167 $("#type").val('Ale'); 201 $("#type").val(0);
168 $("#form").val('Liquid'); 202 $("#form").val(0);
169 $("#min_temperature").val(''); 203 $("#min_temperature").val(18);
170 $("#max_temperature").val(''); 204 $("#max_temperature").val(22);
171 $("#flocculation").val('Low'); 205 $("#flocculation").val(0);
172 $("#attenuation").val('75.0'); 206 $("#attenuation").val(77);
173 $("#notes").val(''); 207 $("#notes").val('');
174 $("#best_for").val(''); 208 $("#best_for").val('');
175 $("#max_reuse").val(''); 209 $("#max_reuse").val(10);
176 $("#inventory").val(''); 210 $("#inventory").val(0);
177 $("#cost").val(''); 211 $("#cost").val(0);
178 $("#production_date").val(''); 212 $("#production_date").val('');
179 $("#tht_date").val(''); 213 $("#tht_date").val('');
180 $("#popupWindow").jqxWindow('open'); 214 $("#popupWindow").jqxWindow('open');
181 }); 215 });
182 }, 216 },
184 filtermode: 'excel', 218 filtermode: 'excel',
185 columns: [ 219 columns: [
186 { text: 'Laboratorium', datafield: 'laboratory', width: 150 }, 220 { text: 'Laboratorium', datafield: 'laboratory', width: 150 },
187 { text: 'Product ID', datafield: 'product_id', width: 120 }, 221 { text: 'Product ID', datafield: 'product_id', width: 120 },
188 { text: 'Gist naam', datafield: 'name' }, 222 { text: 'Gist naam', datafield: 'name' },
189 { text: 'Type', datafield: 'type', align: 'center', cellsalign: 'center', width: 90 }, 223 { text: 'Type', datafield: 'type', align: 'center', cellsalign: 'center', width: 90,
190 { text: 'Vorm', datafield: 'form', align: 'center', cellsalign: 'center', width: 90 }, 224 cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) {
225 return "<div style='margin: 4px;' class='jqx-center-align'>" + YeastTypeData[value].nl + "</div>";
226 }
227 },
228 { text: 'Vorm', datafield: 'form', align: 'center', cellsalign: 'center', width: 90,
229 cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) {
230 return "<div style='margin: 4px;' class='jqx-center-align'>" + YeastFormData[value].nl + "</div>";
231 }
232 },
191 { text: 'Vergistingsgraad', datafield: 'attenuation', width: 120, align: 'right', cellsalign: 'right', cellsformat: 'p0' }, 233 { text: 'Vergistingsgraad', datafield: 'attenuation', width: 120, align: 'right', cellsalign: 'right', cellsformat: 'p0' },
192 { text: 'Voor. gr/ml', datafield: 'inventory', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1' }, 234 { text: 'Voor. gr/ml', datafield: 'inventory', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'f1' },
193 { text: 'Prijs kg/l', datafield: 'cost', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'c2' }, 235 { text: 'Prijs kg/l', datafield: 'cost', width: 100, align: 'right', cellsalign: 'right', cellsformat: 'c2' },
194 { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 120, align: 'center', cellsrenderer: function () { 236 { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 100, align: 'center', cellsrenderer: function () {
195 return "Wijzig"; 237 return "Wijzig";
196 }, buttonclick: function (row) { 238 }, buttonclick: function (row) {
197 // open the popup window when the user clicks a button. 239 // open the popup window when the user clicks a button.
198 editrow = row; 240 editrow = row;
199 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); 241 $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } });
200 // get the clicked row's data and initialize the input fields. 242 // get the clicked row's data and initialize the input fields.
201 var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); 243 dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);
202 $("#name").val(dataRecord.name); 244 $("#name").val(dataRecord.name);
203 $("#laboratory").val(dataRecord.laboratory); 245 $("#laboratory").val(dataRecord.laboratory);
204 $("#product_id").val(dataRecord.product_id); 246 $("#product_id").val(dataRecord.product_id);
205 $("#type").val(dataRecord.type); 247 $("#type").val(dataRecord.type);
206 $("#form").val(dataRecord.form); 248 $("#form").val(dataRecord.form);
213 $("#max_reuse").val(dataRecord.max_reuse); 255 $("#max_reuse").val(dataRecord.max_reuse);
214 $("#inventory").val(dataRecord.inventory); 256 $("#inventory").val(dataRecord.inventory);
215 $("#cost").val(dataRecord.cost); 257 $("#cost").val(dataRecord.cost);
216 $("#production_date").val(dataRecord.production_date); 258 $("#production_date").val(dataRecord.production_date);
217 $("#tht_date").val(dataRecord.tht_date); 259 $("#tht_date").val(dataRecord.tht_date);
260 calcTotal(dataRecord.cost, dataRecord.inventory);
218 // show the popup window. 261 // show the popup window.
219 $("#popupWindow").jqxWindow('open'); 262 $("#popupWindow").jqxWindow('open');
220 } 263 }
221 } 264 }
222 ] 265 ]
223 }); 266 });
267
268 $("#cost").on('change', function (event) {
269 dataRecord.cost = parseFloat(event.args.value);
270 calcTotal(dataRecord.cost, dataRecord.inventory);
271 });
272 $("#inventory").on('change', function (event) {
273 dataRecord.inventory = parseFloat(event.args.value);
274 calcTotal(dataRecord.cost, dataRecord.inventory);
275 });
276
224 // initialize the popup window and buttons. 277 // initialize the popup window and buttons.
225 $("#popupWindow").jqxWindow({ 278 $("#popupWindow").jqxWindow({
226 width: 860, resizable: false, theme: theme, isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.40 279 width: 1050,
280 height: 550,
281 resizable: false,
282 theme: theme,
283 isModal: true,
284 autoOpen: false,
285 cancelButton: $("#Cancel"),
286 modalOpacity: 0.40
227 }); 287 });
228 $("#popupWindow").on('open', function () { 288 $("#popupWindow").on('open', function () {
229 $("#name").jqxInput('selectAll'); 289 $("#name").jqxInput('selectAll');
230 }); 290 });
231 $("#Delete").jqxButton({ theme: theme }); 291 $("#Delete").jqxButton({ template: "danger", width: '90px', theme: theme });
232 $("#Delete").click(function () { 292 $("#Delete").click(function () {
233 if (editrow >= 0) { 293 if (editrow >= 0) {
234 // Open a popup to confirm this action. 294 // Open a popup to confirm this action.
235 $('#eventWindow').jqxWindow('open'); 295 $('#eventWindow').jqxWindow('open');
236 $("#delOk").click(function () { 296 $("#delOk").click(function () {
238 $("#jqxgrid").jqxGrid('deleterow', rowID); 298 $("#jqxgrid").jqxGrid('deleterow', rowID);
239 }); 299 });
240 } 300 }
241 $("#popupWindow").jqxWindow('hide'); 301 $("#popupWindow").jqxWindow('hide');
242 }); 302 });
243 $("#Cancel").jqxButton({ theme: theme }); 303 $("#Cancel").jqxButton({ template: "primary", width: '90px', theme: theme });
244 $("#Save").jqxButton({ theme: theme }); 304 $("#Save").jqxButton({ template: "success", width: '90px', theme: theme });
245 // update the edited row when the user clicks the 'Save' button. 305 // update the edited row when the user clicks the 'Save' button.
246 $("#Save").click(function () { 306 $("#Save").click(function () {
307 var rowID = -1;
247 if (editrow >= 0) { 308 if (editrow >= 0) {
248 var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow); 309 rowID = $('#jqxgrid').jqxGrid('getrowid', editrow);
249 var row = { 310 }
250 record: rowID, 311 var row = {
251 name: $("#name").val(), 312 record: rowID,
252 type: $("#type").val(), 313 name: $("#name").val(),
253 form: $("#form").val(), 314 type: $("#type").val(),
254 laboratory: $("#laboratory").val(), 315 form: $("#form").val(),
255 product_id: $("#product_id").val(), 316 laboratory: $("#laboratory").val(),
256 min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')), 317 product_id: $("#product_id").val(),
257 max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')), 318 min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')),
258 flocculation: $("#flocculation").val(), 319 max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')),
259 attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')), 320 flocculation: $("#flocculation").val(),
260 notes: $("#notes").val(), 321 attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')),
261 best_for: $("#best_for").val(), 322 notes: $("#notes").val(),
262 max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')), 323 best_for: $("#best_for").val(),
263 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), 324 max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')),
264 cost: parseFloat($("#cost").jqxNumberInput('decimal')), 325 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')),
265 production_date: $("#production_date").val(), 326 cost: parseFloat($("#cost").jqxNumberInput('decimal')),
266 tht_date: $("#tht_date").val() 327 production_date: $("#production_date").val(),
267 }; 328 tht_date: $("#tht_date").val()
329 };
330 if (editrow >= 0) {
268 $('#jqxgrid').jqxGrid('updaterow', rowID, row); 331 $('#jqxgrid').jqxGrid('updaterow', rowID, row);
269 $("#popupWindow").jqxWindow('hide');
270 } else { 332 } else {
271 // Insert a record 333 $('#jqxgrid').jqxGrid('addrow', null, row);
272 var newrow = { 334 }
273 record: -1, 335 $("#popupWindow").jqxWindow('hide');
274 name: $("#name").val(), 336 location.reload( true ); // reload ourself.
275 type: $("#type").val(),
276 form: $("#form").val(),
277 laboratory: $("#laboratory").val(),
278 product_id: $("#product_id").val(),
279 min_temperature: parseInt($("#min_temperature").jqxNumberInput('decimal')),
280 max_temperature: parseInt($("#max_temperature").jqxNumberInput('decimal')),
281 flocculation: $("#flocculation").val(),
282 attenuation: parseFloat($("#attenuation").jqxNumberInput('decimal')),
283 notes: $("#notes").val(),
284 best_for: $("#best_for").val(),
285 max_reuse: parseInt($("#max_reuse").jqxNumberInput('decimal')),
286 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')),
287 cost: parseFloat($("#cost").jqxNumberInput('decimal')),
288 production_date: $("#production_date").val(),
289 tht_date: $("#tht_date").val()
290 };
291 $('#jqxgrid').jqxGrid('addrow', null, newrow);
292 $("#popupWindow").jqxWindow('hide');
293 }
294 }); 337 });
295 createDelElements(); 338 createDelElements();
296 }); 339 });
297 340

mercurial