<mvc:View
	controllerName="com.example.fiori.eliq.controller.Worklist"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns="sap.m"
	xmlns:f="sap.f"
	xmlns:core="sap.ui.core"
	height="100%">
	<f:DynamicPage id="worklistPage" toggleHeaderOnTitleClick="false">
		<f:title>
			<f:DynamicPageTitle>
				<f:heading>
					<VBox>
						<Title text="{i18n>appTitle}" />
						<Text text="{i18n>appSubtitle}" />
					</VBox>
				</f:heading>
				<f:actions>
					<ObjectStatus
						text="{app>/user/name} · {app>/user/office}"
						state="Information"
						class="sapUiTinyMarginEnd" />
					<Button text="{i18n>navSearch}" icon="sap-icon://search" press=".onNavSearch" type="Transparent" />
					<Button icon="sap-icon://home" tooltip="{i18n>navHome}" press=".onNavHome" type="Transparent" />
				</f:actions>
			</f:DynamicPageTitle>
		</f:title>
		<f:header>
			<f:DynamicPageHeader pinnable="true">
				<HBox wrap="Wrap" alignItems="Center">
					<IconTabBar
						id="processTabs"
						selectedKey="{app>/process}"
						select=".onProcessSelect"
						class="sapUiSmallMarginEnd">
						<items>
							<IconTabFilter key="INVOICE" text="{i18n>processInvoice}" icon="sap-icon://sales-order" count="{eliq>/invoiceCounts/ALL}" />
							<IconTabFilter key="ADL" text="{i18n>processAdl}" icon="sap-icon://expense-report" count="{eliq>/adlCounts/ALL}" />
						</items>
					</IconTabBar>
					<SearchField
						width="16rem"
						placeholder="{i18n>filterPlaceholder}"
						search=".onSearch"
						liveChange=".onSearch" />
				</HBox>
			</f:DynamicPageHeader>
		</f:header>
		<f:content>
			<VBox class="sapUiSmallMargin">
				<MessageStrip
					text="{i18n>worklistHint}"
					type="Information"
					showIcon="true"
					class="sapUiSmallMarginBottom" />
			<HBox fitContainer="true" renderType="Bare">
				<List
					id="stageList"
					width="14rem"
					class="eliqStageList sapUiSmallMarginEnd"
					mode="SingleSelectMaster"
					includeItemInSelection="true"
					selectionChange=".onStageSelect"
					items="{work>/stages}"
					headerText="{i18n>stagesTitle}">
					<StandardListItem
						title="{work>text}"
						info="{work>count}"
						type="Active" />
				</List>
				<VBox width="100%" renderType="Bare">
					<!-- Fatture -->
					<Table
						id="invoiceTable"
						visible="{= ${app>/process} === 'INVOICE' }"
						mode="None"
						growing="true"
						growingThreshold="20"
						items="{eliq>/invoices}">
						<headerToolbar>
							<OverflowToolbar>
								<Title text="{i18n>todoInvoices}" level="H2" />
								<ToolbarSpacer />
								<Label text="{i18n>mockHint}" />
							</OverflowToolbar>
						</headerToolbar>
						<columns>
							<Column width="3rem"><Text text="" /></Column>
							<Column width="10em"><Text text="{i18n>colId}" /></Column>
							<Column><Text text="{i18n>colInvoice}" /></Column>
							<Column minScreenWidth="Tablet" demandPopin="true"><Text text="{i18n>colSupplier}" /></Column>
							<Column hAlign="End" width="8em"><Text text="{i18n>colAmount}" /></Column>
							<Column minScreenWidth="Desktop" demandPopin="true"><Text text="{i18n>colStage}" /></Column>
							<Column minScreenWidth="Desktop" demandPopin="true"><Text text="{i18n>colAssignee}" /></Column>
						</columns>
						<items>
							<ColumnListItem type="Navigation" press=".onInvoicePress">
								<cells>
									<Button
										icon="{= ${eliq>Watch} ? 'sap-icon://favorite' : 'sap-icon://unfavorite' }"
										type="Transparent"
										press=".onToggleWatch"
										tooltip="{i18n>watch}" />
									<ObjectIdentifier title="{eliq>InvoiceId}" text="{eliq>ProtocolNumber}/{eliq>ProtocolYear}" />
									<Text text="{eliq>InvoiceNumber}" />
									<Text text="{eliq>Supplier}" />
									<ObjectNumber
										class="eliqAmount"
										number="{
											parts: [{ path: 'eliq>Amount' }, { path: 'eliq>Currency' }],
											formatter: '.formatter.currency'
										}" />
									<ObjectStatus
										text="{eliq>StageText}"
										state="{path: 'eliq>Stage', formatter: '.formatter.stageState'}" />
									<Text text="{eliq>Assignee}" />
								</cells>
							</ColumnListItem>
						</items>
					</Table>
					<!-- ADL -->
					<Table
						id="adlTable"
						visible="{= ${app>/process} === 'ADL' }"
						mode="None"
						growing="true"
						growingThreshold="20"
						items="{eliq>/adls}">
						<headerToolbar>
							<OverflowToolbar>
								<Title text="{i18n>todoAdls}" level="H2" />
								<ToolbarSpacer />
								<Label text="{i18n>mockHint}" />
							</OverflowToolbar>
						</headerToolbar>
						<columns>
							<Column width="3rem"><Text text="" /></Column>
							<Column width="10em"><Text text="{i18n>colAdl}" /></Column>
							<Column width="5em"><Text text="{i18n>colType}" /></Column>
							<Column minScreenWidth="Tablet" demandPopin="true"><Text text="{i18n>colOffice}" /></Column>
							<Column hAlign="End" width="8em"><Text text="{i18n>colAmount}" /></Column>
							<Column minScreenWidth="Desktop" demandPopin="true"><Text text="{i18n>colStage}" /></Column>
							<Column minScreenWidth="Desktop" demandPopin="true"><Text text="{i18n>colAssignee}" /></Column>
						</columns>
						<items>
							<ColumnListItem type="Navigation" press=".onAdlPress">
								<cells>
									<Button
										icon="{= ${eliq>Watch} ? 'sap-icon://favorite' : 'sap-icon://unfavorite' }"
										type="Transparent"
										press=".onToggleWatch"
										tooltip="{i18n>watch}" />
									<ObjectIdentifier title="{eliq>AdlId}" text="{eliq>FiscalYear}" />
									<Text text="{eliq>AdlType}" />
									<Text text="{eliq>Office}" />
									<ObjectNumber
										class="eliqAmount"
										number="{
											parts: [{ path: 'eliq>Amount' }, { path: 'eliq>Currency' }],
											formatter: '.formatter.currency'
										}" />
									<ObjectStatus
										text="{eliq>StageText}"
										state="{path: 'eliq>Stage', formatter: '.formatter.stageState'}" />
									<Text text="{eliq>Assignee}" />
								</cells>
							</ColumnListItem>
						</items>
					</Table>
				</VBox>
			</HBox>
			</VBox>
		</f:content>
	</f:DynamicPage>
</mvc:View>
