337 lines
6.9 KiB
JavaScript
337 lines
6.9 KiB
JavaScript
import './style.scss';
|
|
|
|
const Catalog = new Class({
|
|
Extends: Hedera.Form,
|
|
Template: require('./ui.xml')
|
|
|
|
,_menuShown: false
|
|
|
|
,async open() {
|
|
let isOk = true;
|
|
|
|
if (!localStorage.getItem('hederaGuest'))
|
|
isOk = await Hedera.BasketChecker.check(this.conn, this.hash);
|
|
else
|
|
await this.conn.execQuery('CALL mybasket_configureForGuest');
|
|
|
|
if (isOk) await Hedera.Form.prototype.open.call(this);
|
|
}
|
|
|
|
,activate() {
|
|
document.body.appendChild(this.$.rightPanel);
|
|
this.$.items.setInfo('i', 'item', 'vn', ['id']);
|
|
|
|
if (localStorage.getItem('hederaView'))
|
|
this.setView(parseInt(localStorage.getItem('hederaView')));
|
|
else
|
|
this.setView(Catalog.View.GRID);
|
|
|
|
this.onFilterChange();
|
|
}
|
|
|
|
,deactivate() {
|
|
this.hideMenu();
|
|
this.gui.$.topBar.style.backgroundColor = '';
|
|
Vn.Node.remove(this.$.rightPanel);
|
|
}
|
|
|
|
,getFilter(params, tags, currentTag) {
|
|
if (params.search == null && params.realm == null)
|
|
return;
|
|
|
|
const $ = this.$;
|
|
|
|
params = Object.assign({}, params);
|
|
const filter = new Sql.Operation({
|
|
type: Sql.Operation.Type.AND
|
|
});
|
|
|
|
let idSearch = false;
|
|
if (params.search != null) {
|
|
idSearch = /^\d+$/.test(params.search);
|
|
|
|
if (!idSearch) {
|
|
filter.push($.searchOp);
|
|
params.search = `%${params.search}%`;
|
|
} else
|
|
filter.push($.idOp);
|
|
}
|
|
|
|
if (!idSearch) {
|
|
if (params.realm != null)
|
|
filter.push($.realmOp);
|
|
if (params.type != null)
|
|
filter.push($.typeOp);
|
|
|
|
for (const tag of tags)
|
|
if (tag != currentTag && params[tag] != null)
|
|
filter.push($[`${tag}Op`]);
|
|
}
|
|
|
|
params.filter = filter;
|
|
const lot = new Vn.Lot();
|
|
lot.setAll(params);
|
|
|
|
return lot;
|
|
}
|
|
|
|
,onFilterChange() {
|
|
const $ = this.$;
|
|
const params = $.params.$;
|
|
|
|
this.refreshTitle();
|
|
const hasRealm = params.realm != null;
|
|
$.filters.style.display = hasRealm ? 'block' : 'none';
|
|
$.realmMsg.style.display = hasRealm ? 'none' : 'block';
|
|
|
|
const tags = [
|
|
'color',
|
|
'origin',
|
|
'category',
|
|
'producer'
|
|
];
|
|
|
|
let hasTagFilter = false;
|
|
for (const tag of tags)
|
|
if (params[tag] != null) {
|
|
hasTagFilter = true;
|
|
break;
|
|
}
|
|
|
|
const refreshItems = hasTagFilter
|
|
|| params.search != null
|
|
|| params.type != null;
|
|
|
|
const lot = refreshItems && this.getFilter(params, tags);
|
|
if (lot) {
|
|
$.items.lot = lot;
|
|
$.items.refresh();
|
|
} else
|
|
$.items.clean();
|
|
|
|
for (const tag of tags)
|
|
$[`${tag}s`].lot = this.getFilter(params, tags, tag);
|
|
|
|
if (lot) this.hideMenu();
|
|
}
|
|
|
|
,refreshTitle() {
|
|
const hash = this.hash.$;
|
|
const types = this.$.types;
|
|
const realms = this.$.realms;
|
|
|
|
const type = hash.type;
|
|
const realm = hash.realm;
|
|
let typeName;
|
|
let realmName;
|
|
|
|
if (type && types.ready) {
|
|
var row = types.search('id', type);
|
|
if (row != -1) typeName = types.get(row, 'name');
|
|
}
|
|
if (realm && realms.ready) {
|
|
var row = realms.search('id', realm);
|
|
if (row != -1) realmName = realms.get(row, 'name');
|
|
}
|
|
|
|
let title = _('Catalog');
|
|
let subtitle = '';
|
|
|
|
if (typeName) {
|
|
title = typeName;
|
|
subtitle = realmName;
|
|
} else if (realmName) {
|
|
title = realmName;
|
|
}
|
|
|
|
Vn.Node.setText(this.$.titleText, title);
|
|
Vn.Node.setText(this.$.subtitle, subtitle);
|
|
}
|
|
|
|
,setView(view) {
|
|
if (view === Catalog.View.GRID) {
|
|
this.$.viewButton.setProperties({
|
|
icon: 'view_list',
|
|
tip: _('List view')
|
|
});
|
|
this.view = Catalog.View.GRID;
|
|
var className = 'grid-view';
|
|
} else {
|
|
this.$.viewButton.setProperties({
|
|
icon: 'grid_on',
|
|
tip: _('Grid view')
|
|
});
|
|
this.view = Catalog.View.LIST;
|
|
var className = 'list-view';
|
|
}
|
|
|
|
var node = this.$.gridView.node;
|
|
node.className = className;
|
|
localStorage.setItem('hederaView', this.view);
|
|
}
|
|
|
|
,onSwitchViewClick() {
|
|
this.setView(this.view === Catalog.View.LIST ?
|
|
Catalog.View.GRID : Catalog.View.LIST);
|
|
}
|
|
|
|
,onItemsChange(model, status) {
|
|
if (status !== Db.Model.Status.CLEAN)
|
|
this.$.order.style.display = 'block';
|
|
else
|
|
this.$.order.style.display = 'none';
|
|
}
|
|
|
|
,onOrderChange(e) {
|
|
var value = e.target.value;
|
|
var sortField = value.substr(2);
|
|
var sortWay = value.charAt(0) === 'A' ?
|
|
Db.Model.SortWay.ASC : Db.Model.SortWay.DESC;
|
|
|
|
if (sortField)
|
|
this.$.items.sortByName(sortField, sortWay);
|
|
|
|
this.hideMenu();
|
|
}
|
|
|
|
,realmRenderer(builder, form) {
|
|
var link = builder.$.link;
|
|
link.href = this.hash.make({
|
|
form: this.hash.$.form,
|
|
realm: form.$.id
|
|
});
|
|
}
|
|
|
|
,onRightPanelClick(event) {
|
|
event.stopPropagation();
|
|
}
|
|
|
|
,onShowMenuClick(event) {
|
|
this._menuShown = true;
|
|
event.stopPropagation();
|
|
this.gui.showBackground();
|
|
Vn.Node.addClass(this.$.rightPanel, 'show');
|
|
this.hideMenuCallback = this.hideMenu.bind(this);
|
|
document.addEventListener('click', this.hideMenuCallback);
|
|
}
|
|
|
|
,hideMenu() {
|
|
if (!this._menuShown)
|
|
return;
|
|
|
|
this.gui.hideBackground();
|
|
Vn.Node.removeClass(this.$.rightPanel, 'show');
|
|
document.removeEventListener('click', this.hideMenuCallback);
|
|
this.hideMenuCallback = null;
|
|
}
|
|
|
|
,isGuest() {
|
|
if (localStorage.getItem('hederaGuest')) {
|
|
Htk.Toast.showError(_('YouMustBeLoggedIn'));
|
|
return true;
|
|
}
|
|
|
|
return false;
|
|
}
|
|
|
|
,onBasketClick() {
|
|
if (this.isGuest())
|
|
return;
|
|
|
|
this.hash.setAll({form: 'ecomerce/basket'});
|
|
}
|
|
|
|
,onConfigureClick() {
|
|
if (this.isGuest())
|
|
return;
|
|
|
|
this.hash.setAll({form: 'ecomerce/checkout'});
|
|
}
|
|
|
|
,onAddItemClick(event, form) {
|
|
if (event.defaultPrevented) return;
|
|
event.preventDefault();
|
|
if (this.isGuest()) return;
|
|
|
|
this.onEraseClick();
|
|
this.$.$card.row = form.row;
|
|
this.$.cardLot.assign({item: form.$.id});
|
|
this.$.cardPopup.show(event.currentTarget);
|
|
}
|
|
|
|
,onAddLotClick(column, value, row) {
|
|
var model = this.$.itemLots;
|
|
var grouping = model.get(row, 'grouping');
|
|
var warehouse = model.get(row, 'warehouseFk');
|
|
var available = model.get(row, 'available');
|
|
|
|
var lotAmount = this.items[warehouse];
|
|
|
|
if (lotAmount === undefined)
|
|
lotAmount = 0;
|
|
|
|
if (lotAmount < available) {
|
|
var newAmount = lotAmount + grouping;
|
|
|
|
if (newAmount > available)
|
|
newAmount = available;
|
|
|
|
this.items[warehouse] = newAmount;
|
|
this.$.amount.value += newAmount - lotAmount;
|
|
} else
|
|
Htk.Toast.showError(_('NoMoreAmountAvailable'));
|
|
}
|
|
|
|
,async onConfirmClick() {
|
|
var sql = '';
|
|
var query = new Sql.String({query: 'CALL myBasket_addItem(#warehouse, #item, #amount);'});
|
|
var amountSum = 0;
|
|
|
|
for (var warehouse in this.items) {
|
|
var amount = this.items[warehouse];
|
|
amountSum += amount;
|
|
|
|
const params = {
|
|
warehouse: warehouse,
|
|
item: this.$.cardLot.$.item,
|
|
amount: amount
|
|
}
|
|
sql += query.render(params);
|
|
}
|
|
|
|
if (amountSum > 0) {
|
|
this.conn.execQuery(sql);
|
|
|
|
var itemName = this.$.$card.get('item');
|
|
Htk.Toast.showMessage(
|
|
Vn.Value.sprintf(_('Added%dOf%s'), amountSum, itemName));
|
|
}
|
|
|
|
this.$.cardPopup.hide();
|
|
}
|
|
|
|
,onEraseClick() {
|
|
this.$.amount.value = 0;
|
|
this.items = {};
|
|
}
|
|
|
|
,onPopupClose() {
|
|
this.onEraseClick();
|
|
this.$.$card.row = -1;
|
|
this.$.cardLot.value = undefined;
|
|
}
|
|
|
|
,onCardLoad() {
|
|
this.$.cardPopup.reset();
|
|
}
|
|
});
|
|
|
|
Catalog.extend({
|
|
View: {
|
|
LIST: 0,
|
|
GRID: 1
|
|
}
|
|
});
|
|
|
|
export default Catalog;
|