odoo
/
odoo
2
0
Fork 0
Code Pull Requests Releases Activity

[IMP] website_sale: begin checkout view 

bzr revid: chm@openerp.com-20130716125735-wy0hwogrf18ssfhb
This commit is contained in:
Christophe Matthieu 2013-07-16 14:57:35 +02:00
parent fbae203ac7
commit b8357bfa10
5 changed files with 192 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
addons/website/views/views.xml
View File

@ -39,7 +39,7 @@
<script type="text/javascript" src="/website/static/src/js/website_bootstrap.js"></script>
</t>
</head>
<body class="oe_website oe_styling_v8">
<body class="oe_website">
<header class="oe_website_header">
<div class="container">

30
addons/website_sale/static/src/css/ecommerce.css
View File

@ -2,17 +2,18 @@
font-family: "Lato";
font-size: 13px;
}
.oe_ecommerce input {
border: 1px solid #dddddd;
font-size: 13px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
padding: 5px;
padding-left: 7px;
margin-bottom: 10px;
.oe_ecommerce input:not([type="radio"]):not([type="checkbox"]) {
height: 30px;
}
.oe_ecommerce label > input:not([type="radio"]):not([type="checkbox"]), .oe_ecommerce label > div {
display: block;
margin-top: 3px;
}
.oe_ecommerce label select {
margin-top: 3px;
}
.oe_ecommerce label > div > input {
margin-bottom: 0;
}
.oe_ecommerce .oe_total {
margin-top: 10px;
@ -162,3 +163,10 @@
max-width: 64px;
max-height: 64px;
}
.oe_ecommerce .oe_checkout .accordion-inner {
padding: 9px;
}
.oe_ecommerce .oe_checkout .accordion-inner h4 {
border-bottom: 1px solid #dddddd;
margin-right: 30px;
}

26
addons/website_sale/static/src/css/ecommerce.sass
View File

@ -1,13 +1,17 @@
@import "compass/css3"
.oe_ecommerce
input
border: 1px solid #ddd
font-size: 13px
+border-radius(3px)
padding: 5px
padding-left: 7px
margin-bottom: 10px
input:not([type="radio"]):not([type="checkbox"])
height: 30px
label
> input:not([type="radio"]):not([type="checkbox"]), > div
display: block
margin-top: 3px
select
margin-top: 3px
> div > input
margin-bottom: 0
.oe_total
margin-top: 10px
td
@ -116,4 +120,10 @@
margin: 0 3px
img
max-width: 64px
max-height: 64px
max-height: 64px
.oe_checkout
.accordion-inner
padding: 9px
h4
border-bottom: 1px solid #ddd
margin-right: 30px

172
addons/website_sale/static/src/xml/ecommerce.xml
View File

@ -2,28 +2,162 @@
<templates id="template" xml:space="preserve">
<t t-name="Website.sale.Checkout">
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
Collapsible Group Item #1
</a>
</div>
<div id="collapseOne" class="accordion-body collapse in">
<div class="accordion-inner">
Anim pariatur cliche...
<div class="oe_checkout">
<div class="accordion" id="accordion_checkout">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion_checkout" href="#accordion_checkout_method">Checkout Method</a>
</div>
<div id="accordion_checkout_method" class="accordion-body collapse in">
<div class="accordion-inner">
<div class="span4">
<h4>Checkout as a Guest or Register</h4>
<p>Register with us for future convenience:</p>
<div>
<label class="radio">Checkout as Guest<input type="radio" checked="checked" name="register_mode" value="guest"/></label>
<label class="radio">Register<input type="radio" name="register_mode" value="register"/></label>
</div>
<h5>Register and save time!</h5>
<p>Register with us for future convenience:</p>
<ul class="ul">
<li>Fast and easy check out</li>
<li>Easy access to your order history and status</li>
</ul>
<button type="button" class="btn" data-toggle="collapse" data-target="#accordion_checkout_billing" data-parent="#accordion_checkout">Continue</button>
</div>
<div class="span4">
<h4>Login</h4>
<h5>Already registered?</h5>
<p>Please log in below:</p>
<input type="text" name="email" placeholder="Email address"/>
<input type="password" name="password" placeholder="Password"/>
<div><a href="#">Forgot your password?</a></div>
<button type="submit" class="btn" data-toggle="collapse" data-target="#accordion_checkout_billing" data-parent="#accordion_checkout">Login</button>
</div>
</div>
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
Collapsible Group Item #2
</a>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion_checkout" href="#accordion_checkout_billing">Billing Information</a>
</div>
<div id="accordion_checkout_billing" class="accordion-body collapse">
<div class="accordion-inner">
<label class="span8">Name and firstname<input class="span7" type="text" name="name" placeholder="Name and firstname"/></label>
<label class="span4">Telephone<input type="text" name="tel" placeholder="Telephone"/></label>
<label class="span4">Fax<input type="text" name="fax" placeholder="Fax"/></label>
<label class="span4">Company<input type="text" name="company" placeholder="Company"/></label>
<label class="span4">Email address<input type="email" name="email" placeholder="Email address"/></label>
<label class="span8">Street<input class="span7" type="text" name="street" placeholder="Street address"/></label>
<label class="span4">City<input type="text" name="city" placeholder="City"/></label>
<label class="span4">State/Province<input type="text" name="state" placeholder="State/Province"/></label>
<label class="span4">Zip/Postal Code<input type="text" name="zip" placeholder="Zip/Postal Code"/></label>
<label class="span4">Country<input type="text" name="state" placeholder="Country"/></label>
<div>
<label class="radio">Ship to this address<input type="radio" name="shipping_method" checked="checked" value="same"/></label>
<label class="radio">Ship to different address<input type="radio" name="shipping_method" value="different"/></label>
</div>
<div class="span8">
<button type="submit" class="btn" data-toggle="collapse" data-target="#accordion_checkout_shipping" data-parent="#accordion_checkout">Continue</button>
</div>
</div>
</div>
</div>
<div id="collapseTwo" class="accordion-body collapse">
<div class="accordion-inner">
Anim pariatur cliche...
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion_checkout" href="#accordion_checkout_shipping">Shipping Information</a>
</div>
<div id="accordion_checkout_shipping" class="accordion-body collapse">
<div class="accordion-inner">
<label class="span8">Name and firstname<input class="span7" type="text" name="name" placeholder="Name and firstname"/></label>
<label class="span4">Telephone<input type="text" name="tel" placeholder="Telephone"/></label>
<label class="span4">Fax<input type="text" name="fax" placeholder="Fax"/></label>
<label class="span4">Company<input type="text" name="company" placeholder="Company"/></label>
<label class="span8">Street<input class="span7" type="text" name="street" placeholder="Street address"/></label>
<label class="span4">City<input type="text" name="city" placeholder="City"/></label>
<label class="span4">State/Province<input type="text" name="state" placeholder="State/Province"/></label>
<label class="span4">Zip/Postal Code<input type="text" name="zip" placeholder="Zip/Postal Code"/></label>
<label class="span4">Country<input type="text" name="state" placeholder="Country"/></label>
<div class="span8">
<button type="submit" class="btn" data-toggle="collapse" data-target="#accordion_checkout_payment" data-parent="#accordion_checkout">Continue</button>
</div>
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion_checkout" href="#accordion_checkout_payment">Payment Information</a>
</div>
<div id="accordion_checkout_payment" class="accordion-body collapse">
<div class="accordion-inner">
<div>
<label class="radio">Check / Money order<input type="radio" name="payment_method" checked="checked" value="check"/></label>
<label class="radio">Credit Card (saved)<input type="radio" name="payment_method" value="card"/></label>
</div>
<div>
<label class="span4">Name on Card<input type="text" name="name" placeholder="Name on Card"/></label>
<label class="span4">Credit Card Type
<select name="type">
<option value="">--Please Select--</option>
<option value="AE">American Express</option>
<option value="VI">Visa</option>
<option value="MC">MasterCard</option>
<option value="DI">Discover</option>
</select>
</label>
<label class="span4">Credit Card Number<input type="text" name="number" placeholder="Credit Card Number"/></label>
<label class="span4">Expiration Date
<div>
<select class="span2" name="expiration_month">
<option value="" selected="selected">Month</option>
<option value="1">01 - January</option>
<option value="2">02 - February</option>
<option value="3">03 - March</option>
<option value="4">04 - April</option>
<option value="5">05 - May</option>
<option value="6">06 - June</option>
<option value="7">07 - July</option>
<option value="8">08 - August</option>
<option value="9">09 - September</option>
<option value="10">10 - October</option>
<option value="11">11 - November</option>
<option value="12">12 - December</option>
</select>
<select class="span1" name="expiration_year">
<option value="" selected="selected">Year</option>
<option value="2013">2013</option>
<option value="2014">2014</option>
<option value="2015">2015</option>
<option value="2016">2016</option>
<option value="2017">2017</option>
<option value="2018">2018</option>
<option value="2019">2019</option>
<option value="2020">2020</option>
<option value="2021">2021</option>
<option value="2022">2022</option>
<option value="2023">2023</option>
</select>
</div>
</label>
<label class="span4">Card Verification Number<input type="text" name="verification" placeholder="Card Verification Number"/></label>
</div>
<div class="span8">
<button type="submit" class="btn" data-toggle="collapse" data-target="#accordion_checkout_review" data-parent="#accordion_checkout">Continue</button>
</div>
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion_checkout" href="#accordion_checkout_review">Order Review</a>
</div>
<div id="accordion_checkout_review" class="accordion-body collapse">
<div class="accordion-inner">
Anim pariatur cliche...
<div class="span8">
<button type="submit" class="btn">Confirm your order</button>
</div>
</div>
</div>
</div>
</div>

3
addons/website_sale/views/ecommerce.xml
View File

@ -208,6 +208,7 @@
<t t-call="website_sale.page">
<t t-set="title">Your informations</t>
<t t-set="shop_content">
<div class="oe_placeholder_checkout">-</div>
<form action="/shop/customer" class="oe_signin" method="post" t-if="not partner">
<h5>Please Sign in or enter your informations</h5>
<input name="login" type="text" placeholder="Login..."/><br/>
@ -233,8 +234,6 @@
</address>
<button type="submit" class="btn btn-success">Next stage</button><t t-if="not partner"> or <button type="reset" class="btn btn-primary oe_toggleform">Sign in</button></t>
</form>
<t t-call="website_sale.total"/>
<div class="oe_placeholder_checkout">-</div>
</t>
</t>
</field>