ruby
1<%= include_gon %> 2<%= render "shared/second-header"%> 3 4<div class='transaction-contents'>5 <div class='transaction-main'>6 <h1 class='transaction-title-text'>7 購入内容の確認 8 </h1>9 <%# 購入内容の表示 %> 10 <div class='buy-item-info'> 11 <%= image_tag @item.image, class: 'buy-item-img' %> 12 <div class='buy-item-right-content'> 13 <h2 class='buy-item-text'> 14 <%= @item.name %> 15 </h2> 16 <div class='buy-item-price'> 17 <p class='item-price-text'>¥<%= @item.price %></p> 18 <p class='item-price-sub-text'><%= @item.postage_payer.name %></p> 19 </div> 20 </div> 21 </div> 22 <%# /購入内容の表示 %> 23 24 <%# 支払額の表示 %>25 <div class='item-payment'>26 <h1 class='item-payment-title'>27 支払金額 28 </h1>29 <p class='item-payment-price'>30 ¥<%= @item.price %> 31 </p> 32 </div> 33 <%# /支払額の表示 %> 34 35 <%= form_with id: 'charge-form', class: 'transaction-form-wrap',local: true do |f| %> 36 <%# カード情報の入力 %>37 <div class='credit-card-form'>38 <h1 class='info-input-haedline'>39 クレジットカード情報入力 40 </h1>41 <div class="form-group">42 <div class='form-text-wrap'>43 <label class="form-text">カード情報</label>44 <span class="indispensable">必須</span>45 </div>46 <div id="number-form" class="input-default"></div>47 <div class='available-card'>48 <%= image_tag 'card-visa.gif', class: 'card-logo'%> 49 <%= image_tag 'card-mastercard.gif', class: 'card-logo'%> 50 <%= image_tag 'card-jcb.gif', class: 'card-logo'%>51 <%= image_tag 'card-amex.gif', class: 'card-logo'%> 52 </div> 53 </div 54 > 55 <div class="form-group">56 <div class='form-text-wrap'>57 <label class="form-text">有効期限</label>58 <span class="indispensable">必須</span>59 </div>60 <div class='input-expiration-date-wrap'>61 <div id="expiry-form" class="input-default"></div>62 </div>63 </div>64 <div class="form-group">65 <div class='form-text-wrap'>66 <label class="form-text">セキュリティコード</label>67 <span class="indispensable">必須</span>68 </div>69 <div id="cvc-form" class="input-default"></div>70 </div>71 </div>72 <%# /カード情報の入力 %> 73 74 <%# 配送先の入力 %> 75 <div class='shipping-address-form'>76 <h1 class='info-input-haedline'>77 配送先入力 78 </h1>79 <div class="form-group">80 <div class='form-text-wrap'>81 <label class="form-text">郵便番号</label>82 <span class="indispensable">必須</span>83 </div>84 <%= f.text_field :postal_code, class:"input-default", id:"postal-code", placeholder:"例）123-4567", maxlength:"8" %> 85 </div> 86 <div class="form-group">87 <div class='form-text-wrap'>88 <label class="form-text">都道府県</label>89 <span class="indispensable">必須</span>90 </div>91 <%= f.collection_select(:prefecture_id, Prefecture.all, :id, :name, {},{class:"select-box", id:"prefecture"}) %> 92 </div> 93 <div class="form-group">94 <div class='form-text-wrap'>95 <label class="form-text">市区町村</label>96 <span class="indispensable">必須</span>97 </div>98 <%= f.text_field :city, class:"input-default", id:"city", placeholder:"例）横浜市緑区"%> 99 </div> 100 <div class="form-group">101 <div class='form-text-wrap'>102 <label class="form-text">番地</label>103 <span class="indispensable">必須</span>104 </div>105 <%= f.text_field :house_number, class:"input-default", id:"addresses", placeholder:"例）青山1-1-1"%> 106 </div> 107 <div class="form-group">108 <div class='form-text-wrap'>109 <label class="form-text">建物名</label>110 <span class="form-any">任意</span>111 </div>112 <%= f.text_field :building_name, class:"input-default", id:"building", placeholder:"例）柳ビル103"%> 113 </div> 114 <div class="form-group">115 <div class='form-text-wrap'>116 <label class="form-text">電話番号</label>117 <span class="indispensable">必須</span>118 </div>119 <%= f.text_field :phone_number, class:"input-default", id:"phone-number", placeholder:"例）09012345678",maxlength:"11"%> 120 </div> 121 </div> 122 <%# /配送先の入力 %> 123 <div class='buy-btn'>124 <%= f.submit "購入" ,class:"buy-red-btn", id:"button" %> 125 </div> 126 <% end %> 127 </div> 128</div> 129<%= render "shared/second-footer"%>
0 コメント