<?page contentType="text/html;charset=UTF-8"?>
<listbox
	vflex="1"
	model="@load(vm.dataList)"
	selectedItem="@bind(vm.dataBean)">
	<listhead menupopup="auto">
		<listheader
			label="${labels.InvoicingRequirementNumber}"
			sort="czech(requirement.numser)"
			onCreate="self.sort(false)"
			width="130px" />
		<listheader
			label="${labels.RequirementsGridReqDate}"
			sort="auto(requirement.reqDate)"
			width="150px" />
		<listheader
			label="${labels.RequirementsGridCenter}"
			sort="czech(requirement.centre.fullName)"
			width="180px" />
		<listheader
			label="${labels.RequirementsGridWorkgroup}"
			sort="czech(requirement.workgroup.fullName)"
			width="180px" />
		<listheader
			label="${labels.InvoicingApplicant}"
			sort="czech(requirement.ownedBy.fullName)"
			width="180px" />
		<listheader
			label="${labels.InvoicingDescription}"
			sort="czech(requirement.description)"
			width="" />
		<listheader
			label="${labels.InvoicingRequirementPrice}"
			sort="auto(requirement.sumTotal)"
			align="right"
			width="130px" />
		<listheader
			label="${labels.InvoicingInvoicedPrice}"
			align="right"
			sort="auto(totalInvoiced)"
			width="130px" />
	</listhead>
	<auxhead
		sclass="category-center"
		visible="@load(vm.filter)">
		<auxheader>
			<div sclass="find-grid-cell">
				<div sclass="find-grid-divtextbox">
					<textbox
						value="@bind(vm.filterTemplate.requirement.numser)"
						instant="true"
						onChange="@command('doFilter')"
						maxlength="@load(vm.lengthText)"
						sclass="find-grid-textbox" />
				</div>
				<div sclass="find-grid-img">
					<image src="/img/funnel.png" />
				</div>
			</div>
		</auxheader>
		<auxheader>
			<div sclass="find-grid-cell">
				<div sclass="find-grid-divtextbox">
					<datebox
						value="@bind(vm.filterTemplate.requirement.reqDate)"
						format="${labels.DateFormat}"
						instant="true"
						onChange="@command('doFilter')"
						sclass="find-grid-textbox" />
				</div>
				<div sclass="find-grid-img">
					<image src="/img/funnel.png" />
				</div>
			</div>
		</auxheader>
		<auxheader>
			<div sclass="find-grid-cell">
				<combobox
					ctrlKeys="${labels.HandleComboKeyFilter}"
					onCtrlKey="@command('handleComboKeyFilter', ctrl=self, keyEvent=event)"
					onChange="@command('doFilter')"
					model="@load(vm.centres)"
					readonly="true"
					width="100%"
					selectedItem="@bind(vm.filterTemplate.requirement.centre)">
					<template name="model">
						<comboitem label="@load(each.fullName)" />
					</template>
				</combobox>
				<div sclass="find-grid-img">
					<image src="/img/funnel.png" />
				</div>
			</div>
		</auxheader>
		<auxheader>
			<div sclass="find-grid-cell">
				<combobox
					ctrlKeys="${labels.HandleComboKeyFilter}"
					onCtrlKey="@command('handleComboKeyFilter', ctrl=self, keyEvent=event)"
					onChange="@command('doFilter')"
					model="@load(vm.workgroups)"
					readonly="true"
					width="100%"
					selectedItem="@bind(vm.filterTemplate.requirement.workgroup)">
					<template name="model">
						<comboitem label="@load(each.fullName)" />
					</template>
				</combobox>
				<div sclass="find-grid-img">
					<image src="/img/funnel.png" />
				</div>
			</div>
		</auxheader>
		<auxheader>
			<div zclass="find-grid-cell">
				<div sclass="find-grid-divtextbox">
					<combobox
						ctrlKeys="${labels.HandleComboKeyFilter}"
						onCtrlKey="@command('handleComboKeyFilter', ctrl=self, keyEvent=event)"
						onChange="@command('doFilter')"
						width="100%"
						selectedItem="@bind(vm.filterTemplate.requirement.ownedBy)"
						model="@load(vm.users)"
						readonly="true">
						<template name="model">
							<comboitem label="@load(each.fullName)" />
						</template>
					</combobox>
				</div>
				<div sclass="find-grid-img">
					<image src="/img/funnel.png" />
				</div>
			</div>
		</auxheader>
		<auxheader>
			<div sclass="find-grid-cell">
				<div sclass="find-grid-divtextbox">
					<textbox
						value="@bind(vm.filterTemplate.requirement.description)"
						instant="true"
						onChange="@command('doFilter')"
						maxlength="@load(vm.lengthDescription)"
						sclass="find-grid-textbox" />
				</div>
				<div sclass="find-grid-img">
					<image src="/img/funnel.png" />
				</div>
			</div>
		</auxheader>
		<auxheader>
			<!-- div sclass="find-grid-cell">
				<div sclass="find-grid-divtextbox">
				<textbox
				value="@bind(vm.filterTemplate.requirement.sumTotal) @converter(vm.standardBigDecimalConverter)"
				instant="true"
				onChange="@command('doFilter')"
				maxlength="@load(vm.lengthText)"
				sclass="find-grid-textbox" />
				</div>
				<div sclass="find-grid-img">
				<image src="/img/funnel.png" />
				</div>
				</div -->
		</auxheader>
		<auxheader>
			<!-- div sclass="find-grid-cell">
				<div sclass="find-grid-divtextbox">
				<textbox
				value="@bind(vm.filterTemplate.totalInvoiced) @converter(vm.standardBigDecimalConverter)"
				instant="true"
				onChange="@command('doFilter')"
				maxlength="@load(vm.lengthText)"
				sclass="find-grid-textbox" />
				</div>
				<div sclass="find-grid-img">
				<image src="/img/funnel.png" />
				</div>
				</div-->
		</auxheader>
	</auxhead>
	<template name="model">
		<listitem>
			<listcell label="@load(each.requirement.numser)" />
			<listcell label="@load(each.requirement.reqDate)  @converter('formatedDate', format=labels.DateFormat)" />
			<listcell label="@load(each.requirement.centre)" />
			<listcell label="@load(each.requirement.workgroup)" />
			<listcell label="@load(each.requirement.ownedBy)" />
			<listcell label="@load(each.requirement.description)" />
			<listcell label="@load(each.requirement.sumTotal) @converter(vm.standardBigDecimalConverter)" />
			<listcell
				label="@load(each.totalInvoiced) @converter(vm.standardBigDecimalConverter)"
				style="@load(each.totalInvoiced gt each.requirement.sumTotal ? ' color: red;' : '' )" />
		</listitem>
	</template>
</listbox>
