{% extends 'order_contract/add_option/add_option_base.html' %}
{% load staticfiles %}
{% block extrastyle %}
<link rel="stylesheet" href="{% static 'order_contract/css/contract_pamphlet.css' %}">
{% endblock extrastyle %}

{% block content %}
    <article>
    	{% for object in object_list %}
    	<div class="a4SizeWrap">
			<div class="finalTop">
				<h1 class="finalTitle"><span class="finalTitle01">스마트 학생복</span>이 만든 <span class="finalTitle01">리틀스마트</span><br/><span class="finalTitle02">따져볼수록 다릅니다</span></h1>
				<ul class="optionIconList">
                {% if object.couple.boy_fitting.fitting_category.style == 'formal' %}
                {% for function in formal_function %}
                    <li><img src="{{ function.image.url }}"></li>
                {% endfor %}
                {% elif object.couple.boy_fitting.fitting_category.style == 'training' %}
                {% for function in training_function %}
                    <li><img src="{{ function.image.url }}"></li>
                {% endfor %}
                {% endif %}

                {% for function in object.function_set.all %}
                    <li><img src="{{ function.image.url }}"></li>
                {% endfor %}
				</ul>
				<div class="modelImg"><img src="{{ object.couple.front_image.url }}"></div>
			</div>
			<div class="finalBottom">
				<img src="{% static 'order_contract/images/finalBottom.jpg'  %}">
			</div>
		</div>
		{% endfor %}
		<div id="sendMailBtn">메일 발송</div>
		<div class="testWrap"></div>
		<div id="finalBottom"></div>
	</article>
{% endblock content%}
{% block step_btn %}
     <footer>
        <div class="arrow_left"><a href="{% url 'order_contract:contract_complete' order_id %}"><img src="{% static 'order_contract/images/arrow_left.png' %}"></a></div>
        <p>COPYRIGHT @ 2017 SMART FNC ALL RIGHT RESERVED</p>
    </footer>
{% endblock step_btn %}

{% block modal %}
    <div class="mailModalBack"></div>
    <div class="mailModalWrap">
        <img class="mailMenuClose" src="{% static 'order_contract/images/closeIcon.png' %}">
        <ul class='block-inp'>
        	<li>
	        	<label for="inp-mail-to1">To :</label>
		        <input type="text" autocapitalize="off" id="inp-mail-to1" name="mail-account">
                @
                <input type="text" autocapitalize="off" name="mail-domain">
                <select name="sel-email">
                    <option value="none">직접입력</option>
                    <option value="naver.com">naver.com</option>
                    <option value="hanmail.net">hanmail.net</option>
                    <option value="gmail.com">gmail.com</option>
                    <option value="nate.com">nate.com</option>
                </select>
	        </li>
	        <li>
	        	<label for="inp-mail-to2">To :</label>
		        <input type="text" autocapitalize="off" id="inp-mail-to2" name="mail-account">
                @
                <input type="text" autocapitalize="off" name="mail-domain">
                <select name="sel-email">
                    <option value="none">직접입력</option>
                    <option value="naver.com">naver.com</option>
                    <option value="hanmail.net">hanmail.net</option>
                    <option value="gmail.com">gmail.com</option>
                    <option value="nate.com">nate.com</option>
                </select>
	        </li>
	        <li>
	        	<label for="inp-mail-to3">To :</label>
		        <input type="text" autocapitalize="off" id="inp-mail-to3" name="mail-account">
                @
                <input type="text" autocapitalize="off" name="mail-domain">
                <select name="sel-email">
                    <option value="none">직접입력</option>
                    <option value="naver.com">naver.com</option>
                    <option value="hanmail.net">hanmail.net</option>
                    <option value="gmail.com">gmail.com</option>
                    <option value="nate.com">nate.com</option>
                </select>
	        </li>
	        <li class="addMail">
	        	<p>+ 추가하기</p>
	        </li>
        </ul>
	     <input id="submitBtn" type="button" name="확인" value="확인">
    </div>
    <div class="overlay">
        <img class="loading" src="/static/base/image/yellow-loading.gif">
    </div>
{% endblock %}

{% block extrascript %}
<script src="{% static 'order_contract/js/contract_pamphlet.js' %}"></script> 
<script src="{% static 'base/js/pdfmake.min.js' %}"></script>
<script src="{% static 'base/js/html2canvas.js' %}"></script>
<script src="{% static 'base/js/vfs_fonts.js' %}"></script>
<script type="text/javascript">
	$(".optionIconList li:nth-child(odd)").css('margin-right','561px');

	var order_id = {{ order_id }};
</script>
{% endblock extrascript %}

</body>
</html>