<mvc:View
	controllerName="<%= fioriComponentNamespace %>.view.AddProduct"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns:l="sap.ui.layout"
	xmlns:f="sap.ui.layout.form"
	xmlns:c="sap.ui.core"
	xmlns="sap.m">
	<Page
		class="sapUiFioriObjectPage"
		title="{i18n>addProductTitle}">
		<l:Grid
			defaultSpan="L12 M12 S12"
			width="auto">
			<l:content>
				<f:SimpleForm
					id="idAddProductForm"
					minWidth="800"
					maxContainerCols="2"
					editable="true"
					layout="ResponsiveGridLayout"
					title="New Product"
					labelSpanL="3"
					labelSpanM="3"
					emptySpanL="4"
					emptySpanM="4"
					columnsL="1"
					columnsM="1"
					class="editableForm">
					<f:content>
						<!-- Basic info -->
						<c:Title text="{i18n>addProductTitleBasic}" />
						<Label text="{i18n>addProductLabelName}" />
						<Input value="{newProduct>/Detail/Name}" />
						<Label text="{i18n>addProductLabelDescription}" />
						<TextArea value="{newProduct>/Detail/Description}" />
						<Label text="{i18n>addProductLabelReleaseDate}" />
						<DateTimeInput
							type="Date"
							value="{newProduct>/Detail/ReleaseDate}" />
						<Label text="{i18n>addProductLabelPrice}" />
						<Input value="{newProduct>/Detail/Price}" />
						<Label text="{i18n>addProductLabelRating}" />
						<RatingIndicator
							visualMode="Full"
							value="{newProduct>/Detail/Rating}" />
						<!-- Discontinued? -->
						<c:Title text="{i18n>addProductTitleDiscontinued}" />
						<Label text="{i18n>addProductLabelDiscontinuedFlag}" />
						<CheckBox selected="{newProduct>/Detail/DiscontinuedFlag}" />
						<Label
							visible="{newProduct>/Detail/DiscontinuedFlag}"
							text="{i18n>addProductLabelDiscontinuedDate}" />
						<DateTimeInput
							type="Date"
							visible="{newProduct>/Detail/DiscontinuedFlag}"
							value="{newProduct>/Detail/DiscontinuedDate}" />
						<!-- Supplier & Category -->
						<c:Title text="{i18n>addProductTitleSupplierCategory}" />
						<Label text="{i18n>addProductLabelSupplier}" />
						<Select
							id="idSelectSupplier"
							items="{/Suppliers}"
							width="100%">
							<c:Item text="{Name}" />
						</Select>
						<Label text="{i18n>addProductLabelCategory}" />
						<Select
							id="idSelectCategory"
							items="{/Categories}"
							width="100%">
							<c:Item text="{Name}" />
						</Select>
					</f:content>
				</f:SimpleForm>
			</l:content>
		</l:Grid>
		<footer>
			<Toolbar>
				<ToolbarSpacer/>
				<Button text="{i18n>addProductButtonSave}" type="Emphasized" press="onSave" />
				<Button text="{i18n>addProductButtonCancel}" press="onCancel" />
			</Toolbar>
		</footer>
	</Page>
</mvc:View>
