<vlayout
	form="@id('fx') @load(vm.dataBean) @save(vm.dataBean, before='save') @validator(vm.requirementFormValidator)"
	hflex="1"
	vflex="1">
	<grid hflex="min">
		<columns>
			<column
				align="right"
				hflex="min" />
			<column />
		</columns>
		<rows>
			<row>
				<cell sclass="row-title"></cell>
				<cell>
					<checkbox
						label="${labels.StudentProject}"
						checked="@bind(fx.project)" />
				</cell>
			</row>
			<row>
				<cell sclass="row-title">${labels.RequirementsFormNumberSerie} :</cell>
				<cell>
					<textbox
						id="numser"
						width="150px"
						constraint="@load(vm.constriant)"
						value="@bind(fx.numser)"
						maxlength="@load(vm.lengthText)"
						readonly="true" />
				</cell>
			</row>
			<row>
				<cell sclass="row-title">${labels.RequirementsFormReqDate} :</cell>
				<cell>
					<datebox
						id="reqDate"
						width="150px"
						value="@bind(fx.reqDate)"
						format="${labels.DateFormat}" />
				</cell>
			</row>
			<row>
				<cell sclass="row-title">${labels.RequirementsFormCenter} :</cell>
				<cell>
					<combobox
						id="idReqCenter"
						width="150px"
						model="@load(vm.centres)"
						readonly="true"
						disabled="@load(vm.editRec)"
						selectedItem="@bind(fx.centre)">
						<template name="model">
							<comboitem label="@load(each.fullName)" />
						</template>
					</combobox>
				</cell>
			</row>
			<row>
				<cell sclass="row-title">${labels.RequirementsFormDeliveryDate} :</cell>
				<cell>
					<datebox
						id="deliveryDate"
						width="150px"
						value="@bind(fx.deliveryDate)"
						format="${labels.DateFormat}" />
				</cell>
			</row>
			<row>
				<cell sclass="row-title">${labels.Amount} :</cell>
				<cell>
					<textbox
						id="idSumTotal"
						readonly="true"
						width="150px"
						maxlength="@load(vm.lengthText)"
						value="@bind(fx.sumTotal) @converter(vm.standardBigDecimalConverter)" />
				</cell>
			</row>
			<row>
				<cell sclass="row-title">${labels.RequirementsFormDescription} :</cell>
				<cell>
					<textbox
						id="description"
						width="400px"
						rows="5"
						maxlength="@load(vm.lengthDescription)"
						value="@bind(fx.description)" />
				</cell>
			</row>
		</rows>
	</grid>
	<hbox>
		<button
			disabled="@load(empty fx.centre)"
			image="/img/item-add.png"
			label="${labels.AddItem}"
			onClick="@command('addNewItem')"
			sclass="nicebutton" />
		<button
			disabled="@load(empty fx.centre)"
			image="/img/item-add.png"
			label="${labels.SelectGroup}"
			onClick="@command('addSelectedItem')"
			sclass="nicebutton" />
	</hbox>
	<listbox
		vflex="1"
		model="@load(vm.syncItems)"
		selectedItem="@bind(vm.selectedItem)"
		selectedIndex="@bind(vm.selItemIndex)">
		<listhead>
			<listheader
				hflex="10"
				label="${labels.RequirementItemCode}" />
			<listheader
				hflex="15"
				label="${labels.RequirementItemName}" />
			<listheader
				hflex="30"
				label="${labels.RequirementItemText}" />
			<listheader
				hflex="10"
				align="right"
				label="${labels.RequirementItemQuantity}" />
			<listheader
				hflex="10"
				label="${labels.RequirementItemMUnit}" />
			<listheader
				hflex="10"
				align="right"
				label="${labels.RequirementItemUnitPrice}" />
			<listheader
				hflex="10"
				align="right"
				label="${labels.RequirementItemTotal}" />
			<listheader
				hflex="15"
				label="${labels.RequirementItemDescription}" />
			<listheader hflex="10" />
		</listhead>
		<template name="model">
			<listitem>
				<listcell>
					<combobox
						width="100%"
						value="@bind(each.code)"
						model="@load(vm.requirementGroups)"
						inplace="true"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						onChange="@command('onChangeGroup')"
						autocomplete="true"
						selectedItem="@bind(each.reqSubject)">
						<template
							name="model"
							var="subject">
							<comboitem label="@load(subject.code)" />
						</template>
					</combobox>
				</listcell>
				<listcell>
					<textbox
						inplace="true"
						sclass="grid-textbox-max"
						readonly="false"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						maxlength="@load(vm.lengthText)"
						value="@bind(each.name)" />
				</listcell>
				<listcell>
					<textbox
						inplace="true"
						sclass="grid-textbox-max"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						maxlength="@load(vm.lengthText)"
						value="@bind(each.textItem)" />
				</listcell>
				<listcell>
					<textbox
						inplace="true"
						sclass="grid-textbox-max-right"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						onChange="@command('recalculate', form=fx, changed='quantity')"
						maxlength="@load(vm.lengthText)"
						value="@bind(each.quantity) @converter(vm.standardBigDecimalConverter)" />
				</listcell>
				<listcell>
					<textbox
						inplace="true"
						sclass="grid-textbox-max"
						readonly="false"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						maxlength="@load(vm.lengthText)"
						value="@bind(each.munit.name)" />
				</listcell>
				<listcell>
					<textbox
						inplace="true"
						sclass="grid-textbox-max-right"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						onChange="@command('recalculate', form=fx, changed='unitprice')"
						maxlength="@load(vm.lengthText)"
						value="@bind(each.unitPrice) @converter(vm.standardBigDecimalConverter)" />
				</listcell>
				<listcell>
					<textbox
						inplace="true"
						sclass="grid-textbox-max-right"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						onChange="@command('recalculate', form=fx, changed='total')"
						maxlength="@load(vm.lengthText)"
						value="@bind(each.total) @converter(vm.standardBigDecimalConverter)" />
				</listcell>
				<listcell>
					<textbox
						inplace="true"
						sclass="grid-textbox-max"
						onFocus="@command('onFocusItem', item=each, ctrl=self)"
						maxlength="@load(vm.lengthDescription)"
						value="@bind(each.description)" />
				</listcell>
				<listcell
					sclass="grid-textbox-max"
					style="text-align:center">
					<button
						image="~./zul/img/misc/drag-disallow.png"
						label="${labels.RemoveItem}"
						onClick="@command('removeItem', form=fx, item=each)"
						sclass="nicebutton" />
				</listcell>
			</listitem>
		</template>
	</listbox>
	<include src="/app/formButtons.zul" />
</vlayout>
