146 lines
9.6 KiB
Smarty
146 lines
9.6 KiB
Smarty
|
|
<input type="hidden" id="product-additional-info-product-id" value="{$productId}">
|
|
<input type="hidden" id="product-additional-info-category-id" value="{$categoryId}">
|
|
<input type="hidden" id="product-additional-info-product-attribute-id" value="{$productAttributeId}">
|
|
<input type="hidden" id="product-additional-info-access-code" value="{$accessCode}">
|
|
|
|
<a href="#" class="product-set-measurements-btn" id="set-measurements-button" data-toggle="modal" data-target="#measurements-modal">
|
|
Set Measurements
|
|
</a>
|
|
|
|
<!-- Modal -->
|
|
<div class="modal modal-set-measurements lg:w-[600px]" id="measurements-modal" tabindex="-1" role="dialog" style="display: none;;overflow-x:auto ;position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 80%; background-color: white; border: 1px solid black; padding: 20px; z-index: 9999;">
|
|
<div class="wrapper">
|
|
<div class="tabs">
|
|
<div class="tab">
|
|
<input type="radio" name="css-tabs" id="tab-1" checked class="tab-switch">
|
|
<label for="tab-1" class="tab-label">Tab One</label>
|
|
<div class="tab-content my-12">
|
|
{if isset($currentForm)}
|
|
<h2 class="font-semibold mb-4">{$currentForm.label_form}</h2>
|
|
<form id="measurements-form" name="measurements-form" class="form-horizontal" action="#" method="POST">
|
|
<section class="form-fields">
|
|
{foreach from=json_decode($currentForm.attributes, true) item=$attribute}
|
|
<div class="mb-4 flex flex-row form-group ">
|
|
<label for="{$attribute.id}" class="form-control-label md:w-1/4 pr-4 pl-4 required">{$attribute.name}</label>
|
|
<div class=" pr-4 pl-4 js-input-column">
|
|
<input
|
|
type="text"
|
|
id="{$attribute.id}"
|
|
name="{$attribute.id}"
|
|
class=" block appearance-none w-56 py-1 px-2 mb-1 text-base leading-normal bg-white text-gray-800 border border-gray-200 rounded"
|
|
pattern="[0-9]+"
|
|
title="Please enter a positive number"
|
|
required
|
|
{if isset($customerMeasurements) && isset($customerMeasurements[$attribute.id])}
|
|
value="{$customerMeasurements[$attribute.id]}"
|
|
{/if}>
|
|
</div>
|
|
<div class="md:w-1/4 pr-4 pl-4 form-control-comment">
|
|
<small class="block mt-1 text-gray-700">{$attribute.unit}</small>
|
|
</div>
|
|
</div>
|
|
{/foreach}
|
|
<input type="hidden" name="current_form_id" id="current_form_id" class="block appearance-none w-full py-1 px-2 mb-1 text-base leading-normal bg-white text-gray-800 border border-gray-200 rounded" value="{$currentForm.id_form}">
|
|
<input type="hidden" name="current_form_label" id="current_form_label" class="block appearance-none w-full py-1 px-2 mb-1 text-base leading-normal bg-white text-gray-800 border border-gray-200 rounded" value="{$currentForm.label_form}">
|
|
</section>
|
|
</form>
|
|
{else}
|
|
<p>No form data available.</p>
|
|
{/if}
|
|
<button type="submit" class=" hover:text-white hover:no-underline px-6 py-2 bg-blue-950 disabled:bg-gray-700 text-white text-base font-light" id="submit-measurements-button">{l s='Submit' mod='thobbodymeasurements'}</button>
|
|
<button type="button" class="hover:text-white hover:no-underline px-6 py-2 bg-gray-700 text-white text-base font-light" data-dismiss="modal">Close</button>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="tab mb-8">
|
|
<input type="radio" name="css-tabs" id="tab-2" class="tab-switch">
|
|
<label for="tab-2" class="tab-label">Tab Two</label>
|
|
<div class="tab-content gap-mb-8">
|
|
<div class="tab-pane mb-8" id="mirror-size-measurements" role="tabpanel" aria-labelledby="mirror-size-measurements-tab">
|
|
{if $qrCode}
|
|
<img src="{$qrCode}" alt="Mirror Size QR Code" class="max-w-full h-auto">
|
|
<p class="mt-3"> Scan the above QR code to begin our easy 2 photo custom measurement collection.</p>
|
|
<p class="mt-3"> Click on 'Photos Completed' button once your above process is finished. </p>
|
|
<button type="button" class=" mt-3 mb-8 inline-block text-center select-none font-normal whitespace-no-wrap px-6 py-2 leading-normal no-underline bg-green-500 text-white hover:green-600" id="photos-completed-button" name="photos-completed-button">Photos Completed</button>
|
|
<button type="button" class=" mt-3 mb-8 hover:text-white hover:no-underline px-6 py-2 bg-gray-700 text-white text-base font-light " data-dismiss="modal">Close</button>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- <div class="modal-dialog" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<ul class="flex flex-wrap list-none pl-0 mb-0 border border-t-0 border-r-0 border-l-0 border-b-1 border-gray-200" id="measurementTabs" role="tablist">
|
|
<li class="-mb-px">
|
|
<a class="inline-block py-2 px-4 no-underline border border-b-0 mx-1 rounded rounded-t active" id="custom-measurements-tab" data-toggle="tab" href="#custom-measurements" role="tab" aria-controls="custom-measurements" aria-selected="true">Custom Measurements</a>
|
|
</li>
|
|
<li class="-mb-px">
|
|
<a class="inline-block py-2 px-4 no-underline border border-b-0 mx-1 rounded rounded-t" id="mirror-size-measurements-tab" data-toggle="tab" href="#mirror-size-measurements" role="tab" aria-controls="mirror-size-measurements" aria-selected="false">Mirror Size Measurements</a>
|
|
</li>
|
|
</ul>
|
|
<div class="modal-body">
|
|
<div class="tab-content" id="measurementTabsContent">
|
|
<div class="tab-pane opacity-100 block active" id="custom-measurements" role="tabpanel" aria-labelledby="custom-measurements-tab">
|
|
{if isset($currentForm)}
|
|
<h2>{$currentForm.label_form}</h2>
|
|
<form id="measurements-form" name="measurements-form" class="form-horizontal" action="#" method="POST">
|
|
<section class="form-fields">
|
|
{foreach from=json_decode($currentForm.attributes, true) item=$attribute}
|
|
<div class="mb-4 flex flex-wrap form-group ">
|
|
<label for="{$attribute.id}" class="form-control-label md:w-1/4 pr-4 pl-4 required">{$attribute.name}</label>
|
|
<div class="md:w-1/2 pr-4 pl-4 js-input-column">
|
|
<input
|
|
type="text"
|
|
id="{$attribute.id}"
|
|
name="{$attribute.id}"
|
|
class=" block appearance-none w-full py-1 px-2 mb-1 text-base leading-normal bg-white text-gray-800 border border-gray-200 rounded"
|
|
pattern="[0-9]+"
|
|
title="Please enter a positive number"
|
|
required
|
|
{if isset($customerMeasurements) && isset($customerMeasurements[$attribute.id])}
|
|
value="{$customerMeasurements[$attribute.id]}"
|
|
{/if}>
|
|
</div>
|
|
<div class="md:w-1/4 pr-4 pl-4 form-control-comment">
|
|
<small class="block mt-1 text-gray-700">{$attribute.unit}</small>
|
|
</div>
|
|
</div>
|
|
{/foreach}
|
|
<input type="hidden" name="current_form_id" id="current_form_id" class="block appearance-none w-full py-1 px-2 mb-1 text-base leading-normal bg-white text-gray-800 border border-gray-200 rounded" value="{$currentForm.id_form}">
|
|
<input type="hidden" name="current_form_label" id="current_form_label" class="block appearance-none w-full py-1 px-2 mb-1 text-base leading-normal bg-white text-gray-800 border border-gray-200 rounded" value="{$currentForm.label_form}">
|
|
</section>
|
|
</form>
|
|
{else}
|
|
<p>No form data available.</p>
|
|
{/if}
|
|
</div>
|
|
<div class="tab-pane opacity-0" id="mirror-size-measurements" role="tabpanel" aria-labelledby="mirror-size-measurements-tab">
|
|
{if $qrCode}
|
|
<img src="{$qrCode}" alt="Mirror Size QR Code" class="max-w-full h-auto">
|
|
<p> Scan the above QR code to begin our easy 2 photo custom measurement collection.</p>
|
|
<p> Click on 'Photos Completed' button once your above process is finished. </p>
|
|
<button type="button" class="inline-block align-middle text-center select-none border font-normal whitespace-no-wrap rounded py-1 px-3 leading-normal no-underline bg-green-500 text-white hover:green-600" id="photos-completed-button" name="photos-completed-button">Photos Completed</button>
|
|
{/if}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="submit" class="inline-block align-middle text-center select-none border font-normal whitespace-no-wrap rounded py-1 px-3 leading-normal no-underline bg-blue-600 text-white hover:bg-blue-600" id="submit-measurements-button">{l s='Submit' mod='thobbodymeasurements'}</button>
|
|
<button type="button" class="inline-block align-middle text-center select-none border font-normal whitespace-no-wrap rounded py-1 px-3 leading-normal no-underline bg-gray-600 text-white hover:bg-gray-700" data-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> -->
|