checkout.tpl 102 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663
  1. {foreach from=$products item=cycle}
  2. {$cycle.billingcycle}<hr>
  3. {/foreach}
  4. {if $smarty.post.onepageorder == "1" && $smarty.post.checkcredit == "0"}
  5. <script>
  6. // Define state tab index value
  7. var statesTab = 10;
  8. // Do not enforce state input client side
  9. var stateNotRequired = true;
  10. </script>
  11. <script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/intlTelInput.min.js"></script>
  12. <script type="text/javascript" src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/js/scripts.min.js?v={$versionHash}"></script>
  13. <script type="text/javascript" src="{$orderform.assetPath.js}/StatesDropdown.js"></script>
  14. <script type="text/javascript" src="{$orderform.assetPath.js}/PasswordStrength.js"></script>
  15. <script>
  16. window.langPasswordStrength = "{$LANG.pwstrength}";
  17. window.langPasswordWeak = "{$LANG.pwstrengthweak}";
  18. window.langPasswordModerate = "{$LANG.pwstrengthmoderate}";
  19. window.langPasswordStrong = "{$LANG.pwstrengthstrong}";
  20. </script>
  21. {if $errormessage}
  22. <div class="alert alert-danger checkout-error-feedback" role="alert">
  23. <p>{$LANG.orderForm.correctErrors}:</p>
  24. <ul>
  25. {$errormessage}
  26. </ul>
  27. </div>
  28. <div class="clearfix"></div>
  29. {/if}
  30. <form method="post" name="orderfrm" id="frmCheckout">
  31. <input type="hidden" name="submit" value="true" />
  32. <input type="hidden" id="loggedin" value="{$loggedin}" />
  33. <input type="hidden" name="custtype" id="inputCustType" value="{$custtype}" />
  34. <div class="customer_error" style="display: none;"></div>
  35. <div class="TM-card blocks customerinfo">
  36. <div class="blocks_heading">
  37. <h2>{$LANG.billingdetails}</h2>
  38. </div>
  39. <div class="blocks_body" id="customer_info">
  40. {if $custtype neq "new" && $loggedin}
  41. <div class="sub-heading">
  42. <span>
  43. {lang key='switchAccount.title'}
  44. </span>
  45. </div>
  46. <div id="containerExistingAccountSelect" class="row account-select-container">
  47. {foreach $accounts as $account}
  48. <div class="col-sm-{if $accounts->count() == 1}12{else}6{/if}">
  49. <div class="account{if $selectedAccountId == $account->id} active{/if}">
  50. <label class="radio-inline" for="account{$account->id}">
  51. <input id="account{$account->id}" class="account-select{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled{/if}" type="radio" name="account_id" value="{$account->id}"{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled="disabled"{/if}{if $selectedAccountId == $account->id} checked="checked"{/if}>
  52. <span class="address">
  53. <strong>
  54. {if $account->company}{$account->company}{else}{$account->fullName}{/if}
  55. </strong>
  56. {if $account->isClosed || $account->noPermission}
  57. <span class="label label-default">
  58. {if $account->isClosed}
  59. {lang key='closed'}
  60. {else}
  61. {lang key='noPermission'}
  62. {/if}
  63. </span>
  64. {elseif $account->currencyCode}
  65. <span class="label label-info">
  66. {$account->currencyCode}
  67. </span>
  68. {/if}
  69. <br>
  70. <span class="small">
  71. {$account->address1}{if $account->address2}, {$account->address2}{/if}<br>
  72. {if $account->city}{$account->city},{/if}
  73. {if $account->state} {$account->state},{/if}
  74. {if $account->postcode} {$account->postcode},{/if}
  75. {$account->countryName}
  76. </span>
  77. </span>
  78. </label>
  79. </div>
  80. </div>
  81. {/foreach}
  82. <div class="col-sm-12">
  83. <div class="account border-bottom{if !$selectedAccountId || !is_numeric($selectedAccountId)} active{/if}">
  84. <label class="radio-inline">
  85. <input class="account-select" type="radio" name="account_id" value="new"{if !$selectedAccountId || !is_numeric($selectedAccountId)} checked="checked"{/if}{if $inExpressCheckout} disabled="disabled" class="disabled"{/if}>
  86. {lang key='orderForm.createAccount'}
  87. </label>
  88. </div>
  89. </div>
  90. </div>
  91. {/if}
  92. {if !$loggedin}
  93. <div class="user_option">
  94. <ul>
  95. <li>
  96. <label for="newcust">
  97. <input type="radio" class="no-icheck signups" value="new" name="custtype" {if !$loggedin && $custtype neq "existing"}checked="checked"{/if} id="newcust" onclick="togglesignupform(this);"/>
  98. <span class="sign-btn">{$LANG.orderForm.createAccount}</span>
  99. </label>
  100. </li>
  101. <li>
  102. <label for="existingcust">
  103. <input type="radio" class="no-icheck signups" value="existing" name="custtype" {if $custtype eq "existing" && !$loggedin || $loggedin}checked="checked"{/if} id="existingcust" onclick="togglesignupform(this);"/>
  104. <span class="sign-btn">{$LANG.orderForm.alreadyRegistered}</span>
  105. </label>
  106. </li>
  107. </ul>
  108. </div>
  109. {/if}
  110. <div class="signupfields signupfields-existing{if $custtype eq "existing" && !$loggedin}{else} w-hidden{/if}" id="loginfrm">
  111. <div class="row">
  112. <div class="col-sm-6">
  113. <div class="form-group prepend-icon">
  114. <label for="inputLoginEmail" class="field-icon">
  115. <i class="fas fa-envelope"></i>
  116. </label>
  117. <input type="text" name="loginemail" id="inputLoginEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$loginemail}">
  118. </div>
  119. </div>
  120. <div class="col-sm-6">
  121. <div class="form-group prepend-icon">
  122. <label for="inputLoginPassword" class="field-icon">
  123. <i class="fas fa-lock"></i>
  124. </label>
  125. <input type="password" name="loginpassword" id="inputLoginPassword" class="field form-control" placeholder="{$LANG.clientareapassword}">
  126. </div>
  127. </div>
  128. </div>
  129. <div class="text-center">
  130. <button type="button" id="btnExistingLogin" class="btn btn-primary btn-md">
  131. <span id="existingLoginButton">{lang key='login'}</span>
  132. <span id="existingLoginPleaseWait" class="w-hidden">{lang key='pleasewait'}</span>
  133. </button>
  134. </div>
  135. {include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-existing"}
  136. </div>
  137. {if $loggedin}
  138. <div id="containerNewUserSignup" class="signupfields{if $custtype === 'existing' || (is_numeric($selectedAccountId) && $selectedAccountId > 0) || ($loggedin && $accounts->count() > 0 && $selectedAccountId !== 'new')} w-hidden{/if}">
  139. {else}
  140. <div class="signupfields{if $custtype eq "existing" && !$loggedin} w-hidden{/if}" id="signupfrm">
  141. {/if}
  142. <div{if $loggedin} class="w-hidden"{/if}>
  143. {include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-new"}
  144. </div>
  145. <h5>{$LANG.orderForm.personalInformation}</h5>
  146. <div class="row">
  147. <div class="col-sm-6">
  148. <div class="form-group prepend-icon">
  149. <label for="inputFirstName" class="field-icon">
  150. <i class="fas fa-user"></i>
  151. </label>
  152. <input type="text" name="firstname" id="inputFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$clientsdetails.firstname}">
  153. </div>
  154. </div>
  155. <div class="col-sm-6">
  156. <div class="form-group prepend-icon">
  157. <label for="inputLastName" class="field-icon">
  158. <i class="fas fa-user"></i>
  159. </label>
  160. <input type="text" name="lastname" id="inputLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$clientsdetails.lastname}">
  161. </div>
  162. </div>
  163. <div class="col-sm-6">
  164. <div class="form-group prepend-icon">
  165. <label for="inputEmail" class="field-icon">
  166. <i class="fas fa-envelope"></i>
  167. </label>
  168. <input type="email" name="email" id="inputEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$clientsdetails.email}">
  169. </div>
  170. </div>
  171. <div class="col-sm-6">
  172. <div class="form-group prepend-icon">
  173. <label for="inputPhone" class="field-icon">
  174. <i class="fas fa-phone"></i>
  175. </label>
  176. <input type="tel" name="phonenumber" id="inputPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$clientsdetails.phonenumber}">
  177. </div>
  178. </div>
  179. </div>
  180. <h5>{$LANG.orderForm.billingAddress}</h5>
  181. <div class="row">
  182. <div class="col-sm-12">
  183. <div class="form-group prepend-icon">
  184. <label for="inputCompanyName" class="field-icon">
  185. <i class="fas fa-building"></i>
  186. </label>
  187. <input type="text" name="companyname" id="inputCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$clientsdetails.companyname}">
  188. </div>
  189. </div>
  190. <div class="col-sm-12">
  191. <div class="form-group prepend-icon">
  192. <label for="inputAddress1" class="field-icon">
  193. <i class="far fa-building"></i>
  194. </label>
  195. <input type="text" name="address1" id="inputAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$clientsdetails.address1}">
  196. </div>
  197. </div>
  198. <div class="col-sm-12">
  199. <div class="form-group prepend-icon">
  200. <label for="inputAddress2" class="field-icon">
  201. <i class="fas fa-map-marker-alt"></i>
  202. </label>
  203. <input type="text" name="address2" id="inputAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$clientsdetails.address2}">
  204. </div>
  205. </div>
  206. <div class="col-sm-4">
  207. <div class="form-group prepend-icon">
  208. <label for="inputCity" class="field-icon">
  209. <i class="far fa-building"></i>
  210. </label>
  211. <input type="text" name="city" id="inputCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$clientsdetails.city}">
  212. </div>
  213. </div>
  214. <div class="col-sm-5">
  215. <div class="form-group prepend-icon">
  216. <label for="state" class="field-icon" id="inputStateIcon">
  217. <i class="fas fa-map-signs"></i>
  218. </label>
  219. <label for="stateinput" class="field-icon" id="inputStateIcon">
  220. <i class="fas fa-map-signs"></i>
  221. </label>
  222. <input type="text" name="state" id="inputState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$clientsdetails.state}">
  223. </div>
  224. </div>
  225. <div class="col-sm-3">
  226. <div class="form-group prepend-icon">
  227. <label for="inputPostcode" class="field-icon">
  228. <i class="fas fa-certificate"></i>
  229. </label>
  230. <input type="text" name="postcode" id="inputPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$clientsdetails.postcode}">
  231. </div>
  232. </div>
  233. <div class="col-sm-12">
  234. <div class="form-group prepend-icon">
  235. <label for="inputCountry" class="field-icon" id="inputCountryIcon">
  236. <i class="fas fa-globe"></i>
  237. </label>
  238. <select name="country" id="inputCountry" class="field form-control">
  239. {foreach $countries as $countrycode => $countrylabel}
  240. <option value="{$countrycode}"{if (!$country && $countrycode == $defaultcountry) || $countrycode eq $country} selected{/if}>
  241. {$countrylabel}
  242. </option>
  243. {/foreach}
  244. </select>
  245. </div>
  246. </div>
  247. {if $showTaxIdField}
  248. <div class="col-sm-12">
  249. <div class="form-group prepend-icon">
  250. <label for="inputTaxId" class="field-icon">
  251. <i class="fas fa-building"></i>
  252. </label>
  253. <input type="text" name="tax_id" id="inputTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$clientsdetails.tax_id}">
  254. </div>
  255. </div>
  256. {/if}
  257. </div>
  258. {if $customfields}
  259. <h5>{$LANG.orderadditionalrequiredinfo}</h5>
  260. <div class="row">
  261. {foreach $customfields as $customfield}
  262. <div class="col-sm-6">
  263. <div class="form-group">
  264. {if $customfield.type eq 'tickbox'}
  265. <label class=checkbox-inline" for="customfield{$customfield.id}">
  266. {$customfield.input}
  267. {$customfield.name}
  268. </lable>
  269. {if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
  270. {else}
  271. <label for="customfield{$customfield.id}">{$customfield.name}</label>
  272. {if $customfield.type eq "link"}
  273. <div class="input-group">
  274. <span class="input-group-addon" id="customfield{$customfield.id}"><i class="fas fa-link"></i></span>
  275. {$customfield.input}
  276. </div>
  277. {else}
  278. {$customfield.input}
  279. {/if}
  280. {if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
  281. {/if}
  282. </div>
  283. </div>
  284. {/foreach}
  285. </div>
  286. {/if}
  287. <div class="domain_config" {if $domainsinorder}{else}style="display: none;"{/if}>
  288. <h5>{$LANG.domainregistrantinfo}</h5>
  289. <p class="small text-muted">{$LANG.orderForm.domainAlternativeContact}</p>
  290. <div class="row margin-bottom">
  291. <div class="col-sm-6">
  292. <div class="form-group prepend-icon">
  293. <label for="inputDCFirstName" class="field-icon">
  294. <i class="fas fa-user"></i>
  295. </label>
  296. <select name="contact" id="inputDomainContact" class="field form-control">
  297. <option value="">{$LANG.usedefaultcontact}</option>
  298. {foreach $domaincontacts as $domcontact}
  299. <option value="{$domcontact.id}"{if $contact == $domcontact.id} selected{/if}>
  300. {$domcontact.name}
  301. </option>
  302. {/foreach}
  303. <option value="addingnew"{if $contact == "addingnew"} selected{/if}>
  304. {$LANG.clientareanavaddcontact}...
  305. </option>
  306. </select>
  307. </div>
  308. </div>
  309. </div>
  310. <div class="row{if $contact neq "addingnew"} w-hidden{/if}" id="domainRegistrantInputFields">
  311. <div class="col-sm-6">
  312. <div class="form-group prepend-icon">
  313. <label for="inputDCFirstName" class="field-icon">
  314. <i class="fas fa-user"></i>
  315. </label>
  316. <input type="text" name="domaincontactfirstname" id="inputDCFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$domaincontact.firstname}">
  317. </div>
  318. </div>
  319. <div class="col-sm-6">
  320. <div class="form-group prepend-icon">
  321. <label for="inputDCLastName" class="field-icon">
  322. <i class="fas fa-user"></i>
  323. </label>
  324. <input type="text" name="domaincontactlastname" id="inputDCLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$domaincontact.lastname}">
  325. </div>
  326. </div>
  327. <div class="col-sm-6">
  328. <div class="form-group prepend-icon">
  329. <label for="inputDCEmail" class="field-icon">
  330. <i class="fas fa-envelope"></i>
  331. </label>
  332. <input type="email" name="domaincontactemail" id="inputDCEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$domaincontact.email}">
  333. </div>
  334. </div>
  335. <div class="col-sm-6">
  336. <div class="form-group prepend-icon">
  337. <label for="inputDCPhone" class="field-icon">
  338. <i class="fas fa-phone"></i>
  339. </label>
  340. <input type="tel" name="domaincontactphonenumber" id="inputDCPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$domaincontact.phonenumber}">
  341. </div>
  342. </div>
  343. <div class="col-sm-12">
  344. <div class="form-group prepend-icon">
  345. <label for="inputDCCompanyName" class="field-icon">
  346. <i class="fas fa-building"></i>
  347. </label>
  348. <input type="text" name="domaincontactcompanyname" id="inputDCCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$domaincontact.companyname}">
  349. </div>
  350. </div>
  351. <div class="col-sm-12">
  352. <div class="form-group prepend-icon">
  353. <label for="inputDCAddress1" class="field-icon">
  354. <i class="far fa-building"></i>
  355. </label>
  356. <input type="text" name="domaincontactaddress1" id="inputDCAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$domaincontact.address1}">
  357. </div>
  358. </div>
  359. <div class="col-sm-12">
  360. <div class="form-group prepend-icon">
  361. <label for="inputDCAddress2" class="field-icon">
  362. <i class="fas fa-map-marker-alt"></i>
  363. </label>
  364. <input type="text" name="domaincontactaddress2" id="inputDCAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$domaincontact.address2}">
  365. </div>
  366. </div>
  367. <div class="col-sm-4">
  368. <div class="form-group prepend-icon">
  369. <label for="inputDCCity" class="field-icon">
  370. <i class="far fa-building"></i>
  371. </label>
  372. <input type="text" name="domaincontactcity" id="inputDCCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$domaincontact.city}">
  373. </div>
  374. </div>
  375. <div class="col-sm-5">
  376. <div class="form-group prepend-icon">
  377. <label for="inputDCState" class="field-icon">
  378. <i class="fas fa-map-signs"></i>
  379. </label>
  380. <input type="text" name="domaincontactstate" id="inputDCState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$domaincontact.state}">
  381. </div>
  382. </div>
  383. <div class="col-sm-3">
  384. <div class="form-group prepend-icon">
  385. <label for="inputDCPostcode" class="field-icon">
  386. <i class="fas fa-certificate"></i>
  387. </label>
  388. <input type="text" name="domaincontactpostcode" id="inputDCPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$domaincontact.postcode}">
  389. </div>
  390. </div>
  391. <div class="col-sm-12">
  392. <div class="form-group prepend-icon">
  393. <label for="inputDCCountry" class="field-icon" id="inputCountryIcon">
  394. <i class="fas fa-globe"></i>
  395. </label>
  396. <select name="domaincontactcountry" id="inputDCCountry" class="field form-control">
  397. {foreach $countries as $countrycode => $countrylabel}
  398. <option value="{$countrycode}"{if (!$domaincontact.country && $countrycode == $defaultcountry) || $countrycode eq $domaincontact.country} selected{/if}>
  399. {$countrylabel}
  400. </option>
  401. {/foreach}
  402. </select>
  403. </div>
  404. </div>
  405. <div class="col-sm-12">
  406. <div class="form-group prepend-icon">
  407. <label for="inputDCTaxId" class="field-icon">
  408. <i class="fas fa-building"></i>
  409. </label>
  410. <input type="text" name="domaincontacttax_id" id="inputDCTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$domaincontact.tax_id}">
  411. </div>
  412. </div>
  413. </div>
  414. </div>
  415. </div>
  416. </div>
  417. </div>
  418. {if !$loggedin}
  419. <div id="containerNewUserSecurity"{if (!$loggedin && $custtype eq "existing") || ($remote_auth_prelinked && !$securityquestions) } class="w-hidden"{/if}>
  420. <div class="TM-card blocks accountpw">
  421. <div class="blocks_heading">
  422. <h2>{$LANG.orderForm.accountSecurity}</h2>
  423. </div>
  424. <div class="blocks_body" id="account_pw">
  425. <div id="containerPassword" class="row{if $remote_auth_prelinked && $securityquestions} w-hidden{/if}">
  426. <div id="passwdFeedback" style="display: none;" class="alert alert-info text-center col-sm-12"></div>
  427. <div class="col-sm-6">
  428. <div class="form-group prepend-icon">
  429. <label for="inputNewPassword1" class="field-icon">
  430. <i class="fas fa-lock"></i>
  431. </label>
  432. <input type="password" name="password" id="inputNewPassword1" data-error-threshold="{$pwStrengthErrorThreshold}" data-warning-threshold="{$pwStrengthWarningThreshold}" class="field form-control" placeholder="{$LANG.clientareapassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
  433. </div>
  434. </div>
  435. <div class="col-sm-6">
  436. <div class="form-group prepend-icon">
  437. <label for="inputNewPassword2" class="field-icon">
  438. <i class="fas fa-lock"></i>
  439. </label>
  440. <input type="password" name="password2" id="inputNewPassword2" class="field form-control" placeholder="{$LANG.clientareaconfirmpassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
  441. </div>
  442. </div>
  443. <div class="col-sm-6">
  444. <button type="button" class="btn btn-default btn-sm generate-password" data-targetfields="inputNewPassword1,inputNewPassword2">
  445. {$LANG.generatePassword.btnLabel}
  446. </button>
  447. </div>
  448. <div class="col-sm-6">
  449. <div class="password-strength-meter">
  450. <div class="progress">
  451. <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="passwordStrengthMeterBar">
  452. </div>
  453. </div>
  454. <p class="text-center small text-muted" id="passwordStrengthTextLabel">{$LANG.pwstrength}: {$LANG.pwstrengthenter}</p>
  455. </div>
  456. </div>
  457. </div>
  458. </div>
  459. </div>
  460. {if $securityquestions}
  461. <div class="TM-card blocks securityques">
  462. <div class="blocks_body" id="securityQuestion">
  463. {if !$loggedin}
  464. <div class="row">
  465. <div class="col-sm-6">
  466. <div class="form-group">
  467. <select name="securityqid" id="inputSecurityQId" class="field form-control">
  468. <option value="">{$LANG.clientareasecurityquestion}</option>
  469. {foreach $securityquestions as $question}
  470. <option value="{$question.id}"{if $question.id eq $securityqid} selected{/if}>
  471. {$question.question}
  472. </option>
  473. {/foreach}
  474. </select>
  475. </div>
  476. </div>
  477. <div class="col-sm-6">
  478. <div class="form-group prepend-icon">
  479. <label for="inputSecurityQAns" class="field-icon">
  480. <i class="fas fa-lock"></i>
  481. </label>
  482. <input type="password" name="securityqans" id="inputSecurityQAns" class="field form-control" placeholder="{$LANG.clientareasecurityanswer}">
  483. </div>
  484. </div>
  485. </div>
  486. {/if}
  487. </div>
  488. </div>
  489. {/if}
  490. </div>
  491. {/if}
  492. {* BEGIN thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  493. {if $total->toNumeric() > 0}
  494. {* END thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  495. <div class="blocks paymentinfo">
  496. {* <div class="blocks_heading">
  497. <h2>{$LANG.orderForm.paymentDetails}</h2>
  498. </div>
  499. *}
  500. <div class="blocks_body" id="payment_info">
  501. {if $canUseCreditOnCheckout}
  502. <div id="applyCreditContainer" class="apply-credit-container" data-apply-credit="{$applyCredit}">
  503. <p>{lang key='cart.availableCreditBalance' amount=$creditBalance}</p>
  504. {if $creditBalance->toNumeric() >= $total->toNumeric()}
  505. <label class="radio">
  506. <input id="useFullCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
  507. {lang key='cart.applyCreditAmountNoFurtherPayment' amount=$total}
  508. </label>
  509. {else}
  510. <label class="radio">
  511. <input id="useCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
  512. {lang key='cart.applyCreditAmount' amount=$creditBalance}
  513. </label>
  514. {/if}
  515. <label class="radio">
  516. <input id="skipCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="0"{if !$applyCredit} checked{/if}>
  517. {lang key='cart.applyCreditSkip' amount=$creditBalance}
  518. </label>
  519. </div>
  520. {/if}
  521. {if !$inExpressCheckout}
  522. <div id="paymentGatewaysContainer" class="form-group">
  523. <h4>{$LANG.orderpaymentmethod}</h4>
  524. <div class="TM-card" id="cros-payment-gateway">
  525. {foreach $gateways as $gateway}
  526. <label class="radio-inline{if $selectedgateway eq $gateway.sysname} is-selected{/if}" id="lbl-{$gateway.sysname}" onclick="getApply('{$gateway.sysname}')">
  527. <span>
  528. <input type="radio" onclick="getApply(this.value)" name="paymentmethod"
  529. value="{$gateway.sysname}"
  530. data-payment-type="{$gateway.payment_type}"
  531. data-show-local="{$gateway.show_local_cards}"
  532. data-remote-inputs="{$gateway.uses_remote_inputs}"
  533. class="payment-methods{if $gateway.type eq "CC"} is-credit-card{/if}"
  534. {if $selectedgateway eq $gateway.sysname} checked{/if}
  535. />
  536. <span class="check-label">{$gateway.name}</span>
  537. </span>
  538. {assign var=gatewayIcon value=$gateway.sysname|lower|replace:" ":"-"}
  539. {if file_exists("templates/orderforms/{$carttpl}/img/gateways/{$gatewayIcon}.png")}
  540. <span class="check-icon">
  541. {if file_exists("templates/orderforms/{$carttpl}/img/gateways/overrides/{$gatewayIcon}.png")}
  542. <img class="img-responsive" src="templates/orderforms/{$carttpl}/img/gateways/overrides/{$gatewayIcon}.png" alt="{$gateway.name}" />
  543. {else}
  544. <img class="img-responsive" src="templates/orderforms/{$carttpl}/img/gateways/{$gatewayIcon}.png" alt="{$gateway.name}" />
  545. {/if}
  546. </span>
  547. {/if}
  548. </label>
  549. {/foreach}
  550. {foreach from=$gatewaysoutput item=gatewayname key=wskey}
  551. {if $gatewayname|strstr:"paypalcheckout"}
  552. <label class="radio-inline">
  553. <input type="radio" name="paymentmethod" value="paypalexpress" data-payment-type="Invoices" data-show-local="" data-remote-inputs="" class="payment-methods">
  554. PayPal Express Checkout
  555. </label>
  556. {/if}
  557. {/foreach}
  558. </div>
  559. </div>
  560. <div class="alert alert-danger text-center gateway-errors w-hidden"></div>
  561. <div class="clearfix"></div>
  562. <div class="cc-input-container{if $selectedgatewaytype neq "CC"} w-hidden{/if}" id="creditCardInputFields">
  563. {if $client}
  564. <div id="existingCardsContainer" class="existing-cc-grid">
  565. {include file="orderforms/{$carttpl}/includes/existing-paymethods.tpl"}
  566. </div>
  567. {/if}
  568. <div class="row cvv-input" id="existingCardInfo">
  569. <div class="col-lg-3 col-sm-4">
  570. <div class="form-group prepend-icon">
  571. <label for="inputCardCVV2" class="field-icon">
  572. <i class="fas fa-barcode"></i>
  573. </label>
  574. <div class="input-group">
  575. <input type="tel" name="cccvv" id="inputCardCVV2" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
  576. <span class="input-group-btn input-group-append">
  577. <button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
  578. ?
  579. </button>
  580. </span>
  581. </div>
  582. <span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
  583. </div>
  584. </div>
  585. </div>
  586. <ul>
  587. <li>
  588. <label class="radio-inline">
  589. <input type="radio" name="ccinfo" value="new" id="new" {if !$client || $client->payMethods->count() === 0} checked="checked"{/if} />
  590. &nbsp;
  591. {lang key='creditcardenternewcard'}
  592. </label>
  593. </li>
  594. </ul>
  595. <div class="row" id="newCardInfo">
  596. <div id="cardNumberContainer" class="col-sm-6 new-card-container">
  597. <div class="form-group prepend-icon">
  598. <label for="inputCardNumber" class="field-icon">
  599. <i class="fas fa-credit-card"></i>
  600. </label>
  601. <input type="tel" name="ccnumber" id="inputCardNumber" class="field cc-number-field" placeholder="{$LANG.orderForm.cardNumber}" autocomplete="cc-number" data-message-unsupported="{lang key='paymentMethodsManage.unsupportedCardType'}" data-message-invalid="{lang key='paymentMethodsManage.cardNumberNotValid'}" data-supported-cards="{$supportedCardTypes}" />
  602. <span class="field-error-msg"></span>
  603. </div>
  604. </div>
  605. <div class="col-sm-3 new-card-container">
  606. <div class="form-group prepend-icon">
  607. <label for="inputCardExpiry" class="field-icon">
  608. <i class="fas fa-calendar-alt"></i>
  609. </label>
  610. <input type="tel" name="ccexpirydate" id="inputCardExpiry" class="field form-control" placeholder="MM / YY{if $showccissuestart} ({$LANG.creditcardcardexpires}){/if}" autocomplete="cc-exp">
  611. <span class="field-error-msg">{lang key="paymentMethodsManage.expiryDateNotValid"}</span>
  612. </div>
  613. </div>
  614. <div class="col-sm-3" id="cvv-field-container">
  615. <div class="form-group prepend-icon">
  616. <label for="inputCardCVV" class="field-icon">
  617. <i class="fas fa-barcode"></i>
  618. </label>
  619. <div class="input-group">
  620. <input type="tel" name="cccvv" id="inputCardCVV" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
  621. <span class="input-group-btn input-group-append w-hidden">
  622. <button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
  623. ?
  624. </button>
  625. </span><br>
  626. </div>
  627. <span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
  628. </div>
  629. </div>
  630. {if $showccissuestart}
  631. <div class="col-sm-3 col-sm-offset-6 new-card-container">
  632. <div class="form-group prepend-icon">
  633. <label for="inputCardStart" class="field-icon">
  634. <i class="far fa-calendar-check"></i>
  635. </label>
  636. <input type="tel" name="ccstartdate" id="inputCardStart" class="field form-control" placeholder="MM / YY ({$LANG.creditcardcardstart})" autocomplete="cc-exp">
  637. </div>
  638. </div>
  639. <div class="col-sm-3 new-card-container">
  640. <div class="form-group prepend-icon">
  641. <label for="inputCardIssue" class="field-icon">
  642. <i class="fas fa-asterisk"></i>
  643. </label>
  644. <input type="tel" name="ccissuenum" id="inputCardIssue" class="field form-control" placeholder="{$LANG.creditcardcardissuenum}">
  645. </div>
  646. </div>
  647. {/if}
  648. </div>
  649. <div id="newCardSaveSettings">
  650. <div class="row form-group new-card-container">
  651. <div id="inputDescriptionContainer" class="col-md-6">
  652. <div class="prepend-icon">
  653. <label for="inputDescription" class="field-icon">
  654. <i class="fas fa-pencil"></i>
  655. </label>
  656. <input type="text" class="field form-control" id="inputDescription" name="ccdescription" autocomplete="off" value="" placeholder="{$LANG.paymentMethods.descriptionInput} {$LANG.paymentMethodsManage.optional}" />
  657. </div>
  658. </div>
  659. {if $allowClientsToRemoveCards}
  660. <div id="inputNoStoreContainer" class="col-md-6" style="line-height: 32px;">
  661. <input type="hidden" name="nostore" value="1">
  662. <input type="checkbox" class="toggle-switch-success no-icheck" data-size="mini" checked="checked" name="nostore" id="inputNoStore" value="0" data-on-text="{lang key='yes'}" data-off-text="{lang key='no'}">
  663. <label for="inputNoStore" class="checkbox-inline no-padding">
  664. &nbsp;&nbsp;
  665. {$LANG.creditCardStore}
  666. </label>
  667. </div>
  668. {/if}
  669. </div>
  670. </div>
  671. </div>
  672. {else}
  673. {if $expressCheckoutOutput}
  674. {$expressCheckoutOutput}
  675. {else}
  676. <p align="center">
  677. {lang key='paymentPreApproved' gateway=$expressCheckoutGateway}
  678. </p>
  679. {/if}
  680. {/if}
  681. </div>
  682. </div>
  683. {* BEGIN thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  684. {else}
  685. <input type="hidden"
  686. name="paymentmethod"
  687. value="swiss_slip"
  688. data-payment-type="Invoices"
  689. data-show-local="false"
  690. data-remote-inputs="false"
  691. class="payment-methods"
  692. checked
  693. />
  694. {/if}
  695. {* END thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  696. </div>
  697. {if $shownotesfield}
  698. <div class="TM-card blocks additionalinfo">
  699. <div class="blocks_heading">
  700. <h2>{$LANG.orderForm.additionalNotes}</h2>
  701. </div>
  702. <div class="blocks_body" id="notesfield">
  703. <div class="row">
  704. <div class="col-md-12">
  705. <div class="form-group">
  706. <textarea name="notes" class="field form-control" rows="4" placeholder="{$LANG.ordernotesdescription}">{$orderNotes}</textarea>
  707. </div>
  708. </div>
  709. </div>
  710. </div>
  711. </div>
  712. {/if}
  713. {if $showMarketingEmailOptIn}
  714. <div class="TM-card blocks additionalinfo">
  715. <div class="blocks_body" id="MarketingEmailOptIn">
  716. <p>{$marketingEmailOptInMessage}</p>
  717. <div class="panel panel-switch {if $marketingEmailOptIn} checked{/if}">
  718. <div class="panel-body">
  719. <span class="switch-label">{lang key='emailMarketing.joinOurMailingList'}: </span>
  720. <label class="switch switch--text">
  721. <input class="no-icheck switch__checkbox" type="checkbox" name="marketingoptin" value="1"{if $marketingEmailOptIn} checked{/if}>
  722. <span class="switch__container"><span class="switch__handle"></span></span>
  723. </label>
  724. </div>
  725. </div>
  726. </div>
  727. </div>
  728. {/if}
  729. {if $captcha}
  730. <div class="margin-bottom">
  731. {include file="$template/includes/captcha_spc.tpl"}
  732. </div>
  733. {/if}
  734. <div class="orderform_footer">
  735. <div class="order_form_tos">
  736. {if $accepttos}
  737. <div>
  738. <label class="checkbox-inline">
  739. <input type="checkbox" name="accepttos" id="accepttos" />
  740. {$LANG.ordertosagreement}
  741. <a href="{$tosurl}" target="_blank">{$LANG.ordertos}</a>
  742. </label>
  743. </div>
  744. <br />
  745. {/if}
  746. </div>
  747. <div class="order_form_submit">
  748. <button type="submit" id="order_submit" class="btn btn-primary btn-lg spinner-on-click{if $captcha}{$captcha->getButtonClass($captchaForm)}{/if}">{if $inExpressCheckout}{$LANG.confirmAndPay}{else}{$LANG.completeorder}{/if}&nbsp;<i class="fas fa-arrow-circle-right"></i></button>
  749. </div>
  750. </div>
  751. </form>
  752. {if $servedOverSsl}
  753. <div class="small text-muted mt-3 mb-5">
  754. <i class="fad fa-lock-alt text-success"></i>&nbsp;{$LANG.ordersecure} (<strong>{$ipaddress}</strong>) {$LANG.ordersecure2}
  755. </div>
  756. {/if}
  757. <script>
  758. jQuery(document).ready(function () {
  759. var panelSwitch = $('.panel-switch');
  760. panelSwitch.on('click', function (e) {
  761. if (!$(this).is('a')) {
  762. var currCheck = $(this).find('input[type="checkbox"]');
  763. if (currCheck.is(':checked')) {
  764. panelSwitch.removeClass('checked');
  765. currCheck.prop('checked', false);
  766. } else {
  767. panelSwitch.addClass('checked');
  768. currCheck.prop('checked', true);
  769. }
  770. var that = $(this);
  771. setTimeout(function () {
  772. that.find('.loader').addClass('loading');
  773. }, 300);
  774. }
  775. });
  776. });
  777. //Gateway checkbox
  778. function getApply(obj){
  779. var vDiv=document.getElementById("cros-payment-gateway").children.length;
  780. for(var i=0;i<vDiv;i++){
  781. var vObje = document.getElementById("cros-payment-gateway").children[i].id;
  782. if("lbl-"+obj==vObje){
  783. document.getElementById("lbl-"+obj).classList.add("is-selected");
  784. }
  785. else{
  786. document.getElementById(vObje).className ="radio-inline";
  787. }
  788. }
  789. }
  790. // Activate copy to clipboard functionality
  791. jQuery('.copy-to-clipboard').click(WHMCS.ui.clipboard.copy);
  792. // Password Generator
  793. jQuery('.generate-password').click(function(e) {
  794. jQuery('#frmGeneratePassword').submit();
  795. jQuery('#modalGeneratePassword')
  796. .data('targetfields', jQuery(this).data('targetfields'))
  797. .modal('show');
  798. });
  799. jQuery('#frmGeneratePassword').submit(function(e) {
  800. e.preventDefault();
  801. var length = parseInt(jQuery('#inputGeneratePasswordLength').val(), 10);
  802. // Check length
  803. if (length < 8 || length > 64) {
  804. jQuery('#generatePwLengthError').removeClass('w-hidden').show();
  805. return;
  806. }
  807. jQuery('#inputGeneratePasswordOutput').val(WHMCS.utils.generatePassword(length));
  808. });
  809. {if !$loggedin}
  810. if(jQuery("#inputCountry").length)
  811. {
  812. jQuery("#inputCountry, input[name^=\"addons\"], input[name^=\"configoption\"]").change(function(){
  813. setTimeout(function(){ recalcheckout(); }, 2500);
  814. });
  815. }
  816. {/if}
  817. </script>
  818. {$credit_card_input}
  819. {else if $smarty.post.onepageorder == "1" && $smarty.post.checkcredit == "1"}
  820. {if $loggedin}
  821. {if $canUseCreditOnCheckout}
  822. <p>{lang key='cart.availableCreditBalance' amount=$creditBalance}</p>
  823. {if $creditBalance->toNumeric() >= $total->toNumeric()}
  824. <label class="radio">
  825. <input id="useFullCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
  826. {lang key='cart.applyCreditAmountNoFurtherPayment' amount=$total}
  827. </label>
  828. {else}
  829. <label class="radio">
  830. <input id="useCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
  831. {lang key='cart.applyCreditAmount' amount=$creditBalance}
  832. </label>
  833. {/if}
  834. <label class="radio">
  835. <input id="skipCreditOnCheckout" class="cccheckdb" type="radio" name="applycredit" value="0"{if !$applyCredit} checked{/if}>
  836. {lang key='cart.applyCreditSkip' amount=$creditBalance}
  837. </label>
  838. {/if}
  839. {/if}
  840. {else}
  841. <script>
  842. // Define state tab index value
  843. var statesTab = 10;
  844. // Do not enforce state input client side
  845. var stateNotRequired = true;
  846. </script>
  847. {include file="orderforms/{$carttpl}/common.tpl"}
  848. <script type="text/javascript" src="{$orderform.assetPath.js}/StatesDropdown.js"></script>
  849. <script type="text/javascript" src="{$orderform.assetPath.js}/PasswordStrength.js"></script>
  850. <script>
  851. window.langPasswordStrength = "{$LANG.pwstrength}";
  852. window.langPasswordWeak = "{$LANG.pwstrengthweak}";
  853. window.langPasswordModerate = "{$LANG.pwstrengthmoderate}";
  854. window.langPasswordStrong = "{$LANG.pwstrengthstrong}";
  855. </script>
  856. <div>
  857. <div class="row">
  858. <div class="col-md-12">
  859. <div class="already-registered {if $loggedin}w-hidden{/if}">
  860. <p>{lang key='orderForm.enterPersonalDetails'}</p>
  861. <div class="padding-2x">
  862. <button type="button" class="btn btn-primary{if $loggedin || !$loggedin && $custtype eq "existing"} w-hidden{/if}" id="btnAlreadyRegistered">
  863. {$LANG.orderForm.alreadyRegistered}
  864. </button>
  865. <button type="button" class="btn btn-primary{if $loggedin || $custtype neq "existing"} w-hidden{/if}" id="btnNewUserSignup">
  866. {$LANG.orderForm.createAccount}
  867. </button>
  868. </div>
  869. </div>
  870. {if $errormessage}
  871. <div class="alert alert-danger checkout-error-feedback" role="alert">
  872. <p>{$LANG.orderForm.correctErrors}:</p>
  873. <ul>
  874. {$errormessage}
  875. </ul>
  876. </div>
  877. <div class="clearfix"></div>
  878. {/if}
  879. <form method="post" action="{$smarty.server.PHP_SELF}?a=checkout" name="orderfrm" id="frmCheckout">
  880. <input type="hidden" name="submit" value="true" />
  881. <input type="hidden" name="custtype" id="inputCustType" value="{$custtype}" />
  882. {if $custtype neq "new" && $loggedin}
  883. <div class="sub-heading">
  884. <span>
  885. {lang key='switchAccount.title'}
  886. </span>
  887. </div>
  888. <div id="containerExistingAccountSelect" class="row account-select-container">
  889. {foreach $accounts as $account}
  890. <div class="col-sm-{if $accounts->count() == 1}12{else}6{/if}">
  891. <div class="account{if $selectedAccountId == $account->id} active{/if}">
  892. <label class="radio-inline" for="account{$account->id}">
  893. <input id="account{$account->id}" class="account-select{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled{/if}" type="radio" name="account_id" value="{$account->id}"{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled="disabled"{/if}{if $selectedAccountId == $account->id} checked="checked"{/if}>
  894. <span class="address">
  895. <strong>
  896. {if $account->company}{$account->company}{else}{$account->fullName}{/if}
  897. </strong>
  898. {if $account->isClosed || $account->noPermission}
  899. <span class="label label-default">
  900. {if $account->isClosed}
  901. {lang key='closed'}
  902. {else}
  903. {lang key='noPermission'}
  904. {/if}
  905. </span>
  906. {elseif $account->currencyCode}
  907. <span class="label label-info">
  908. {$account->currencyCode}
  909. </span>
  910. {/if}
  911. <br>
  912. <span class="small">
  913. {$account->address1}{if $account->address2}, {$account->address2}{/if}<br>
  914. {if $account->city}{$account->city},{/if}
  915. {if $account->state} {$account->state},{/if}
  916. {if $account->postcode} {$account->postcode},{/if}
  917. {$account->countryName}
  918. </span>
  919. </span>
  920. </label>
  921. </div>
  922. </div>
  923. {/foreach}
  924. <div class="col-sm-12">
  925. <div class="account border-bottom{if !$selectedAccountId || !is_numeric($selectedAccountId)} active{/if}">
  926. <label class="radio-inline">
  927. <input class="account-select" type="radio" name="account_id" value="new"{if !$selectedAccountId || !is_numeric($selectedAccountId)} checked="checked"{/if}{if $inExpressCheckout} disabled="disabled" class="disabled"{/if}>
  928. {lang key='orderForm.createAccount'}
  929. </label>
  930. </div>
  931. </div>
  932. </div>
  933. {/if}
  934. <div id="containerExistingUserSignin"{if $loggedin || $custtype neq "existing"} class="w-hidden"{/if}>
  935. <div class="sub-heading">
  936. <span>{$LANG.orderForm.existingCustomerLogin}</span>
  937. </div>
  938. <div class="TM-card">
  939. <div class="row">
  940. <div class="col-sm-6">
  941. <div class="form-group prepend-icon">
  942. <label for="inputLoginEmail" class="field-icon">
  943. <i class="fas fa-envelope"></i>
  944. </label>
  945. <input type="text" name="loginemail" id="inputLoginEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$loginemail}">
  946. </div>
  947. </div>
  948. <div class="col-sm-6">
  949. <div class="form-group prepend-icon">
  950. <label for="inputLoginPassword" class="field-icon">
  951. <i class="fas fa-lock"></i>
  952. </label>
  953. <input type="password" name="loginpassword" id="inputLoginPassword" class="field form-control" placeholder="{$LANG.clientareapassword}">
  954. </div>
  955. </div>
  956. </div>
  957. </div>
  958. <div class="text-center">
  959. <button type="button" id="btnExistingLogin" class="btn btn-primary btn-md">
  960. <span id="existingLoginButton">{lang key='login'}</span>
  961. <span id="existingLoginPleaseWait" class="w-hidden">{lang key='pleasewait'}</span>
  962. </button>
  963. </div>
  964. <div class="padding-all">
  965. {include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-existing"}
  966. </div>
  967. </div>
  968. <div id="containerNewUserSignup"{if $custtype === 'existing' || (is_numeric($selectedAccountId) && $selectedAccountId > 0) || ($loggedin && $accounts->count() > 0 && $selectedAccountId !== 'new')} class="w-hidden"{/if}>
  969. <div{if $loggedin} class="w-hidden"{/if}>
  970. <div class="padding-all">
  971. {include file="orderforms/{$carttpl}/linkedaccounts.tpl" linkContext="checkout-new"}
  972. </div>
  973. </div>
  974. <h4>{$LANG.orderForm.personalInformation}</h4>
  975. <div class="TM-card">
  976. <div class="row">
  977. <div class="col-sm-6">
  978. <div class="form-group prepend-icon">
  979. <label for="inputFirstName" class="field-icon">
  980. <i class="fas fa-user"></i>
  981. </label>
  982. <input type="text" name="firstname" id="inputFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$clientsdetails.firstname}" autofocus>
  983. </div>
  984. </div>
  985. <div class="col-sm-6">
  986. <div class="form-group prepend-icon">
  987. <label for="inputLastName" class="field-icon">
  988. <i class="fas fa-user"></i>
  989. </label>
  990. <input type="text" name="lastname" id="inputLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$clientsdetails.lastname}">
  991. </div>
  992. </div>
  993. <div class="col-sm-6">
  994. <div class="form-group prepend-icon">
  995. <label for="inputEmail" class="field-icon">
  996. <i class="fas fa-envelope"></i>
  997. </label>
  998. <input type="email" name="email" id="inputEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$clientsdetails.email}">
  999. </div>
  1000. </div>
  1001. <div class="col-sm-6">
  1002. <div class="form-group prepend-icon">
  1003. <label for="inputPhone" class="field-icon">
  1004. <i class="fas fa-phone"></i>
  1005. </label>
  1006. <input type="tel" name="phonenumber" id="inputPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$clientsdetails.phonenumber}">
  1007. </div>
  1008. </div>
  1009. </div>
  1010. </div>
  1011. <h4>{$LANG.orderForm.billingAddress}</h4>
  1012. <div class="TM-card">
  1013. <div class="row">
  1014. <div class="col-sm-12">
  1015. <div class="form-group prepend-icon">
  1016. <label for="inputCompanyName" class="field-icon">
  1017. <i class="fas fa-building"></i>
  1018. </label>
  1019. <input type="text" name="companyname" id="inputCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$clientsdetails.companyname}">
  1020. </div>
  1021. </div>
  1022. <div class="col-sm-12">
  1023. <div class="form-group prepend-icon">
  1024. <label for="inputAddress1" class="field-icon">
  1025. <i class="fas fa-building"></i>
  1026. </label>
  1027. <input type="text" name="address1" id="inputAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$clientsdetails.address1}">
  1028. </div>
  1029. </div>
  1030. <div class="col-sm-12">
  1031. <div class="form-group prepend-icon">
  1032. <label for="inputAddress2" class="field-icon">
  1033. <i class="fas fa-map-marker-alt"></i>
  1034. </label>
  1035. <input type="text" name="address2" id="inputAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$clientsdetails.address2}">
  1036. </div>
  1037. </div>
  1038. <div class="col-sm-4">
  1039. <div class="form-group prepend-icon">
  1040. <label for="inputCity" class="field-icon">
  1041. <i class="fas fa-building"></i>
  1042. </label>
  1043. <input type="text" name="city" id="inputCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$clientsdetails.city}">
  1044. </div>
  1045. </div>
  1046. <div class="col-sm-5">
  1047. <div class="form-group prepend-icon">
  1048. <label for="state" class="field-icon" id="inputStateIcon">
  1049. <i class="fas fa-map-signs"></i>
  1050. </label>
  1051. <label for="stateinput" class="field-icon" id="inputStateIcon">
  1052. <i class="fas fa-map-signs"></i>
  1053. </label>
  1054. <input type="text" name="state" id="inputState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$clientsdetails.state}">
  1055. </div>
  1056. </div>
  1057. <div class="col-sm-3">
  1058. <div class="form-group prepend-icon">
  1059. <label for="inputPostcode" class="field-icon">
  1060. <i class="fas fa-certificate"></i>
  1061. </label>
  1062. <input type="text" name="postcode" id="inputPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$clientsdetails.postcode}">
  1063. </div>
  1064. </div>
  1065. <div class="col-sm-12">
  1066. <div class="form-group prepend-icon">
  1067. <label for="inputCountry" class="field-icon" id="inputCountryIcon">
  1068. <i class="fas fa-globe"></i>
  1069. </label>
  1070. <select name="country" id="inputCountry" class="field form-control">
  1071. {foreach $countries as $countrycode => $countrylabel}
  1072. <option value="{$countrycode}"{if (!$country && $countrycode == $defaultcountry) || $countrycode eq $country} selected{/if}>
  1073. {$countrylabel}
  1074. </option>
  1075. {/foreach}
  1076. </select>
  1077. </div>
  1078. </div>
  1079. {if $showTaxIdField}
  1080. <div class="col-sm-12">
  1081. <div class="form-group prepend-icon">
  1082. <label for="inputTaxId" class="field-icon">
  1083. <i class="fas fa-building"></i>
  1084. </label>
  1085. <input type="text" name="tax_id" id="inputTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$clientsdetails.tax_id}">
  1086. </div>
  1087. </div>
  1088. {/if}
  1089. </div>
  1090. </div>
  1091. {if $customfields}
  1092. <h4>{$LANG.orderadditionalrequiredinfo}</h4>
  1093. <div class="TM-card">
  1094. <div class="row">
  1095. {foreach from=$customfields key=num item=customfield}
  1096. <div class="col-sm-12">
  1097. <div class="form-group">
  1098. {if $customfield.type eq 'tickbox'}
  1099. <label class=checkbox-inline" for="customfield{$customfield.id}">
  1100. {$customfield.input}
  1101. {$customfield.name}
  1102. </lable>
  1103. {if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
  1104. {else}
  1105. <label for="customfield{$customfield.id}">{$customfield.name}</label>
  1106. {if $customfield.type eq "link"}
  1107. <div class="input-group">
  1108. <span class="input-group-addon" id="customfield{$customfield.id}"><i class="fas fa-link"></i></span>
  1109. {$customfield.input}
  1110. </div>
  1111. {else}
  1112. {$customfield.input}
  1113. {/if}
  1114. {if $customfield.description}<span class="field-help-text">{$customfield.description}</span>{/if}
  1115. {/if}
  1116. </div>
  1117. </div>
  1118. {/foreach}
  1119. </div>
  1120. </div>
  1121. {/if}
  1122. </div>
  1123. {if $domainsinorder}
  1124. <h4>{$LANG.domainregistrantinfo}</h4>
  1125. <p class="small text-muted">{$LANG.orderForm.domainAlternativeContact}</p>
  1126. <div class="row margin-bottom">
  1127. <div class="col-sm-12">
  1128. <select name="contact" id="inputDomainContact" class="field form-control">
  1129. <option value="">{$LANG.usedefaultcontact}</option>
  1130. {foreach $domaincontacts as $domcontact}
  1131. <option value="{$domcontact.id}"{if $contact == $domcontact.id} selected{/if}>
  1132. {$domcontact.name}
  1133. </option>
  1134. {/foreach}
  1135. <option value="addingnew"{if $contact == "addingnew"} selected{/if}>
  1136. {$LANG.clientareanavaddcontact}...
  1137. </option>
  1138. </select>
  1139. </div>
  1140. </div>
  1141. <div class="TM-card{if $contact neq "addingnew"} w-hidden{/if}">
  1142. <div class="row" id="domainRegistrantInputFields">
  1143. <div class="col-sm-6">
  1144. <div class="form-group prepend-icon">
  1145. <label for="inputDCFirstName" class="field-icon">
  1146. <i class="fas fa-user"></i>
  1147. </label>
  1148. <input type="text" name="domaincontactfirstname" id="inputDCFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$domaincontact.firstname}">
  1149. </div>
  1150. </div>
  1151. <div class="col-sm-6">
  1152. <div class="form-group prepend-icon">
  1153. <label for="inputDCLastName" class="field-icon">
  1154. <i class="fas fa-user"></i>
  1155. </label>
  1156. <input type="text" name="domaincontactlastname" id="inputDCLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$domaincontact.lastname}">
  1157. </div>
  1158. </div>
  1159. <div class="col-sm-6">
  1160. <div class="form-group prepend-icon">
  1161. <label for="inputDCEmail" class="field-icon">
  1162. <i class="fas fa-envelope"></i>
  1163. </label>
  1164. <input type="email" name="domaincontactemail" id="inputDCEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$domaincontact.email}">
  1165. </div>
  1166. </div>
  1167. <div class="col-sm-6">
  1168. <div class="form-group prepend-icon">
  1169. <label for="inputDCPhone" class="field-icon">
  1170. <i class="fas fa-phone"></i>
  1171. </label>
  1172. <input type="tel" name="domaincontactphonenumber" id="inputDCPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$domaincontact.phonenumber}">
  1173. </div>
  1174. </div>
  1175. <div class="col-sm-12">
  1176. <div class="form-group prepend-icon">
  1177. <label for="inputDCCompanyName" class="field-icon">
  1178. <i class="fas fa-building"></i>
  1179. </label>
  1180. <input type="text" name="domaincontactcompanyname" id="inputDCCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$domaincontact.companyname}">
  1181. </div>
  1182. </div>
  1183. <div class="col-sm-12">
  1184. <div class="form-group prepend-icon">
  1185. <label for="inputDCAddress1" class="field-icon">
  1186. <i class="fas fa-building"></i>
  1187. </label>
  1188. <input type="text" name="domaincontactaddress1" id="inputDCAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$domaincontact.address1}">
  1189. </div>
  1190. </div>
  1191. <div class="col-sm-12">
  1192. <div class="form-group prepend-icon">
  1193. <label for="inputDCAddress2" class="field-icon">
  1194. <i class="fas fa-map-marker-alt"></i>
  1195. </label>
  1196. <input type="text" name="domaincontactaddress2" id="inputDCAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$domaincontact.address2}">
  1197. </div>
  1198. </div>
  1199. <div class="col-sm-4">
  1200. <div class="form-group prepend-icon">
  1201. <label for="inputDCCity" class="field-icon">
  1202. <i class="fas fa-building"></i>
  1203. </label>
  1204. <input type="text" name="domaincontactcity" id="inputDCCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$domaincontact.city}">
  1205. </div>
  1206. </div>
  1207. <div class="col-sm-5">
  1208. <div class="form-group prepend-icon">
  1209. <label for="inputDCState" class="field-icon">
  1210. <i class="fas fa-map-signs"></i>
  1211. </label>
  1212. <input type="text" name="domaincontactstate" id="inputDCState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$domaincontact.state}">
  1213. </div>
  1214. </div>
  1215. <div class="col-sm-3">
  1216. <div class="form-group prepend-icon">
  1217. <label for="inputDCPostcode" class="field-icon">
  1218. <i class="fas fa-certificate"></i>
  1219. </label>
  1220. <input type="text" name="domaincontactpostcode" id="inputDCPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$domaincontact.postcode}">
  1221. </div>
  1222. </div>
  1223. <div class="col-sm-12">
  1224. <div class="form-group prepend-icon">
  1225. <label for="inputDCCountry" class="field-icon" id="inputCountryIcon">
  1226. <i class="fas fa-globe"></i>
  1227. </label>
  1228. <select name="domaincontactcountry" id="inputDCCountry" class="field form-control">
  1229. {foreach $countries as $countrycode => $countrylabel}
  1230. <option value="{$countrycode}"{if (!$domaincontact.country && $countrycode == $defaultcountry) || $countrycode eq $domaincontact.country} selected{/if}>
  1231. {$countrylabel}
  1232. </option>
  1233. {/foreach}
  1234. </select>
  1235. </div>
  1236. </div>
  1237. <div class="col-sm-12">
  1238. <div class="form-group prepend-icon">
  1239. <label for="inputDCTaxId" class="field-icon">
  1240. <i class="fas fa-building"></i>
  1241. </label>
  1242. <input type="text" name="domaincontacttax_id" id="inputDCTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$domaincontact.tax_id}">
  1243. </div>
  1244. </div>
  1245. </div>
  1246. </div>
  1247. {/if}
  1248. {if !$loggedin}
  1249. <div id="containerNewUserSecurity"{if (!$loggedin && $custtype eq "existing") || ($remote_auth_prelinked && !$securityquestions) } class="w-hidden"{/if}>
  1250. <h4>{$LANG.orderForm.accountSecurity}</h4>
  1251. <div class="TM-card">
  1252. <div id="containerPassword" class="row{if $remote_auth_prelinked && $securityquestions} w-hidden{/if}">
  1253. <div id="passwdFeedback" style="display: none;" class="alert alert-info text-center col-sm-12"></div>
  1254. <div class="col-sm-6">
  1255. <div class="form-group prepend-icon">
  1256. <label for="inputNewPassword1" class="field-icon">
  1257. <i class="fas fa-lock"></i>
  1258. </label>
  1259. <input type="password" name="password" id="inputNewPassword1" data-error-threshold="{$pwStrengthErrorThreshold}" data-warning-threshold="{$pwStrengthWarningThreshold}" class="field form-control" placeholder="{$LANG.clientareapassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
  1260. </div>
  1261. </div>
  1262. <div class="col-sm-6">
  1263. <div class="form-group prepend-icon">
  1264. <label for="inputNewPassword2" class="field-icon">
  1265. <i class="fas fa-lock"></i>
  1266. </label>
  1267. <input type="password" name="password2" id="inputNewPassword2" class="field form-control" placeholder="{$LANG.clientareaconfirmpassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
  1268. </div>
  1269. </div>
  1270. <div class="col-sm-6">
  1271. <button type="button" class="btn btn-default btn-sm generate-password" data-targetfields="inputNewPassword1,inputNewPassword2">
  1272. {$LANG.generatePassword.btnLabel}
  1273. </button>
  1274. </div>
  1275. <div class="col-sm-6">
  1276. <div class="password-strength-meter">
  1277. <div class="progress">
  1278. <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="passwordStrengthMeterBar">
  1279. </div>
  1280. </div>
  1281. <p class="text-center small text-muted" id="passwordStrengthTextLabel">{$LANG.pwstrength}: {$LANG.pwstrengthenter}</p>
  1282. </div>
  1283. </div>
  1284. </div>
  1285. </div>
  1286. {if $securityquestions}
  1287. <div class="TM-card">
  1288. <div class="row">
  1289. <div class="col-sm-12">
  1290. <div class="form-group">
  1291. <select name="securityqid" id="inputSecurityQId" class="field form-control">
  1292. <option value="">{$LANG.clientareasecurityquestion}</option>
  1293. {foreach $securityquestions as $question}
  1294. <option value="{$question.id}"{if $question.id eq $securityqid} selected{/if}>
  1295. {$question.question}
  1296. </option>
  1297. {/foreach}
  1298. </select>
  1299. </div>
  1300. </div>
  1301. <div class="col-sm-12">
  1302. <div class="form-group prepend-icon">
  1303. <label for="inputSecurityQAns" class="field-icon">
  1304. <i class="fas fa-lock"></i>
  1305. </label>
  1306. <input type="password" name="securityqans" id="inputSecurityQAns" class="field form-control" placeholder="{$LANG.clientareasecurityanswer}">
  1307. </div>
  1308. </div>
  1309. </div>
  1310. </div>
  1311. {/if}
  1312. </div>
  1313. {/if}
  1314. {foreach $hookOutput as $output}
  1315. <div style="margin:60px 0;">
  1316. {$output}
  1317. </div>
  1318. {/foreach}
  1319. {* BEGIN thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  1320. {if $total->toNumeric() > 0}
  1321. {* END thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  1322. <h4>{$LANG.orderForm.paymentDetails}</h4>
  1323. <p class="small text-muted margin-bottom">{$LANG.orderForm.preferredPaymentMethod}</p>
  1324. {*
  1325. <div class="alert alert-success text-center large-text" role="alert" id="totalDueToday">
  1326. {$LANG.ordertotalduetoday}: &nbsp; <strong id="totalCartPrice">{$total}</strong>
  1327. </div>
  1328. *}
  1329. <div id="applyCreditContainer" class="apply-credit-container{if !$canUseCreditOnCheckout} w-hidden{/if}" data-apply-credit="{$applyCredit}">
  1330. <p>{lang key='cart.availableCreditBalance' amount=$creditBalance}</p>
  1331. <label class="radio">
  1332. <input id="useCreditOnCheckout" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
  1333. <span id="spanFullCredit"{if !($creditBalance->toNumeric() >= $total->toNumeric())} class="w-hidden"{/if}>
  1334. {lang key='cart.applyCreditAmountNoFurtherPayment' amount=$total}
  1335. </span>
  1336. <span id="spanUseCredit"{if $creditBalance->toNumeric() >= $total->toNumeric()} class="w-hidden"{/if}>
  1337. {lang key='cart.applyCreditAmount' amount=$creditBalance}
  1338. </span>
  1339. </label>
  1340. <label class="radio">
  1341. <input id="skipCreditOnCheckout" type="radio" name="applycredit" value="0"{if !$applyCredit} checked{/if}>
  1342. {lang key='cart.applyCreditSkip' amount=$creditBalance}
  1343. </label>
  1344. </div>
  1345. {if !$inExpressCheckout}
  1346. <div id="paymentGatewaysContainer" class="form-group">
  1347. <div class="text-center">
  1348. {foreach $gateways as $gateway}
  1349. {if $clientsdetails.groupid ne "2" && $gateway.sysname eq "swiss_slip"}
  1350. {continue}
  1351. {/if}
  1352. <label class="radio-inline">
  1353. <input type="radio" name="paymentmethod" value="{$gateway.sysname}" data-payment-type="{$gateway.payment_type}" data-show-local="{$gateway.show_local_cards}"
  1354. data-remote-inputs="{$gateway.uses_remote_inputs}"
  1355. class="payment-methods{if $gateway.type eq "CC"} is-credit-card{/if}"
  1356. {if $selectedgateway eq $gateway.sysname} checked{/if}
  1357. />
  1358. {$gateway.name}
  1359. </label>
  1360. {/foreach}
  1361. </div>
  1362. </div>
  1363. <div class="alert alert-danger text-center gateway-errors w-hidden"></div>
  1364. <div class="clearfix"></div>
  1365. <div class="cc-input-container{if $selectedgatewaytype neq "CC"} w-hidden{/if}" id="creditCardInputFields">
  1366. {if $client}
  1367. <div id="existingCardsContainer" class="existing-cc-grid">
  1368. {include file="orderforms/{$carttpl}/includes/existing-paymethods.tpl"}
  1369. </div>
  1370. {/if}
  1371. <div class="row cvv-input" id="existingCardInfo">
  1372. <div class="col-lg-3 col-sm-4">
  1373. <div class="form-group prepend-icon">
  1374. <label for="inputCardCVV2" class="field-icon">
  1375. <i class="fas fa-barcode"></i>
  1376. </label>
  1377. <div class="input-group">
  1378. <input type="tel" name="cccvv" id="inputCardCVV2" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
  1379. <span class="input-group-btn input-group-append">
  1380. <button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
  1381. ?
  1382. </button>
  1383. </span>
  1384. </div>
  1385. <span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
  1386. </div>
  1387. </div>
  1388. </div>
  1389. <ul>
  1390. <li>
  1391. <label class="radio-inline">
  1392. <input type="radio" name="ccinfo" value="new" id="new" {if !$client || $client->payMethods->count() === 0} checked="checked"{/if} />
  1393. &nbsp;
  1394. {lang key='creditcardenternewcard'}
  1395. </label>
  1396. </li>
  1397. </ul>
  1398. <div class="row" id="newCardInfo">
  1399. <div id="cardNumberContainer" class="col-sm-6 new-card-container">
  1400. <div class="form-group prepend-icon">
  1401. <label for="inputCardNumber" class="field-icon">
  1402. <i class="fas fa-credit-card"></i>
  1403. </label>
  1404. <input type="tel" name="ccnumber" id="inputCardNumber" class="field cc-number-field" placeholder="{$LANG.orderForm.cardNumber}" autocomplete="cc-number" data-message-unsupported="{lang key='paymentMethodsManage.unsupportedCardType'}" data-message-invalid="{lang key='paymentMethodsManage.cardNumberNotValid'}" data-supported-cards="{$supportedCardTypes}" />
  1405. <span class="field-error-msg"></span>
  1406. </div>
  1407. </div>
  1408. <div class="col-sm-3 new-card-container">
  1409. <div class="form-group prepend-icon">
  1410. <label for="inputCardExpiry" class="field-icon">
  1411. <i class="fas fa-calendar-alt"></i>
  1412. </label>
  1413. <input type="tel" name="ccexpirydate" id="inputCardExpiry" class="field form-control" placeholder="MM / YY{if $showccissuestart} ({$LANG.creditcardcardexpires}){/if}" autocomplete="cc-exp">
  1414. <span class="field-error-msg">{lang key="paymentMethodsManage.expiryDateNotValid"}</span>
  1415. </div>
  1416. </div>
  1417. <div class="col-sm-3" id="cvv-field-container">
  1418. <div class="form-group prepend-icon">
  1419. <label for="inputCardCVV" class="field-icon">
  1420. <i class="fas fa-barcode"></i>
  1421. </label>
  1422. <div class="input-group">
  1423. <input type="tel" name="cccvv" id="inputCardCVV" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
  1424. <span class="input-group-btn input-group-append">
  1425. <button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
  1426. ?
  1427. </button>
  1428. </span><br>
  1429. </div>
  1430. <span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
  1431. </div>
  1432. </div>
  1433. {if $showccissuestart}
  1434. <div class="col-sm-3 col-sm-offset-6 new-card-container">
  1435. <div class="form-group prepend-icon">
  1436. <label for="inputCardStart" class="field-icon">
  1437. <i class="far fa-calendar-check"></i>
  1438. </label>
  1439. <input type="tel" name="ccstartdate" id="inputCardStart" class="field form-control" placeholder="MM / YY ({$LANG.creditcardcardstart})" autocomplete="cc-exp">
  1440. </div>
  1441. </div>
  1442. <div class="col-sm-3 new-card-container">
  1443. <div class="form-group prepend-icon">
  1444. <label for="inputCardIssue" class="field-icon">
  1445. <i class="fas fa-asterisk"></i>
  1446. </label>
  1447. <input type="tel" name="ccissuenum" id="inputCardIssue" class="field form-control" placeholder="{$LANG.creditcardcardissuenum}">
  1448. </div>
  1449. </div>
  1450. {/if}
  1451. </div>
  1452. <div id="newCardSaveSettings">
  1453. <div class="row form-group new-card-container">
  1454. <div id="inputDescriptionContainer" class="col-md-6">
  1455. <div class="prepend-icon">
  1456. <label for="inputDescription" class="field-icon">
  1457. <i class="fas fa-pencil"></i>
  1458. </label>
  1459. <input type="text" class="field form-control" id="inputDescription" name="ccdescription" autocomplete="off" value="" placeholder="{$LANG.paymentMethods.descriptionInput} {$LANG.paymentMethodsManage.optional}" />
  1460. </div>
  1461. </div>
  1462. {if $allowClientsToRemoveCards}
  1463. <div id="inputNoStoreContainer" class="col-md-6" style="line-height: 32px;">
  1464. <input type="hidden" name="nostore" value="1">
  1465. <input type="checkbox" class="toggle-switch-success no-icheck" data-size="mini" checked="checked" name="nostore" id="inputNoStore" value="0" data-on-text="{lang key='yes'}" data-off-text="{lang key='no'}">
  1466. <label for="inputNoStore" class="checkbox-inline no-padding">
  1467. &nbsp;&nbsp;
  1468. {$LANG.creditCardStore}
  1469. </label>
  1470. </div>
  1471. {/if}
  1472. </div>
  1473. </div>
  1474. </div>
  1475. {else}
  1476. {if $expressCheckoutOutput}
  1477. {$expressCheckoutOutput}
  1478. {else}
  1479. <p align="center">
  1480. {lang key='paymentPreApproved' gateway=$expressCheckoutGateway}
  1481. </p>
  1482. {/if}
  1483. {/if}
  1484. {* BEGIN thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  1485. {else}
  1486. <input type="hidden"
  1487. name="paymentmethod"
  1488. value="swiss_slip"
  1489. data-payment-type="Invoices"
  1490. data-show-local="false"
  1491. data-remote-inputs="false"
  1492. class="payment-methods"
  1493. checked
  1494. />
  1495. {/if}
  1496. {* END thurdata -> keine Anzeige von Zahlungsmethoden bei Betrag = 0 *}
  1497. {if $shownotesfield}
  1498. <h4>{$LANG.orderForm.additionalNotes}</h4>
  1499. <div class="TM-card">
  1500. <div class="row">
  1501. <div class="col-sm-12">
  1502. <div class="form-group">
  1503. <textarea name="notes" class="field form-control" rows="4" placeholder="{$LANG.ordernotesdescription}">{$orderNotes}</textarea>
  1504. </div>
  1505. </div>
  1506. </div>
  1507. </div>
  1508. {/if}
  1509. {if $showMarketingEmailOptIn}
  1510. <h4>{lang key='emailMarketing.joinOurMailingList'}</h4>
  1511. <div class="TM-card">
  1512. <p>{$marketingEmailOptInMessage}</p>
  1513. <div class="panel panel-switch {if $marketingEmailOptIn} checked{/if}">
  1514. <div class="panel-body">
  1515. <span class="switch-label">{lang key='emailMarketing.joinOurMailingList'}: </span>
  1516. <label class="switch switch--text">
  1517. <input class="no-icheck switch__checkbox" type="checkbox" name="marketingoptin" value="1"{if $marketingEmailOptIn} checked{/if}>
  1518. <span class="switch__container"><span class="switch__handle"></span></span>
  1519. </label>
  1520. </div>
  1521. </div>
  1522. </div>
  1523. {/if}
  1524. <div class="text-center">
  1525. {if $accepttos}
  1526. <p>
  1527. <label class="checkbox-inline">
  1528. <input type="checkbox" name="accepttos" id="accepttos" />
  1529. &nbsp;
  1530. {$LANG.ordertosagreement}
  1531. <a href="{$tosurl}" target="_blank">{$LANG.ordertos}</a>
  1532. </label>
  1533. </p>
  1534. {/if}
  1535. {if $captcha}
  1536. <div class="text-center margin-bottom">
  1537. {include file="$template/includes/captcha.tpl"}
  1538. </div>
  1539. {/if}
  1540. <button type="submit"
  1541. id="btnCompleteOrder"
  1542. class="margin-bottom btn btn-primary btn-lg disable-on-click spinner-on-click{if $captcha}{$captcha->getButtonClass($captchaForm)}{/if}"
  1543. {if $cartitems==0}disabled="disabled"{/if}
  1544. >
  1545. {if $rawtotal==0}Kostenlos bestellen
  1546. {else}
  1547. {if $inExpressCheckout}{$LANG.confirmAndPay}{else}{$LANG.completeorder}{/if}
  1548. {/if}
  1549. &nbsp;<i class="fas fa-arrow-circle-right"></i>
  1550. </button>
  1551. </div>
  1552. </form>
  1553. </div>
  1554. </div>
  1555. </div>
  1556. <script type="text/javascript" src="{$orderform.assetPath.js}/jquery.payment.js"></script>
  1557. {/if}