hedera-web-mindshore/web/forms/ecomerce/checkout/ui.xml

<vn>
<vn-group>
	<vn-param id="method"/>
	<vn-param id="date"/>
	<vn-param id="agency"/>
	<vn-param id="address" on-changed="onAddressChange"/>
	<db-form id="defaults" on-ready="onValuesReady">
		<db-model>
			SELECT delivery_method, agency_id, address_id
				FROM basket_defaults
		</db-model>
	</db-form>
	<db-form id="order-form" on-ready="onValuesReady">
		<db-model>
			SELECT v.code delivery_method, o.date_send, o.agency_id, o.address_id
				FROM basket o
					JOIN vn2008.Vistas v ON o.delivery_method_id = v.vista_id
		</db-model>
	</db-form>
	<db-model property="model" id="agencies" auto-load="false" result-index="1" on-status-changed="onAgenciesReady">
		CALL agency_list_from_date (#date, #address);
		SELECT a.Id_Agencia, a.description
			FROM t_agency t
				JOIN vn2008.Agencias a ON a.Id_Agencia = t.agency_id
				JOIN vn2008.Vistas v ON a.Vista = v.vista_id
			WHERE a.web != FALSE
				AND v.code = 'AGENCY'
			ORDER BY a.description;
		DROP TEMPORARY TABLE t_agency;
		<sql-batch property="batch">
			<item name="address" param="address"/>
			<item name="date" param="date"/>
		</sql-batch>
	</db-model>
	<db-model property="model" id="warehouses" auto-load="false" result-index="1" on-status-changed="onWarehousesReady">
		CALL agency_list_from_date (#date, NULL);
		SELECT a.Id_Agencia, SUBSTR(a.description, 5) description
			FROM t_agency t
				JOIN vn2008.Agencias a ON a.Id_Agencia = t.agency_id
				JOIN vn2008.Vistas v ON a.Vista = v.vista_id
			WHERE a.web != FALSE
				AND v.code = 'PICKUP'
			ORDER BY a.description;
		DROP TEMPORARY TABLE t_agency;
		<sql-batch property="batch">
			<item name="date" param="date"/>
		</sql-batch>
	</db-model>
</vn-group>
<div id="form" class="checkout">
	<div class="box">
		<div class="header">
			<h1><t>ConfigureOrder</t></h1>
			<div class="action-bar">
				<button on-click="onCancelClick">
					<img src="image/dark/close.svg" alt=""/>
					<t>Cancel</t>
				</button>
			</div>
			<div class="clear"/>
		</div>
		<div class="form">
			<htk-assistant
				id="assistant"
				step-count="5"
				step-func="stepFunc"
				node="assistant-node"/>
			<div id="assistant-node">
				<div id="method-step">
					<h2><t>DeliveryOrPickupQuestion</t></h2>
					<div class="answers radio">
						<htk-radio-group
							id="rg-method"
							param="method"
							on-changed="onFieldChange"/>
						<div>
							<htk-radio radio-group="rg-method" value="AGENCY"/>
							<label><t>ReceiveThroughtAgency</t></label>
						</div>
						<div>
							<htk-radio radio-group="rg-method" value="DELIVERY"/>
							<label><t>ReceiveThroughtRoute</t></label>
						</div>
						<div>
							<htk-radio radio-group="rg-method" value="PICKUP"/>
							<label><t>PickupInStore</t></label>
						</div>
					</div>
				</div>
				<div id="date-step">
					<h2 id="date-question"><t>OrderDateDeliveryQuestion</t></h2>
					<div class="answers">
						<htk-calendar
							id="calendar"
							class="thin-calendar"
							param="date"
							restrict-func="calendarRestrict"
							on-changed="onFieldChange"/>
					</div>
				</div>
				<div id="address-step">
					<h2><t>AddressQuestion</t></h2>
					<db-form id="address-form" model="addresses"/>
					<div class="answers target">
						<htk-repeater
							id="repeater"
							form-id="iter"
							on-change="onAddressChange"
							renderer="addressRenderer">
							<db-model id="addresses">
								SELECT a.id, a.consignee, p.name province, a.zip_code, a.city, a.name, a.active, c.Pais country
									FROM address_view a
									LEFT JOIN vn2008.province p ON a.province_id = p.province_id
									JOIN vn2008.Paises c ON c.Id = p.Paises_Id
										WHERE active != FALSE
							</db-model>
							<template>
								<div class="address" id="address">
									<p class="consignee">
										<htk-text form="iter" column="consignee"/>
									</p>
									<p>
										<htk-text form="iter" column="name"/>
									</p>
								</div>
							</template>
						</htk-repeater>
					</div>
				</div>
				<div id="agency-step">
					<h2><t>AgencyQuestion</t></h2>
					<div class="answers target">
						<htk-combo
							id="agency-combo"
							param="agency"
							on-changed="onFieldChange"
							model="agencies"/>
					</div>
				</div>
				<div id="pickup-step">
					<h2><t>PickupWarehouseQuestion</t></h2>
					<div class="answers target">
						<htk-combo
							id="warehouse-combo"
							param="agency"
							on-changed="onFieldChange"
							model="warehouses"/>
					</div>
				</div>
				<div id="confirm-agency-step" class="confirm">
					<h2><t>ConfirmToAccessCatalog</t></h2>
					<div class="answers target">
						<p>
							<t>Arrival</t> 
							<htk-text format="_%A, %e of %B" param="date"/>
						</p>
						<p>
							<htk-text form="address-form" column="name"/>
						</p>
						<p>
							<t>Agency</t> 
							<htk-text form="agency-combo" column="description"/>
						</p>
						<button class="thin" on-click="onConfirmClick">
							<t>Confirm</t>
						</button>
						<div class="clear"/>
					</div>
				</div>
				<div id="confirm-delivery-step" class="confirm">
					<h2><t>ConfirmToAccessCatalog</t></h2>
					<div class="answers target">
						<p>
							<t>Arrival</t> 
							<htk-text format="_%A, %e of %B" param="date"/>
						</p>
						<p>
							<htk-text form="address-form" column="name"/>
						</p>
						<p>
							<t>ReceiveThroughtRoute</t>
						</p>
						<button class="thin" on-click="onConfirmClick">
							<t>Confirm</t>
						</button>
						<div class="clear"/>
					</div>
				</div>
				<div id="confirm-pickup-step" class="confirm">
					<h2><t>ConfirmToAccessCatalog</t></h2>
					<div class="answers target">
						<p>
							<t>Pickup</t> 
							<htk-text format="_%A, %e of %B" param="date"/>
						</p>
						<p>
							<t>Warehouse</t> 
							<htk-text form="warehouse-combo" column="description"/>
						</p>
						<button class="thin" on-click="onConfirmClick">
							<t>Confirm</t>
						</button>
						<div class="clear"/>
					</div>
				</div>
			</div>
			<htk-assistant-bar assistant="assistant"/>
		</div>
	</div>
</div>
</vn>