www/js/inv_miscs.js

changeset 200
7b2f11652d67
parent 78
f35a38e8c16f
child 204
5df88c6dc903
equal deleted inserted replaced
199:dad62ec9af18 200:7b2f11652d67
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 is free software; you can redistribute it and/or modify it 6 * This is free software; you can redistribute it and/or modify it
7 * under the terms of the GNU General Public License as published by the 7 * under the terms of the GNU General Public License as published by the
29 isModal: true, 29 isModal: true,
30 modalOpacity: 0.4, 30 modalOpacity: 0.4,
31 okButton: $('#delOk'), 31 okButton: $('#delOk'),
32 cancelButton: $('#delCancel'), 32 cancelButton: $('#delCancel'),
33 initContent: function () { 33 initContent: function () {
34 $('#delOk').jqxButton({ width: '65px', theme: theme }); 34 $('#delOk').jqxButton({ template: "danger", width: '65px', theme: theme });
35 $('#delCancel').jqxButton({ width: '65px', theme: theme }); 35 $('#delCancel').jqxButton({ template: "success", width: '65px', theme: theme });
36 $('#delCancel').focus(); 36 $('#delCancel').focus();
37 } 37 }
38 }); 38 });
39 $('#eventWindow').jqxWindow('hide'); 39 $('#eventWindow').jqxWindow('hide');
40 } 40 }
41 41
42 42
43 $(document).ready(function () { 43 $(document).ready(function () {
44
45 var dataRecord = {};
46
47 function calcTotal(cost, inventory) {
48
49 $('#totval').val(cost * (inventory / 1000));
50 }
51
52 function prompts(isweight) {
53
54 if (isweight) {
55 $("#pmpt_cost").html('Prijs per kg:');
56 $("#pmpt_inventory").html('Voorraad gram:');
57 } else {
58 $("#pmpt_cost").html('Prijs per liter:');
59 $("#pmpt_inventory").html('Voorraad ml:');
60 }
61 }
62
44 var url = "includes/db_inventory_miscs.php"; 63 var url = "includes/db_inventory_miscs.php";
45 // prepare the data 64 // prepare the data
46 var source = { 65 var source = {
47 datatype: "json", 66 datatype: "json",
48 cache: false, 67 cache: false,
49 datafields: [ 68 datafields: [
50 { name: 'record', type: 'number' }, 69 { name: 'record', type: 'number' },
51 { name: 'name', type: 'string' }, 70 { name: 'name', type: 'string' },
52 { name: 'type', type: 'string' }, 71 { name: 'type', type: 'int' },
53 { name: 'use_use', type: 'string' }, 72 { name: 'use_use', type: 'int' },
54 { name: 'time', type: 'float' }, 73 { name: 'time', type: 'int' },
55 { name: 'amount', type: 'float' }, 74 { name: 'amount', type: 'float' },
56 { name: 'amount_is_weight', type: 'bool' }, 75 { name: 'amount_is_weight', type: 'int' },
57 { name: 'use_for', type: 'string' }, 76 { name: 'use_for', type: 'string' },
58 { name: 'notes', type: 'string' }, 77 { name: 'notes', type: 'string' },
59 { name: 'always_on_stock', type: 'bool' }, 78 { name: 'always_on_stock', type: 'int' },
60 { name: 'inventory', type: 'float' }, 79 { name: 'inventory', type: 'float' },
61 { name: 'cost', type: 'float' }, 80 { name: 'cost', type: 'float' },
62 { name: 'production_date', type: 'string' }, 81 { name: 'production_date', type: 'string' },
63 { name: 'tht_date', type: 'string' } 82 { name: 'tht_date', type: 'string' }
64 ], 83 ],
70 $.ajax({ 89 $.ajax({
71 dataType: 'json', 90 dataType: 'json',
72 url: url, 91 url: url,
73 cache: false, 92 cache: false,
74 data: data, 93 data: data,
94 type: "POST",
75 success: function (data, status, xhr) { 95 success: function (data, status, xhr) {
76 // delete command is executed. 96 // delete command is executed.
77 commit(true); 97 commit(true);
78 }, 98 },
79 error: function (jqXHR, textStatus, errorThrown) { 99 error: function (jqXHR, textStatus, errorThrown) {
86 $.ajax({ 106 $.ajax({
87 dataType: 'json', 107 dataType: 'json',
88 url: url, 108 url: url,
89 cache: false, 109 cache: false,
90 data: data, 110 data: data,
111 type: "POST",
91 success: function (data, status, xhr) { 112 success: function (data, status, xhr) {
92 commit(true); 113 commit(true);
93 }, 114 },
94 error: function(jqXHR, textStatus, errorThrown) { 115 error: function(jqXHR, textStatus, errorThrown) {
95 commit(false); 116 commit(false);
101 $.ajax({ 122 $.ajax({
102 dataType: 'json', 123 dataType: 'json',
103 url: url, 124 url: url,
104 cache: false, 125 cache: false,
105 data: data, 126 data: data,
127 type: "POST",
106 success: function (data, status, xhr) { 128 success: function (data, status, xhr) {
107 // update command is executed. 129 // update command is executed.
108 commit(true); 130 commit(true);
109 }, 131 },
110 error: function(jqXHR, textStatus, errorThrown) { 132 error: function(jqXHR, textStatus, errorThrown) {
111 commit(false); 133 commit(false);
112 } 134 }
113 }); 135 });
114 } 136 }
115 }; 137 };
116 var srcType = [ "Spice", "Fining", "Water Agent", "Herb", "Flavor", "Yeast nutrient", "Other" ];
117 var srcUse = [ "Boil", "Mash", "Primary", "Secondary", "Bottling" ];
118 // initialize the input fields. 138 // initialize the input fields.
119 $("#name").jqxInput({ theme: theme, width: 250, height: 23 }); 139 $("#name").jqxInput({ theme: theme, width: 640, height: 23 });
120 $("#type").jqxDropDownList({ theme: theme, source: srcType, width: 130, height: 23, dropDownHeight: 220 }); 140 $("#notes").jqxInput({ theme: theme, width: 800, height: 100 });
121 $("#use_use").jqxDropDownList({ theme: theme, source: srcUse, width: 90, height: 23, dropDownHeight: 156 }); 141
122 $("#time").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, decimalDigits: 2, spinButtons: true }); 142 $("#type").jqxDropDownList({theme: theme,
143 source: MiscTypeAdapter,
144 valueMember: 'id',
145 displayMember: 'nl',
146 width: 180,
147 height: 23,
148 autoDropDownHeight: true
149 });
150 $("#use_use").jqxDropDownList({
151 theme: theme,
152 source: MiscUseAdapter,
153 valueMember: 'id',
154 displayMember: 'nl',
155 width: 180,
156 height: 23,
157 autoDropDownHeight: true
158 });
159 $("#time").jqxNumberInput( PosInt );
123 $("#amount_is_weight").jqxCheckBox({ theme: theme, width: 120, height: 23 }); 160 $("#amount_is_weight").jqxCheckBox({ theme: theme, width: 120, height: 23 });
124 $("#use_for").jqxInput({ theme: theme, width: 640, height: 48 }); 161 $("#use_for").jqxInput({ theme: theme, width: 640, height: 48 });
125 $("#notes").jqxInput({ theme: theme, width: 640, height: 100 });
126 $("#always_on_stock").jqxCheckBox({ theme: theme, width: 120, height: 23 }); 162 $("#always_on_stock").jqxCheckBox({ theme: theme, width: 120, height: 23 });
127 $("#inventory").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, decimalDigits: 1, spinButtons: true }); 163 $("#inventory").jqxNumberInput( Spin1dec1 );
128 $("#production_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); 164 $("#production_date").jqxDateTimeInput( Dateopts );
129 $("#cost").jqxNumberInput({ inputMode: 'simple', spinMode: 'simple', theme: theme, width: 70, height: 23, min: 0, decimalDigits: 2, spinButtons: true }); 165 $("#cost").jqxNumberInput( Spin2dec1 );
130 $("#tht_date").jqxDateTimeInput({ theme: theme, width: 100, height: 23, formatString: 'yyyy-MM-dd' }); 166 $("#tht_date").jqxDateTimeInput( Dateopts );
167 $("#totval").jqxNumberInput( Spin2dec1 );
168 $("#totval").jqxNumberInput({ width: 90, readOnly: true, spinButtons: false });
131 169
132 var dataAdapter = new $.jqx.dataAdapter(source); 170 var dataAdapter = new $.jqx.dataAdapter(source);
133 var editrow = -1; 171 var editrow = -1;
134 // initialize jqxGrid 172 // initialize jqxGrid
135 $("#jqxgrid").jqxGrid({ 173 $("#jqxgrid").jqxGrid({
142 renderstatusbar: function (statusbar) { 180 renderstatusbar: function (statusbar) {
143 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>"); 181 var container = $("<div style='overflow: hidden; position: relative; margin: 5px;'></div>");
144 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>"); 182 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>");
145 container.append(addButton); 183 container.append(addButton);
146 statusbar.append(container); 184 statusbar.append(container);
147 addButton.jqxButton({ theme: theme, width: 120, height: 20 }); 185 addButton.jqxButton({ theme: theme, width: 90, height: 20 });
148 // add new row. 186 // add new row.
149 addButton.click(function (event) { 187 addButton.click(function (event) {
150 editrow = -1; 188 editrow = -1;
151 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); 189 $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } });
152 $("#name").val(''); 190 $("#name").val('');
153 $("#type").val(''); 191 $("#type").val(0);
154 $("#use_use").val(''); 192 $("#use_use").val(0);
155 $("#time").val(''); 193 $("#time").val(0);
156 $("#amount_is_weight").val(''); 194 $("#amount_is_weight").val(1);
157 $("#use_for").val(''); 195 $("#use_for").val('');
158 $("#notes").val(''); 196 $("#notes").val('');
159 $("#always_on_stock").val(''); 197 $("#always_on_stock").val(0);
160 $("#inventory").val(''); 198 $("#inventory").val(0);
161 $("#cost").val(''); 199 $("#cost").val(0);
162 $("#production_date").val(''); 200 $("#production_date").val('');
163 $("#tht_date").val(''); 201 $("#tht_date").val('');
164 $("#popupWindow").jqxWindow('open'); 202 $("#popupWindow").jqxWindow('open');
165 }); 203 });
166 }, 204 },
167 filterable: true, 205 filterable: true,
168 filtermode: 'excel', 206 filtermode: 'excel',
169 columns: [ 207 columns: [
170 { text: 'Ingredient naam', datafield: 'name', width: 525 }, 208 { text: 'Ingredient naam', datafield: 'name' },
171 { text: 'Soort', datafield: 'type', align: 'center', cellsalign: 'center', width: 110 }, 209 { text: 'Type', datafield: 'type', align: 'center', cellsalign: 'center', width: 120,
172 { text: 'Gebruik', datafield: 'use_use', align: 'center', cellsalign: 'center', width: 100 }, 210 cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) {
173 { text: 'Tijd', datafield: 'time', width: 90, align: 'right', cellsalign: 'right', cellsformat: 'f2' }, 211 return "<div style='margin: 4px;' class='jqx-center-align'>" + MiscTypeData[value].nl + "</div>";
212 }
213 },
214 { text: 'Gebruik', datafield: 'use_use', align: 'center', cellsalign: 'center', width: 120,
215 cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) {
216 return "<div style='margin: 4px;' class='jqx-center-align'>" + MiscUseData[value].nl + "</div>";
217 }
218 },
219 { text: 'Tijd', datafield: 'time', width: 90, align: 'right', cellsalign: 'right', cellsformat: 'f0',
220 cellsrenderer: function (index, datafield, value, defaultvalue, column, rowdata) {
221 if (value == 0)
222 return "<div style='margin: 4px;' class='jqx-right-align'></div>";
223 if (value == 1)
224 return "<div style='margin: 4px;' class='jqx-right-align'>1 minuut</div>";
225 if (value < 60)
226 return "<div style='margin: 4px;' class='jqx-right-align'>"+dataAdapter.formatNumber(value, "f0")+" minuten</div>";
227 if (value == 60)
228 return "<div style='margin: 4px;' class='jqx-right-align'>1 uur</div>";
229 if (value < 1440)
230 return "<div style='margin: 4px;' class='jqx-right-align'>"+dataAdapter.formatNumber(value / 60, "f0")+" uren</div>";
231 if (value == 1440)
232 return "<div style='margin: 4px;' class='jqx-right-align'>1 dag</div>";
233 return "<div style='margin: 4px;' class='jqx-right-align'>"+dataAdapter.formatNumber(value / 1440, "f0")+" dagen</div>";
234 }
235 },
174 { text: 'Voor. gr/ml.', datafield: 'inventory', width: 110, align: 'right', cellsalign: 'right' }, 236 { text: 'Voor. gr/ml.', datafield: 'inventory', width: 110, align: 'right', cellsalign: 'right' },
175 { text: 'Prijs kg/l', datafield: 'cost', width: 90, align: 'right', cellsalign: 'right', cellsformat: 'c2' }, 237 { text: 'Prijs kg/l', datafield: 'cost', width: 90, align: 'right', cellsalign: 'right', cellsformat: 'c2' },
176 { text: 'THT datum', datafield: 'tht_date', width: 100, align: 'center', cellsalign: 'center' }, 238 { text: 'THT datum', datafield: 'tht_date', width: 100, align: 'center', cellsalign: 'center' },
177 { text: 'Wijzig', datafield: 'Edit', columntype: 'button', align: 'center', cellsrenderer: function () { 239 { text: 'Wijzig', datafield: 'Edit', columntype: 'button', width: 100, align: 'center', cellsrenderer: function () {
178 return "Wijzig"; 240 return "Wijzig";
179 }, buttonclick: function (row) { 241 }, buttonclick: function (row) {
180 // open the popup window when the user clicks a button. 242 // open the popup window when the user clicks a button.
181 editrow = row; 243 editrow = row;
182 $("#popupWindow").jqxWindow({ position: { x: 230, y: 30 } }); 244 $("#popupWindow").jqxWindow({ position: { x: 110, y: 30 } });
183 // get the clicked row's data and initialize the input fields. 245 // get the clicked row's data and initialize the input fields.
184 var dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow); 246 dataRecord = $("#jqxgrid").jqxGrid('getrowdata', editrow);
185 $("#name").val(dataRecord.name); 247 $("#name").val(dataRecord.name);
186 $("#type").val(dataRecord.type); 248 $("#type").val(dataRecord.type);
187 $("#use_use").val(dataRecord.use_use); 249 $("#use_use").val(dataRecord.use_use);
188 $("#time").val(dataRecord.time); 250 $("#time").val(dataRecord.time);
189 $("#amount_is_weight").val(dataRecord.amount_is_weight); 251 $("#amount_is_weight").val(dataRecord.amount_is_weight);
192 $("#always_on_stock").val(dataRecord.always_on_stock); 254 $("#always_on_stock").val(dataRecord.always_on_stock);
193 $("#inventory").val(dataRecord.inventory); 255 $("#inventory").val(dataRecord.inventory);
194 $("#cost").val(dataRecord.cost); 256 $("#cost").val(dataRecord.cost);
195 $("#production_date").val(dataRecord.production_date); 257 $("#production_date").val(dataRecord.production_date);
196 $("#tht_date").val(dataRecord.tht_date); 258 $("#tht_date").val(dataRecord.tht_date);
259 calcTotal(dataRecord.cost, dataRecord.inventory);
260 prompts(dataRecord.amount_is_weight);
197 // show the popup window. 261 // show the popup window.
198 $("#popupWindow").jqxWindow('open'); 262 $("#popupWindow").jqxWindow('open');
199 } 263 }
200 } 264 }
201 ] 265 ]
202 }); 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 $("#amount_is_weight").on('checked', function (event) {
277 dataRecord.amount_is_weight = true;
278 prompts(true);
279 });
280 $("#amount_is_weight").on('unchecked', function (event) {
281 dataRecord.amount_is_weight = false;
282 prompts(false);
283 });
284
203 // initialize the popup window and buttons. 285 // initialize the popup window and buttons.
204 $("#popupWindow").jqxWindow({ 286 $("#popupWindow").jqxWindow({
205 width: 860, resizable: false, theme: theme, isModal: true, autoOpen: false, cancelButton: $("#Cancel"), modalOpacity: 0.40 287 width: 1050,
288 height: 550,
289 resizable: false,
290 theme: theme,
291 isModal: true,
292 autoOpen: false,
293 cancelButton: $("#Cancel"),
294 modalOpacity: 0.40
206 }); 295 });
207 $("#popupWindow").on('open', function () { 296 $("#popupWindow").on('open', function () {
208 $("#name").jqxInput('selectAll'); 297 $("#name").jqxInput('selectAll');
209 }); 298 });
210 $("#Delete").jqxButton({ theme: theme }); 299 $("#Delete").jqxButton({ template: "danger", width: '90px', theme: theme });
211 $("#Delete").click(function () { 300 $("#Delete").click(function () {
212 if (editrow >= 0) { 301 if (editrow >= 0) {
213 // Open a popup to confirm this action. 302 // Open a popup to confirm this action.
214 $('#eventWindow').jqxWindow('open'); 303 $('#eventWindow').jqxWindow('open');
215 $("#delOk").click(function () { 304 $("#delOk").click(function () {
217 $("#jqxgrid").jqxGrid('deleterow', rowID); 306 $("#jqxgrid").jqxGrid('deleterow', rowID);
218 }); 307 });
219 } 308 }
220 $("#popupWindow").jqxWindow('hide'); 309 $("#popupWindow").jqxWindow('hide');
221 }); 310 });
222 $("#Cancel").jqxButton({ theme: theme }); 311 $("#Cancel").jqxButton({ template: "primary", width: '90px', theme: theme });
223 $("#Save").jqxButton({ theme: theme }); 312 $("#Save").jqxButton({ template: "success", width: '90px', theme: theme });
224 // update the edited row when the user clicks the 'Save' button. 313 // update the edited row when the user clicks the 'Save' button.
225 $("#Save").click(function () { 314 $("#Save").click(function () {
315 var rowID = -1;
226 if (editrow >= 0) { 316 if (editrow >= 0) {
227 var rowID = $('#jqxgrid').jqxGrid('getrowid', editrow); 317 rowID = $('#jqxgrid').jqxGrid('getrowid', editrow);
228 var row = { 318 }
229 record: rowID, 319 var row = {
230 name: $("#name").val(), 320 record: rowID,
231 type: $("#type").val(), 321 name: $("#name").val(),
232 use_use: $("#use_use").val(), 322 type: $("#type").val(),
233 time: parseFloat($("#time").jqxNumberInput('decimal')), 323 use_use: $("#use_use").val(),
234 amount_is_weight: $("#amount_is_weight").val(), 324 time: parseFloat($("#time").jqxNumberInput('decimal')),
235 use_for: $("#use_for").val(), 325 amount_is_weight: $("#amount_is_weight").val(),
236 notes: $("#notes").val(), 326 use_for: $("#use_for").val(),
237 always_on_stock: $("#always_on_stock").val(), 327 notes: $("#notes").val(),
238 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')), 328 always_on_stock: $("#always_on_stock").val(),
239 cost: parseFloat($("#cost").jqxNumberInput('decimal')), 329 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')),
240 production_date: $("#production_date").val(), 330 cost: parseFloat($("#cost").jqxNumberInput('decimal')),
241 tht_date: $("#tht_date").val() 331 production_date: $("#production_date").val(),
242 }; 332 tht_date: $("#tht_date").val()
333 };
334 if (editrow >= 0) {
243 $('#jqxgrid').jqxGrid('updaterow', rowID, row); 335 $('#jqxgrid').jqxGrid('updaterow', rowID, row);
244 $("#popupWindow").jqxWindow('hide');
245 } else { 336 } else {
246 // Insert a record 337 $('#jqxgrid').jqxGrid('addrow', null, row);
247 var newrow = { 338 }
248 record: -1, 339 $("#popupWindow").jqxWindow('hide');
249 name: $("#name").val(), 340 location.reload( true ); // reload ourself.
250 type: $("#type").val(),
251 use_use: $("#use_use").val(),
252 time: parseFloat($("#time").jqxNumberInput('decimal')),
253 amount_is_weight: $("#amount_is_weight").val(),
254 use_for: $("#use_for").val(),
255 notes: $("#notes").val(),
256 always_on_stock: $("#always_on_stock").val(),
257 inventory: parseFloat($("#inventory").jqxNumberInput('decimal')),
258 cost: parseFloat($("#cost").jqxNumberInput('decimal')),
259 production_date: $("#production_date").val(),
260 tht_date: $("#tht_date").val()
261 };
262 $('#jqxgrid').jqxGrid('addrow', null, newrow);
263 $("#popupWindow").jqxWindow('hide');
264 }
265 }); 341 });
266 createDelElements(); 342 createDelElements();
267 }); 343 });
268 344

mercurial