<mvc:View
	height="100%"
	controllerName="sap.m.sample.DynamicDateRange.DynamicDateRange"
	xmlns:core="sap.ui.core"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns:l="sap.ui.layout"
	xmlns="sap.m">

	<Table id="payments-table"
		inset="false"
		items="{
			path: '/payments'
		}">
		<headerToolbar>
			<OverflowToolbar>
				<content>
					<Title text="Payments" level="H2"/>
					<ToolbarSpacer/>

					<Label visible="false" text="Transaction date" labelFor="dynamic-range"/>
					<DynamicDateRange
						id="dynamic-range"
						change="onChange"
						width="{env>/filterInputWidth}"/>
				</content>
			</OverflowToolbar>
		</headerToolbar>
		<infoToolbar>
			<OverflowToolbar>
				<Label text="List of payments"/>
			</OverflowToolbar>
		</infoToolbar>
		<columns>
			<Column>
				<Text text="Transaction date" />
			</Column>
			<Column
				hAlign="Center">
				<Text text="Transaction type" />
			</Column>
			<Column
				hAlign="End">
				<Text text="Amount" />
			</Column>
		</columns>
		<items>
		<ColumnListItem>
				<cells>
					<Text
						text="{ path: 'PerfomDateTime', formatter: '._dateFormatter'}" />
					<Text
						text="{TransactionType}" />
					<ObjectNumber
							number="{
								parts:[{path:'Amount'},{path:'CurrencyCode'}],
								type: 'sap.ui.model.type.Currency',
								formatOptions: {showMeasure: false}
							}"
							unit="{CurrencyCode}" />
				</cells>
			</ColumnListItem>
		</items>
	</Table>
	<l:VerticalLayout id="tableLayout"/>
</mvc:View>


