products.tpl 76 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539
  1. <!-- modules/addons/adminpanel/core/front/products.tpl -->
  2. {debug}
  3. {assign billingcycle "monthly"}
  4. {if $block.sechidden neq "true"}
  5. {if $block.ptstyle == ''}
  6. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  7. <div class="container">
  8. {if $block.caption || $block.sectitle || $block.subtitle}
  9. <div class="sec-description">
  10. {if $block.caption}
  11. <div class="sec-caption">
  12. <span class="rounded">{$block.caption}</span>
  13. </div>
  14. {/if}
  15. {if $block.sectitle}
  16. <h2 class="sec-title">{$block.sectitle}</h2>
  17. {/if}
  18. {if $block.subtitle}
  19. <div class="sec-subtitle">{$block.subtitle}</div>
  20. {/if}
  21. </div>
  22. {/if}
  23. <div class="cros-pricing-container{if $block.itemcounts < "3"} mw-768 mx-auto{/if}">
  24. {if $block.SbSwitcher && !$block.DisableSwitcher}
  25. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  26. {assign var="cycles" value=$block.switcherCycles}
  27. {else}
  28. {assign var="cycles" value=$allCycles}
  29. {/if}
  30. {if !$block.bsco}
  31. {assign var="cycles" value=$cycles|@array_reverse}
  32. {/if}
  33. <div class="product-billing-switcher-{$blockkey}">
  34. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  35. {foreach $cycles as $cycle}
  36. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  37. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  38. </button>
  39. {/foreach}
  40. </div>
  41. <div class="btn-group white border d-inline-block d-sm-none">
  42. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  43. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  44. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  45. </button>
  46. <ul class="dropdown-menu">
  47. {foreach $cycles as $cycle}
  48. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  49. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  50. </li>
  51. {/foreach}
  52. </ul>
  53. </div>
  54. </div>
  55. {/if}
  56. <!-- div class pricing_style_2 -->
  57. <div class="pricing_style_2">
  58. <div class="swiper" id="pricing-tables-{$blockkey}">
  59. <div class="row row-eq-height{if !$block.DisplayInGrid} flex-nowrap{/if} pricing-slider pricing-{$blockkey} swiper-wrapper{if count($block.table) < 3} justify-content-md-center{/if}">
  60. {if count($block.table) > 0}
  61. {foreach from=$block.table item=$ditem key=$kk}
  62. <div class="col-12{if $block.itemcounts == "2"} col-md-6{elseif $block.itemcounts == "3"} col-md-6 col-lg-4 col-xl-4{elseif $block.itemcounts == "4"} col-md-6 col-lg-4 col-xl-3{/if} products-slide">
  63. <div class="cros-pricing-table overflow-hidden mt-0 mb-4{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}{if $ditem['Featured']} active{/if}{if $block.centered} centered{/if}">
  64. {if $ditem['Graphic']}
  65. <div class="graphics mb-3">
  66. {if !$ditem['Graphic']|strstr:"fa-"}
  67. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
  68. {else}
  69. <span class="icon">
  70. <i class="{$ditem['Graphic']}"></i>
  71. </span>
  72. {/if}
  73. </div>
  74. {/if}
  75. <div class="h4">{$ditem['productdetails']['name']}</div>
  76. {if $ditem['Featured']}
  77. {if $block.ststyle}
  78. <div class="feature-sticker">
  79. <span class="st-sm">
  80. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  81. </span>
  82. </div>
  83. {else}
  84. <div class="sticker-wrapper">
  85. <div class="sticker">
  86. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  87. </div>
  88. </div>
  89. {/if}
  90. {/if}
  91. {if $block.descp == ""}
  92. {if count($ditem['productdetails']['description']['features']) > 0}
  93. {if $ditem['productdetails']['description']['featuresdesc']}
  94. <div class="desc">{$ditem['productdetails']['description']['featuresdesc']}</div>
  95. {/if}
  96. {/if}
  97. {/if}
  98. <div class="product_pricing_single">
  99. {if $block.DisableBrekdown}
  100. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  101. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  102. {assign var="firstCycle" value=$dropdown|@end}
  103. {if $firstCycle.hasconfigoptions}
  104. <div class="regular_pricing">
  105. <span class="small text-muted">{$WLANG.from}</span>
  106. </div>
  107. {/if}
  108. <div class="price">
  109. <span class="cost">
  110. {$firstCycle.prefix}{$firstCycle.price}
  111. </span>
  112. <span class="suffix">
  113. {$firstCycle.suffix}
  114. </spn>
  115. </div>
  116. <div class="cycle small text-muted">
  117. {$firstCycle.cycle|capitalize}
  118. </div>
  119. {/foreach}
  120. {/if}
  121. {else}
  122. {if $ditem["price"] == 'FREE'}
  123. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  124. {else}
  125. {if $ditem["productdetails"]['hasconfigoptions']}
  126. <div class="regular_pricing">
  127. <span class="small text-muted">{$WLANG.from}</span>
  128. </div>
  129. {/if}
  130. <div class="price">
  131. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  132. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  133. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  134. </div>
  135. {if $ditem["billingcycle"] != ""}
  136. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  137. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  138. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  139. {/if}
  140. {if $ditem["productdetails"]["price"]["setupFee"]}
  141. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  142. {/if}
  143. {/if}
  144. {/if}
  145. </div>
  146. {if $block.descp == "below" || $block.descp == "1"}
  147. {if count($ditem['productdetails']['description']['features']) > 0}
  148. {if $ditem['productdetails']['description']['featuresdesc']}
  149. <div class="desc mt-2">{$ditem['productdetails']['description']['featuresdesc']}</div>
  150. {/if}
  151. {/if}
  152. {/if}
  153. {*
  154. {if !$block.orderLinkinLast}
  155. <div class="product-actions w-100">
  156. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  157. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  158. </a>
  159. </div>
  160. {/if}
  161. *}
  162. {if $block.descp == "2"}
  163. {if count($ditem['productdetails']['description']['features']) > 0}
  164. {if $ditem['productdetails']['description']['featuresdesc']}
  165. <div class="desc_small mt-3 mb-1">{$ditem['productdetails']['description']['featuresdesc']}</div>
  166. {/if}
  167. {/if}
  168. {/if}
  169. <!-- Features / Eigenschaften -->
  170. {if $block.featurescollapsed}
  171. <!-- Features / Collapsed -->
  172. {if $ditem['productdetails']['description']}
  173. {if count($ditem['productdetails']['description']['features']) > 0}
  174. <ul class="plan-features">
  175. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  176. <li><b>{$feature}</b>{$value}</li>
  177. {/foreach}
  178. </ul>
  179. {else}
  180. <div class="plan-features">
  181. {$ditem['productdetails']['description']['original']}
  182. </div>
  183. {/if}
  184. {/if}
  185. {else}
  186. <!-- Features / NOT Collapsed -->
  187. <p class="PriceList-toggle collapsed" data-toggle="collapse" data-target="#PlanLists{$kk + 1}">
  188. <span>{$WLANG.clientareaviewdetails}</span>
  189. </p>
  190. {if $ditem['productdetails']['description']}
  191. {if count($ditem['productdetails']['description']['features']) > 0}
  192. <ul class="plan-features collapse" id="PlanLists{$kk + 1}">
  193. <table border="0" style="display: inline-table; table-layout:fixed; width:100%; visibility:visible;" cellpadding="0" cellspacing="5">
  194. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  195. <tr>
  196. <td><b>{$feature}</b></td>
  197. <td>
  198. {if $value == "Ja"}
  199. <i class="far fa-check-square" class="td-product-feature-icon"></i>
  200. {elseif $value == "Nein"}
  201. <i class="far fa-square" class="td-product-feature-icon"></i>
  202. {elseif $value == "Optional"}
  203. <i class="fas fa-plus" class="td-product-feature-icon"></i>
  204. {else}
  205. {$value}
  206. {/if}
  207. </td>
  208. </tr>
  209. {/foreach}
  210. </table>
  211. {*
  212. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  213. <li><b>{$feature}: </b>{$value}</li>
  214. {/foreach}
  215. *}
  216. </ul>
  217. {else}
  218. <div class="plan-features collapse" id="PlanLists{$kk + 1}">
  219. {$ditem['productdetails']['description']['original']}
  220. </div>
  221. {/if}
  222. {/if}
  223. {/if}
  224. {if !$block.orderLinkinLast}
  225. <div class="product-actions w-100">
  226. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  227. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  228. </a>
  229. </div>
  230. {/if}
  231. {if $block.orderLinkinLast}
  232. <div class="product-actions mt-auto">
  233. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-primary my-3 w-auto{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  234. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  235. </a>
  236. </div>
  237. {/if}
  238. </div>
  239. </div>
  240. {/foreach}
  241. {/if}
  242. </div>
  243. </div>
  244. </div>
  245. <!-- TD DisplayInGrid -->
  246. {if !$block.DisplayInGrid}
  247. {if !$block.slidertype}
  248. <div class="swiper-pagination pricing-tables_{$blockkey}"></div>
  249. {else}
  250. <div class="swiper-button-prev pricing-tables_{$blockkey}_prev">
  251. <span class="btn_icon_large"><i class="far fa-long-arrow-left"></i></span>
  252. </div>
  253. <div class="swiper-button-next pricing-tables_{$blockkey}_next">
  254. <span class="btn_icon_large"><i class="far fa-long-arrow-right"></i></span>
  255. </div>
  256. {/if}
  257. {/if}
  258. </div>
  259. </div>
  260. </div>
  261. <script>
  262. jQuery(document).ready(function () {
  263. {if !$block.DisplayInGrid}
  264. var swiper = new Swiper('#pricing-tables-{$blockkey}', {
  265. slidesPerView: 1,
  266. preventClicks: true,
  267. slideClass: 'products-slide',
  268. {if !$block.slidertype}
  269. pagination: {
  270. el: '.swiper-pagination.pricing-tables_{$blockkey}',
  271. clickable: true,
  272. },
  273. {else}
  274. navigation: {
  275. nextEl: '.pricing-tables_{$blockkey}_next',
  276. prevEl: '.pricing-tables_{$blockkey}_prev',
  277. },
  278. {/if}
  279. breakpoints: {
  280. 0: {
  281. slidesPerView: 1
  282. },
  283. 768: {
  284. slidesPerView: 2
  285. },
  286. 992: {
  287. slidesPerView:{if $block.itemcounts == "2"} 2{else} 3{/if}
  288. },
  289. 1200: {
  290. slidesPerView:{if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if}
  291. },
  292. }
  293. });
  294. {/if}
  295. {if $block.SbSwitcher && !$block.DisableSwitcher}
  296. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  297. var selText = jQuery(this).html();
  298. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  299. });
  300. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  301. var newCycle = jQuery(this).data('cycle');
  302. var disBtnBilCycle = jQuery(this).data('cycle');
  303. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  304. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  305. jQuery(this).addClass('active').siblings().removeClass('active');
  306. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  307. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  308. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  309. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  310. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  311. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  312. if (jQuery(this).find('.' + newCycle).length <= 0) {
  313. jQuery(this).find('.pricing_main_default').show();
  314. jQuery(this).find('.btn-primary').addClass('disabled');
  315. } else {
  316. jQuery(this).find('.pricing_main_default').hide();
  317. jQuery(this).find('.btn-primary').removeClass('disabled');
  318. }
  319. });
  320. });
  321. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  322. {else}
  323. {if !$block.DisableSwitcher}
  324. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  325. var selText = jQuery(this).html();
  326. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  327. });
  328. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  329. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  330. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  331. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  332. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  333. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  334. jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href',disBtnUrlFinal);
  335. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  336. crosPricingTable.find('.pricing_main').each(function() {
  337. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  338. if (currentBilCycle === disBtnBilCycle) {
  339. jQuery(this).removeClass('w-hidden');
  340. } else {
  341. jQuery(this).addClass('w-hidden');
  342. }
  343. });
  344. });
  345. {/if}
  346. {/if}
  347. });
  348. </script>
  349. {elseif $block.ptstyle == 'pts_1'}
  350. <!-- TD pts_1 -->
  351. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  352. <div class="container">
  353. {if $block.caption || $block.sectitle || $block.subtitle}
  354. <div class="sec-description">
  355. {if $block.caption}
  356. <div class="sec-caption">
  357. <span class="rounded">{$block.caption}</span>
  358. </div>
  359. {/if}
  360. {if $block.sectitle}
  361. <h2 class="sec-title">{$block.sectitle}</h2>
  362. {/if}
  363. {if $block.subtitle}
  364. <div class="sec-subtitle">{$block.subtitle}</div>
  365. {/if}
  366. </div>
  367. {/if}
  368. <!-- Cross Pricing Container -->
  369. <div class="cros-pricing-container">
  370. {if $block.SbSwitcher && !$block.DisableSwitcher}
  371. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  372. {assign var="cycles" value=$block.switcherCycles}
  373. {else}
  374. {assign var="cycles" value=$allCycles}
  375. {/if}
  376. {if !$block.bsco}
  377. {assign var="cycles" value=$cycles|@array_reverse}
  378. {/if}
  379. <div class="product-billing-switcher-{$blockkey}">
  380. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  381. {foreach $cycles as $cycle}
  382. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  383. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  384. </button>
  385. {/foreach}
  386. </div>
  387. <div class="btn-group white border d-inline-block d-sm-none">
  388. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  389. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  390. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  391. </button>
  392. <ul class="dropdown-menu">
  393. {foreach $cycles as $cycle}
  394. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  395. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  396. </li>
  397. {/foreach}
  398. </ul>
  399. </div>
  400. </div>
  401. {/if}
  402. <!-- TD:Pricing style 2 -->
  403. <div class="pricing_style_2 pricing-{$blockkey}" id="pricing-tables-{$blockkey}">
  404. {if count($block.table) > 0}
  405. {foreach from=$block.table item=$ditem key=$kk}
  406. <div class="cros-pricing-table{if $block.SbSwitcher} overflow-hidden{/if}{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if} pt_st_5{if $ditem['Featured']} active{/if}">
  407. <div class="row no-gutters">
  408. <div class="col-lg-8 col-xl-9">
  409. <div class="content align-items-lg-center">
  410. {if $ditem['Graphic']}
  411. {if !$ditem['Graphic']|strstr:"fa-"}
  412. <div class="graphics fix-width">
  413. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
  414. </div>
  415. {else}
  416. <div class="graphics">
  417. <span class="icon">
  418. <i class="{$ditem['Graphic']}"></i>
  419. </span>
  420. </div>
  421. {/if}
  422. {/if}
  423. <div class="plan-details">
  424. <div class="h4 plan-name">
  425. {$ditem['productdetails']['name']}
  426. {if $ditem['Featured']}
  427. {if $block.ststyle}
  428. <span class="st-sm ml-2 fw-400">
  429. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  430. </span>
  431. {/if}
  432. {/if}
  433. </div>
  434. {if count($ditem['productdetails']['description']['features']) > 0}
  435. {if strpos($ditem['productdetails']['description']['featuresdesc'], '<p>') !== false}
  436. {$ditem['productdetails']['description']['featuresdesc']}
  437. {else}
  438. <p>{$ditem['productdetails']['description']['featuresdesc']}</p>
  439. {/if}
  440. {/if}
  441. <!-- Eigenschaften 1 -->
  442. {if $ditem['productdetails']['description']}
  443. <!-- Eigenschaften 2 -->
  444. {if count($ditem['productdetails']['description']['features']) > 0}
  445. <!-- Eigenschaften 3 -->
  446. <ul class="plan-features">
  447. {foreach $ditem['productdetails']['description']['features'] as $feature => $value}
  448. <li><b>{$feature}</b>{$value}</li>
  449. {/foreach}
  450. </ul>
  451. {else}
  452. {$ditem['productdetails']['description']['original']}
  453. {/if}
  454. {/if}
  455. </div>
  456. </div>
  457. </div>
  458. <div class="col-lg-4 col-xl-3">
  459. <div class="content{if $block.SbSwitcher && $ditem['Featured'] && !$block.ststyle} mr-0 mr-lg-4{/if}">
  460. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  461. {if $block.bsco}
  462. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  463. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  464. {/foreach}
  465. {/if}
  466. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  467. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  468. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  469. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  470. <div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">
  471. {if !$block.SbSwitcher}
  472. <div class="btn-group mb-2 mb-lg-0">
  473. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  474. <div class="pricing_wrapr">
  475. {$dropdownprice['billingcycle']}
  476. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  477. </div>
  478. <span class="fal fa-angle-down"></span>
  479. </a>
  480. <ul class="dropdown-menu">
  481. {if $ditem["dropdown"][$ditem['Plan']]}
  482. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  483. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  484. <div class="pricing_wrapr">
  485. {$dropdownprice['billingcycle']}
  486. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  487. </div>
  488. </li>
  489. {/foreach}
  490. {/if}
  491. </ul>
  492. </div>
  493. {/if}
  494. {if $ditem["dropdown"][$ditem['Plan']]}
  495. <div class="product_pricing">
  496. {if $block.SbSwitcher}
  497. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  498. <div class="price">
  499. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  500. <span class="regular_pricing">
  501. {if $dropdownprice['hasconfigoptions']}
  502. <span class="small text-muted">{$WLANG.from}</span>
  503. {/if}
  504. {if $dropdownprice['save']}
  505. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  506. <span class="savecut text-muted">
  507. {$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}
  508. </span>
  509. {/if}
  510. {* {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if} *}
  511. {/if}
  512. </span>
  513. {/if}
  514. <span class="cost">
  515. {$dropdownprice['prefix']}
  516. {if $block.DisableBrekdown}
  517. {$dropdownprice['price']}
  518. {else}
  519. {$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}
  520. {/if}
  521. </span>
  522. {if $dropdownprice['suffix']}
  523. <span class="suffix">
  524. {$dropdownprice['suffix']}
  525. </span>
  526. {/if}
  527. </div>
  528. <span class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</span>
  529. {if $dropdownprice['setup'] > 0}
  530. <div class="small text-muted">
  531. <span><i class="fal fa-plus"></i></span>
  532. <span>{$dropdownprice['prefix']}</span>
  533. {$dropdownprice['setup']}
  534. <span>{$dropdownprice['suffix']}</span>
  535. {$WLANG.ordersetupfee}
  536. </div>
  537. {/if}
  538. </div>
  539. {/if}
  540. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  541. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  542. <div class="price">
  543. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  544. <span class="regular_pricing">
  545. {if $dropdownprice['hasconfigoptions']}
  546. <span class="small text-muted">{$WLANG.from}</span>
  547. {/if}
  548. {if $dropdownprice['save']}
  549. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  550. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  551. {/if}
  552. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  553. {/if}
  554. </span>
  555. {/if}
  556. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  557. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  558. </div>
  559. <span class="cycle small text-muted">
  560. {if $block.DisableBrekdown}
  561. {$dropdownprice.cycle|capitalize}
  562. {else}
  563. {if $dropdownprice['monthlycycle']}
  564. {$dropdownprice['monthlycycle']}
  565. {else}
  566. {$dropdownprice['cycleTerm']}
  567. {/if}
  568. {/if}
  569. </span>
  570. {if $dropdownprice['setup'] > 0}
  571. <div class="small text-muted">
  572. <span><i class="fal fa-plus"></i></span>
  573. <span>{$dropdownprice['prefix']}</span>
  574. {$dropdownprice['setup']}
  575. <span>{$dropdownprice['suffix']}</span>
  576. {$WLANG.ordersetupfee}
  577. </div>
  578. {/if}
  579. </div>
  580. {/foreach}
  581. </div>
  582. {/if}
  583. </div>
  584. {else}
  585. <div class="product_pricing_single">
  586. {if $block.DisableBrekdown}
  587. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  588. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  589. {assign var="firstCycle" value=$dropdown|@end}
  590. <div class="price">
  591. {if $firstCycle.hasconfigoptions}
  592. <span class="regular_pricing">
  593. <span class="small text-muted">{$WLANG.from}</span>
  594. </span>
  595. {/if}
  596. <span class="cost">
  597. {$firstCycle.prefix}{$firstCycle.price}
  598. </span>
  599. <span class="suffix">
  600. {$firstCycle.suffix}
  601. </spn>
  602. </div>
  603. <div class="cycle small text-muted">
  604. {$firstCycle.cycle|capitalize}
  605. </div>
  606. {/foreach}
  607. {/if}
  608. {else}
  609. {if $ditem["price"] == 'FREE'}
  610. <div class="d-flex align-items-center justify-content-end">
  611. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  612. </div>
  613. {else}
  614. <div class="price">
  615. {if $ditem["productdetails"]['hasconfigoptions']}
  616. <span class="regular_pricing">
  617. <span class="small text-muted">{$WLANG.from}</span>
  618. </span>
  619. {/if}
  620. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  621. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  622. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  623. </div>
  624. {if $ditem["billingcycle"] != ""}
  625. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  626. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  627. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  628. {/if}
  629. {if $ditem["productdetails"]["price"]["setupFee"]}
  630. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  631. {/if}
  632. {/if}
  633. {/if}
  634. </div>
  635. {/if}
  636. <div class="plan-action mt-auto">
  637. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-sm btn-primary mt-2{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  638. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  639. </a>
  640. </div>
  641. </div>
  642. </div>
  643. </div>
  644. {if $ditem['Featured']}
  645. {if $block.ststyle == ""}
  646. <div class="sticker-wrapper{if !$block.SbSwitcher} se{/if}">
  647. <div class="sticker">
  648. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  649. </div>
  650. </div>
  651. {/if}
  652. {/if}
  653. </div>
  654. {/foreach}
  655. {/if}
  656. </div>
  657. </div>
  658. </div>
  659. </div>
  660. <script>
  661. jQuery(document).ready(function () {
  662. {if $block.SbSwitcher && !$block.DisableSwitcher}
  663. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  664. var selText = jQuery(this).html();
  665. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  666. });
  667. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  668. var newCycle = jQuery(this).data('cycle');
  669. var disBtnBilCycle = jQuery(this).data('cycle');
  670. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  671. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  672. jQuery(this).addClass('active').siblings().removeClass('active');
  673. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  674. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  675. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  676. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  677. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  678. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  679. if (jQuery(this).find('.' + newCycle).length <= 0) {
  680. jQuery(this).find('.pricing_main_default').show();
  681. jQuery(this).find('.btn-primary').addClass('disabled');
  682. } else {
  683. jQuery(this).find('.pricing_main_default').hide();
  684. jQuery(this).find('.btn-primary').removeClass('disabled');
  685. }
  686. });
  687. });
  688. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  689. {else}
  690. {if !$block.DisableSwitcher}
  691. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  692. var selText = jQuery(this).html();
  693. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  694. });
  695. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  696. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  697. var disBtnUrlFetch = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href');
  698. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  699. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  700. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  701. jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-primary').attr('href',disBtnUrlFinal);
  702. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  703. crosPricingTable.find('.pricing_main').each(function() {
  704. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  705. if (currentBilCycle === disBtnBilCycle) {
  706. jQuery(this).removeClass('w-hidden');
  707. } else {
  708. jQuery(this).addClass('w-hidden');
  709. }
  710. });
  711. });
  712. {/if}
  713. {/if}
  714. });
  715. </script>
  716. {elseif $block.ptstyle == 'pts_2'}
  717. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  718. <div class="section__plan_comparison">
  719. <div class="container">
  720. {if $block.caption || $block.sectitle || $block.subtitle}
  721. <div class="sec-description">
  722. {if $block.caption}
  723. <div class="sec-caption">
  724. <span class="rounded">{$block.caption}</span>
  725. </div>
  726. {/if}
  727. {if $block.sectitle}
  728. <h2 class="sec-title">{$block.sectitle}</h2>
  729. {/if}
  730. {if $block.subtitle}
  731. <div class="sec-subtitle">{$block.subtitle}</div>
  732. {/if}
  733. </div>
  734. {/if}
  735. <div class="cros-pricing-container">
  736. {if $block.SbSwitcher && !$block.DisableSwitcher}
  737. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  738. {assign var="cycles" value=$block.switcherCycles}
  739. {else}
  740. {assign var="cycles" value=$allCycles}
  741. {/if}
  742. {if !$block.bsco}
  743. {assign var="cycles" value=$cycles|@array_reverse}
  744. {/if}
  745. <div class="product-billing-switcher-{$blockkey}">
  746. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  747. {foreach $cycles as $cycle}
  748. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  749. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  750. </button>
  751. {/foreach}
  752. </div>
  753. <div class="btn-group white border d-inline-block d-sm-none">
  754. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  755. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  756. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  757. </button>
  758. <ul class="dropdown-menu">
  759. {foreach $cycles as $cycle}
  760. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  761. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  762. </li>
  763. {/foreach}
  764. </ul>
  765. </div>
  766. </div>
  767. {/if}
  768. <div class="cros-pricing-table tables_{$blockkey} no-animation{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}">
  769. <div class="plans_slider__nav border-bottom">
  770. <div class="swiper-button-next tables_{$blockkey}_next">
  771. <span class="btn__text text-muted">{$WLANG.tablepagesnext}</span>
  772. <span class="btn__icon"><i class="far fa-long-arrow-right"></i></span>
  773. </div>
  774. <div class="swiper-button-prev tables_{$blockkey}_prev">
  775. <span class="btn__icon"><i class="far fa-long-arrow-left"></i></span>
  776. <span class="btn__text text-muted">{$WLANG.tablepagesprevious}</span>
  777. </div>
  778. </div>
  779. <div class="plan plan-{$blockkey}{if $block.centered} centered{/if}">
  780. <div class="plan__column plan__column--empty">
  781. <div class="plan__header d-flex align-items-center{if $block.table[0].Graphic|trim != ""} hg{/if}">
  782. <span class="h4">{$WLANG['store']['ox']['featuresHeadline']}</span>
  783. </div>
  784. <div class="plan__body plan__body--right">
  785. {foreach from=$block.table|@array_column:'featurelist'|@array_count_values item=count key=featurelist}
  786. {$featurelist}
  787. {/foreach}
  788. <div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}"></div>
  789. </div>
  790. </div>
  791. <div class="swiper-container" id="plans-slider-{$blockkey}">
  792. <div class="swiper-wrapper">
  793. {if count($block.table) > 0}
  794. {foreach from=$block.table item=$ditem key=$kk}
  795. <div class="swiper-slide">
  796. <div class="plan__column">
  797. <div class="plan__header{if $ditem['Graphic']} hg{/if}">
  798. {if $ditem['Graphic']}
  799. <div class="graphics">
  800. {if !$ditem['Graphic']|strstr:"fa-"}
  801. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="img-fluid">
  802. {else}
  803. <span class="icon">
  804. <i class="{$ditem['Graphic']}"></i>
  805. </span>
  806. {/if}
  807. </div>
  808. {/if}
  809. <span class="h4">{$ditem['productdetails']['name']}</span>
  810. </div>
  811. <div class="plan__body">
  812. {$ditem['featuresvalues']}
  813. <div class="plan__cell plan__cell-last{if $block.SbSwitcher || $block.DisableSwitcher} sb{/if}">
  814. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  815. {if $block.bsco}
  816. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  817. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  818. {/foreach}
  819. {/if}
  820. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  821. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  822. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  823. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  824. <div class="billing-cycle-pricing float{if $block.descp == "below"} desc_belwo{/if}">
  825. {if !$block.SbSwitcher}
  826. <div class="btn-group mb-2 dropup">
  827. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  828. <div class="pricing_wrapr">
  829. {$dropdownprice['billingcycle']}
  830. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  831. </div>
  832. <span class="fal fa-angle-down"></span>
  833. </a>
  834. <ul class="dropdown-menu">
  835. {if $ditem["dropdown"][$ditem['Plan']]}
  836. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  837. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  838. <div class="pricing_wrapr">
  839. {$dropdownprice['billingcycle']}
  840. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  841. </div>
  842. </li>
  843. {/foreach}
  844. {/if}
  845. </ul>
  846. </div>
  847. {/if}
  848. {if $ditem["dropdown"][$ditem['Plan']]}
  849. <div class="product_pricing">
  850. {if $block.SbSwitcher}
  851. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  852. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  853. <div class="regular_pricing">
  854. {if $dropdownprice['hasconfigoptions']}
  855. <span class="small text-muted">{$WLANG.from}</span>
  856. {/if}
  857. {if $dropdownprice['save']}
  858. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  859. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  860. {/if}
  861. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  862. {/if}
  863. </div>
  864. {/if}
  865. <div class="price">
  866. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  867. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  868. </div>
  869. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  870. {if $dropdownprice['setup'] > 0}
  871. <div class="small text-muted">
  872. <span><i class="fal fa-plus"></i></span>
  873. <span>{$dropdownprice['prefix']}</span>
  874. {$dropdownprice['setup']}
  875. <span>{$dropdownprice['suffix']}</span>
  876. {$WLANG.ordersetupfee}
  877. </div>
  878. {/if}
  879. </div>
  880. {/if}
  881. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  882. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  883. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  884. <div class="regular_pricing">
  885. {if $dropdownprice['hasconfigoptions']}
  886. <span class="small text-muted">{$WLANG.from}</span>
  887. {/if}
  888. {if $dropdownprice['save']}
  889. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  890. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  891. {/if}
  892. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  893. {/if}
  894. </div>
  895. {/if}
  896. <div class="price">
  897. <span class="cost">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  898. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  899. </div>
  900. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  901. {if $dropdownprice['setup'] > 0}
  902. <div class="small text-muted">
  903. <span><i class="fal fa-plus"></i></span>
  904. <span>{$dropdownprice['prefix']}</span>
  905. {$dropdownprice['setup']}
  906. <span>{$dropdownprice['suffix']}</span>
  907. {$WLANG.ordersetupfee}
  908. </div>
  909. {/if}
  910. </div>
  911. {/foreach}
  912. </div>
  913. {/if}
  914. </div>
  915. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}{if $ditem["billingcycle"] != ""}&billingcycle={$defaultbilling}{/if}{/if}{/if}" class="btn btn-block btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  916. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  917. </a>
  918. {else}
  919. <div class="product_pricing_single d-flex flex-column justify-content-center h-100">
  920. {if $block.DisableBrekdown}
  921. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  922. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  923. {assign var="firstCycle" value=$dropdown|@end}
  924. {if $firstCycle.hasconfigoptions}
  925. <div class="regular_pricing">
  926. <span class="small text-muted">{$WLANG.from}</span>
  927. </div>
  928. {/if}
  929. <div class="price">
  930. <span class="cost">
  931. {$firstCycle.prefix}{$firstCycle.price}
  932. </span>
  933. <span class="suffix">
  934. {$firstCycle.suffix}
  935. </spn>
  936. </div>
  937. <div class="cycle small text-muted">
  938. {$firstCycle.cycle|capitalize}
  939. </div>
  940. {/foreach}
  941. {/if}
  942. {else}
  943. {if $ditem["price"] == 'FREE'}
  944. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  945. {else}
  946. {if $ditem["productdetails"]['hasconfigoptions']}
  947. <div class="regular_pricing">
  948. <span class="small text-muted">{$WLANG.from}</span>
  949. </div>
  950. {/if}
  951. <div class="price">
  952. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  953. <span class="cost">{$ditem["productdetails"]["price"]['simple']}</span>
  954. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  955. </div>
  956. {if $ditem["billingcycle"] != ""}
  957. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  958. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  959. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  960. {/if}
  961. {if $ditem["productdetails"]["price"]["setupFee"]}
  962. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  963. {/if}
  964. {/if}
  965. {/if}
  966. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}{if $ditem["billingcycle"] != ""}&billingcycle={$defaultbilling}{/if}{/if}{/if}" class="btn btn-block btn-primary mt-2{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  967. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  968. </a>
  969. </div>
  970. {/if}
  971. </div>
  972. </div>
  973. {if $ditem['Featured']}
  974. <div class="sticker-wrapper">
  975. <div class="sticker">
  976. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  977. </div>
  978. </div>
  979. {/if}
  980. </div>
  981. </div>
  982. {/foreach}
  983. {/if}
  984. </div>
  985. </div>
  986. </div>
  987. </div>
  988. </div>
  989. </div>
  990. </div>
  991. </div>
  992. <script>
  993. jQuery(document).ready(function () {
  994. var swiper = new Swiper('#plans-slider-{$blockkey}', {
  995. slidesPerView: 1,
  996. navigation: {
  997. nextEl: '.tables_{$blockkey}_next',
  998. prevEl: '.tables_{$blockkey}_prev',
  999. },
  1000. breakpoints: {
  1001. 0: {
  1002. slidesPerView: 1,
  1003. },
  1004. 768: {
  1005. slidesPerView: 2,
  1006. },
  1007. 992: {
  1008. slidesPerView: {if $block.itemcounts == "2"} 2{else} 3{/if},
  1009. },
  1010. 1200: {
  1011. slidesPerView: {if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if},
  1012. },
  1013. },
  1014. on: {
  1015. init: function (swiper) {
  1016. toggleSliderNav(swiper);
  1017. },
  1018. slideChange: function (swiper) {
  1019. toggleSliderNav(swiper);
  1020. },
  1021. reachEnd: function (swiper) {
  1022. toggleSliderNav(swiper);
  1023. },
  1024. reachBeginning: function (swiper) {
  1025. toggleSliderNav(swiper);
  1026. },
  1027. resize: function (swiper) {
  1028. toggleSliderNav(swiper);
  1029. }
  1030. }
  1031. });
  1032. function toggleSliderNav(swiper) {
  1033. var nav = document.querySelector('.tables_{$blockkey} .plans_slider__nav');
  1034. if (swiper.isBeginning && swiper.isEnd) {
  1035. nav.style.display = 'none';
  1036. } else {
  1037. nav.style.display = 'flex';
  1038. }
  1039. }
  1040. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1041. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  1042. var selText = jQuery(this).html();
  1043. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  1044. });
  1045. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  1046. var newCycle = jQuery(this).data('cycle');
  1047. var disBtnBilCycle = jQuery(this).data('cycle');
  1048. jQuery('.plan-{$blockkey} .pricing_main').hide();
  1049. jQuery('.plan-{$blockkey} .' + newCycle).show();
  1050. jQuery(this).addClass('active').siblings().removeClass('active');
  1051. jQuery('.plan-{$blockkey} .plan__body').each(function(index) {
  1052. var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey}').find('.btn-primary').attr('href');
  1053. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1054. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  1055. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  1056. jQuery(this).find('.btn-primary').attr('href',disBtnUrlFinal);
  1057. if (jQuery(this).find('.' + newCycle).length <= 0) {
  1058. jQuery(this).find('.pricing_main_default').show();
  1059. jQuery(this).find('.btn-primary').addClass('disabled');
  1060. } else {
  1061. jQuery(this).find('.pricing_main_default').hide();
  1062. jQuery(this).find('.btn-primary').removeClass('disabled');
  1063. }
  1064. });
  1065. });
  1066. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  1067. {else}
  1068. {if !$block.DisableSwitcher}
  1069. jQuery(".plan-{$blockkey} .dropdown-menu li").click(function(){
  1070. var selText = jQuery(this).html();
  1071. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  1072. });
  1073. jQuery('.plan-{$blockkey} .billinging_wrapr').click(function(){
  1074. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1075. var disBtnUrlFetch = jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href');
  1076. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1077. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv);
  1078. var disBtnUrlFinal = disBtnUrlFinal+'&billingcycle='+disBtnBilCycle;
  1079. jQuery(this).closest('.plan-{$blockkey} .plan__body').find('.btn-primary').attr('href',disBtnUrlFinal);
  1080. var crosPricingTable = jQuery(this).closest('.plan-{$blockkey} .plan__body');
  1081. crosPricingTable.find('.pricing_main').each(function() {
  1082. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1083. if (currentBilCycle === disBtnBilCycle) {
  1084. jQuery(this).removeClass('w-hidden');
  1085. } else {
  1086. jQuery(this).addClass('w-hidden');
  1087. }
  1088. });
  1089. });
  1090. {/if}
  1091. {/if}
  1092. });
  1093. </script>
  1094. {elseif $block.ptstyle == 'pts_3'}
  1095. <div id="sec-{$blockkey}" class="sec products{if $block.bgcolor != ""} {$block.bgcolor}{/if}{if $block.borders != ""} {$block.borders}{/if}{if $block.toppadding == "1"} inner-t-60{elseif $block.toppadding == "2"} inner-t-30{elseif $block.toppadding == "3"} no-padding-top{/if}{if $block.bottompadding == "1"} inner-b-60{elseif $block.bottompadding == "2"} inner-b-30{elseif $block.bottompadding == "3"} no-padding-bottom{/if}">
  1096. <div class="container">
  1097. {if $block.caption || $block.sectitle || $block.subtitle}
  1098. <div class="sec-description">
  1099. {if $block.caption}
  1100. <div class="sec-caption">
  1101. <span class="rounded">{$block.caption}</span>
  1102. </div>
  1103. {/if}
  1104. {if $block.sectitle}
  1105. <h2 class="sec-title">{$block.sectitle}</h2>
  1106. {/if}
  1107. {if $block.subtitle}
  1108. <div class="sec-subtitle">{$block.subtitle}</div>
  1109. {/if}
  1110. </div>
  1111. {/if}
  1112. <div class="cros-pricing-container">
  1113. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1114. {if $block.switcherCycles !== null && $block.switcherCycles|@count > 1}
  1115. {assign var="cycles" value=$block.switcherCycles}
  1116. {else}
  1117. {assign var="cycles" value=$allCycles}
  1118. {/if}
  1119. {if !$block.bsco}
  1120. {assign var="cycles" value=$cycles|@array_reverse}
  1121. {/if}
  1122. <div class="product-billing-switcher-{$blockkey}">
  1123. <div class="btn-group white border d-none d-sm-inline-block" role="group">
  1124. {foreach $cycles as $cycle}
  1125. <button type="button" class="btn cycle-change" data-cycle="{$cycle}">
  1126. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  1127. </button>
  1128. {/foreach}
  1129. </div>
  1130. <div class="btn-group white border d-inline-block d-sm-none">
  1131. <span class="px-3 py-1 small text-muted border-right">{$WLANG.orderbillingcycle}</span>
  1132. <button type="button" class="btn dropdown-toggle" data-toggle="dropdown">
  1133. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycles[0]}}</span>
  1134. </button>
  1135. <ul class="dropdown-menu">
  1136. {foreach $cycles as $cycle}
  1137. <li class="dropdown-item cycle-change" data-cycle="{$cycle}">
  1138. <span class="btn-text">{lang key={'pricingCycleLong.'|cat:$cycle}}</span>
  1139. </li>
  1140. {/foreach}
  1141. </ul>
  1142. </div>
  1143. </div>
  1144. {/if}
  1145. <div class="pricing_style_2">
  1146. <div class="swiper" id="pricing-tables-{$blockkey}">
  1147. <div class="row row-eq-height{if !$block.DisplayInGrid} flex-nowrap{/if} pricing-slider swiper-wrapper pricing-{$blockkey}">
  1148. {if count($block.table) > 0}
  1149. {foreach from=$block.table item=$ditem key=$kk}
  1150. <div class="col-12{if $block.itemcounts == "2"} col-md-6{elseif $block.itemcounts == "3"} col-md-6 col-lg-4 col-xl-4{elseif $block.itemcounts == "4"} col-md-6 col-lg-4 col-xl-3{/if} products-slide">
  1151. <div class="cros-pricing-table overflow-hidden mt-0 mb-4 border-0 p-0{if $block.ststyle} {$block.ststyle}{/if}{if $block.noshadow} no-shadow{/if}{if $block.tablebg == "light"} light{elseif $block.tablebg == "primary"} bg-primary{elseif $block.tablebg == "dark"} dark{else} white{/if}{if $ditem['Featured']} active{/if}">
  1152. {if $ditem['Graphic']}
  1153. <div class="graphics">
  1154. {if !$ditem['Graphic']|strstr:"fa-"}
  1155. <img src="{$WEB_ROOT}/{$ditem['Graphic']}" alt="{$ditem.title}" class="h-rounded img-fluid">
  1156. {/if}
  1157. <div class="d-flex flex-column p-3{if $block.centered} align-items-center{/if}">
  1158. <div class="h4 mb-2">{$ditem['productdetails']['name']}</div>
  1159. {if $ditem['Featured']}
  1160. {if $block.ststyle}
  1161. <div class="feature-sticker mb-2">
  1162. <span class="st-sm">
  1163. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  1164. </span>
  1165. </div>
  1166. {else}
  1167. <div class="sticker-wrapper">
  1168. <div class="sticker">
  1169. {if $block.featured}{$block.featured}{else}{$WLANG.featuredProduct}{/if}
  1170. </div>
  1171. </div>
  1172. {/if}
  1173. {/if}
  1174. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  1175. {if $block.bsco}
  1176. {foreach $ditem["dropdown"] as $dropdownkey=>$dropdownprice}
  1177. {$ditem["dropdown"][$dropdownkey] = $dropdownprice|@array_reverse}
  1178. {/foreach}
  1179. {/if}
  1180. {assign var="dropdownprice" value=$ditem["dropdown"][$ditem['Plan']][0] nocache}
  1181. {assign var="defaultbilling" value=$dropdownprice['cycle'] nocache}
  1182. {assign var="taxtype" value=$dropdownprice['taxtype'] nocache}
  1183. {assign var="hasconfigoptions" value=$dropdownprice['hasconfigoptions'] nocache}
  1184. <div class="billing-cycle-pricing mt-0 mb-2 float{if $block.descp == "below"} desc_belwo{/if}">
  1185. {if !$block.SbSwitcher}
  1186. <div class="btn-group dropup">
  1187. <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
  1188. <div class="pricing_wrapr">
  1189. {$dropdownprice['billingcycle']}
  1190. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  1191. </div>
  1192. <span class="fal fa-angle-down"></span>
  1193. </a>
  1194. <ul class="dropdown-menu">
  1195. {if $ditem["dropdown"][$ditem['Plan']]}
  1196. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  1197. <li class="billinging_wrapr" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  1198. <div class="pricing_wrapr">
  1199. {$dropdownprice['billingcycle']}
  1200. {* {if $dropdownprice['save']}<div class="save_text"><span class="badge badge-primary">{$dropdownprice['save']}</span></div>{/if} *}
  1201. </div>
  1202. </li>
  1203. {/foreach}
  1204. {/if}
  1205. </ul>
  1206. </div>
  1207. {/if}
  1208. </div>
  1209. {/if}
  1210. <div class="d-flex align-items-center mt-auto">
  1211. <div class="mr-auto">
  1212. {if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}
  1213. <div class="billing-cycle-pricing m-0 float{if $block.descp == "below"} desc_belwo{/if}">
  1214. {if $ditem["dropdown"][$ditem['Plan']]}
  1215. <div class="product_pricing">
  1216. {if $block.SbSwitcher}
  1217. <div class="pricing_main_default{if $defaultbilling eq "{$dropdownprice['cycle']}"} w-hidden{/if}">
  1218. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  1219. <div class="regular_pricing">
  1220. {if $dropdownprice['hasconfigoptions']}
  1221. <span class="small text-muted">{$WLANG.from}</span>
  1222. {/if}
  1223. {if $dropdownprice['save']}
  1224. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  1225. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  1226. {/if}
  1227. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1228. {/if}
  1229. </div>
  1230. {/if}
  1231. <div class="price">
  1232. <span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1233. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1234. </div>
  1235. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1236. {if $dropdownprice['setup'] > 0}
  1237. <div class="small text-muted">
  1238. <span><i class="fal fa-plus"></i></span>
  1239. <span>{$dropdownprice['prefix']}</span>
  1240. {$dropdownprice['setup']}
  1241. <span>{$dropdownprice['suffix']}</span>
  1242. {$WLANG.ordersetupfee}
  1243. </div>
  1244. {/if}
  1245. </div>
  1246. {/if}
  1247. {foreach $ditem["dropdown"][$ditem['Plan']] as $dropdownprice}
  1248. <div class="pricing_main {$dropdownprice['cycle']}{if $defaultbilling neq "{$dropdownprice['cycle']}"} w-hidden{/if}" data-ultn-bilcycle="{$dropdownprice['cycle']}">
  1249. {if $dropdownprice['hasconfigoptions'] || $dropdownprice['save']}
  1250. <div class="regular_pricing">
  1251. {if $dropdownprice['hasconfigoptions']}
  1252. <span class="small text-muted">{$WLANG.from}</span>
  1253. {/if}
  1254. {if $dropdownprice['save']}
  1255. {if $dropdownprice['dollar'] && !$block.DisableBrekdown}
  1256. <span class="savecut text-muted">{$dropdownprice['prefix']}{$dropdownprice['dollar']}.{$dropdownprice['cents']}{$dropdownprice['suffix']}</span>
  1257. {/if}
  1258. {if $block.SbSwitcher}<span class="badge badge-primary">{$dropdownprice['save']}</span>{/if}
  1259. {/if}
  1260. </div>
  1261. {/if}
  1262. <div class="price">
  1263. <span class="cost cost-small">{$dropdownprice['prefix']}{if $block.DisableBrekdown}{$dropdownprice['price']}{else}{$dropdownprice['monthlydollar']}.{$dropdownprice['monthlycents']}{/if}</span>
  1264. {if $dropdownprice['suffix']}<span class="suffix">{$dropdownprice['suffix']}</span>{/if}
  1265. </div>
  1266. <div class="cycle small text-muted">{if $block.DisableBrekdown}{$dropdownprice.cycle|capitalize}{else}{if $dropdownprice['monthlycycle']}{$dropdownprice['monthlycycle']}{else}{$dropdownprice['cycleTerm']}{/if}{/if}</div>
  1267. {if $dropdownprice['setup'] > 0}
  1268. <div class="small text-muted">
  1269. <span><i class="fal fa-plus"></i></span>
  1270. <span>{$dropdownprice['prefix']}</span>
  1271. {$dropdownprice['setup']}
  1272. <span>{$dropdownprice['suffix']}</span>
  1273. {$WLANG.ordersetupfee}
  1274. </div>
  1275. {/if}
  1276. </div>
  1277. {/foreach}
  1278. </div>
  1279. {/if}
  1280. </div>
  1281. {else}
  1282. <div class="product_pricing_single m-0">
  1283. {if $block.DisableBrekdown}
  1284. {if isset($ditem.dropdown) && is_array($ditem.dropdown)}
  1285. {foreach from=$ditem.dropdown item=$dropdown key=$dropdownKey}
  1286. {assign var="firstCycle" value=$dropdown|@end}
  1287. {if $firstCycle.hasconfigoptions}
  1288. <div class="regular_pricing">
  1289. <span class="small text-muted">{$WLANG.from}</span>
  1290. </div>
  1291. {/if}
  1292. <div class="price">
  1293. <span class="cost cost-small">
  1294. {$firstCycle.prefix}{$firstCycle.price}
  1295. </span>
  1296. <span class="suffix">
  1297. {$firstCycle.suffix}
  1298. </spn>
  1299. </div>
  1300. <div class="cycle small text-muted">
  1301. {$firstCycle.cycle|capitalize}
  1302. </div>
  1303. {/foreach}
  1304. {/if}
  1305. {else}
  1306. {if $ditem["price"] == 'FREE'}
  1307. <span class="badge badge-secondary price-free">{$WLANG.orderfree}</span>
  1308. {else}
  1309. {if $ditem["productdetails"]['hasconfigoptions']}
  1310. <div class="regular_pricing">
  1311. <span class="small text-muted">{$WLANG.from}</span>
  1312. </div>
  1313. {/if}
  1314. <div class="price">
  1315. {assign var="ccurrency" value=$ditem["productdetails"]["price"]["price"]->getCurrency()}
  1316. <span class="cost cost-small">{$ditem["productdetails"]["price"]['simple']}</span>
  1317. {if $ccurrency["suffix"]}<span class="suffix">{$ccurrency["suffix"]}</span>{/if}
  1318. </div>
  1319. {if $ditem["billingcycle"] != ""}
  1320. <div class="cycle small text-muted">{$ditem["billingcycle"]}</div>
  1321. {elseif $ditem["productdetails"]["price"]["cycle"] == "onetime"}
  1322. <div class="cycle small text-muted">{$WLANG.orderpaymenttermonetime}</div>
  1323. {/if}
  1324. {if $ditem["productdetails"]["price"]["setupFee"]}
  1325. <div class="setup-fee small text-muted"><span><i class="fal fa-plus"></i></span> {$ditem["productdetails"]["price"]["setupFee"]} {$WLANG.ordersetupfee}</div>
  1326. {/if}
  1327. {/if}
  1328. {/if}
  1329. </div>
  1330. {/if}
  1331. </div>
  1332. {if $ditem['ProductLink']}
  1333. <a href="{if $ditem['link'] == 'domainregister'}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&domain=register{elseif $ditem['link'] == 'domaintransfer'}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&domain=transfer{else}{$WEB_ROOT}/{$ditem['link']}{/if}" class="btn btn-sm w-auto mt-0 btn-primary">
  1334. {if $ditem['ProductbtnText']}{$ditem['ProductbtnText']}{else}{$WLANG.learnmore}{/if}
  1335. </a>
  1336. {else}
  1337. <a href="{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}javascript:void(0){else}{$WEB_ROOT}/{if $ditem["productdetails"]['isMarketConnect']}cart/order/{else}cart.php{/if}?a=add&pid={$ditem['Plan']}{if $ditem["dropdown"][$ditem['Plan']]|@count > "1" && !$block.DisableSwitcher}&billingcycle={$defaultbilling}{/if}{/if}" class="btn btn-sm w-auto mt-0 btn-order-link btn-primary{if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']} disabled{/if}">
  1338. {if $ditem['stockControlEnabled'] && !$ditem['quantityInStock']}{$WLANG.outofstock}{elseif $block.btntext}{$block.btntext}{else}{$WLANG.addtocart}{/if}
  1339. </a>
  1340. {/if}
  1341. </div>
  1342. </div>
  1343. </div>
  1344. {else}
  1345. <div class="d-flex align-items-center justify-content-center p-3 h-100">
  1346. <div class="alert alert-danger text-center">
  1347. Must required graphic for this type of product section.
  1348. </div>
  1349. </div>
  1350. {/if}
  1351. </div>
  1352. </div>
  1353. {/foreach}
  1354. {/if}
  1355. </div>
  1356. </div>
  1357. {if !$block.DisplayInGrid}
  1358. {if !$block.slidertype}
  1359. <div class="swiper-pagination pricing-tables_{$blockkey}"></div>
  1360. {else}
  1361. <div class="swiper-button-prev pricing-tables_{$blockkey}_prev">
  1362. <span class="btn_icon_large"><i class="far fa-long-arrow-left"></i></span>
  1363. </div>
  1364. <div class="swiper-button-next pricing-tables_{$blockkey}_next">
  1365. <span class="btn_icon_large"><i class="far fa-long-arrow-right"></i></span>
  1366. </div>
  1367. {/if}
  1368. {/if}
  1369. </div>
  1370. </div>
  1371. </div>
  1372. </div>
  1373. <script>
  1374. jQuery(document).ready(function () {
  1375. {if !$block.DisplayInGrid}
  1376. var swiper = new Swiper('#pricing-tables-{$blockkey}', {
  1377. slidesPerView: 1,
  1378. preventClicks: true,
  1379. slideClass: 'products-slide',
  1380. {if !$block.slidertype}
  1381. pagination: {
  1382. el: '.swiper-pagination.pricing-tables_{$blockkey}',
  1383. clickable: true,
  1384. },
  1385. {else}
  1386. navigation: {
  1387. nextEl: '.pricing-tables_{$blockkey}_next',
  1388. prevEl: '.pricing-tables_{$blockkey}_prev',
  1389. },
  1390. {/if}
  1391. breakpoints: {
  1392. 0: {
  1393. slidesPerView: 1
  1394. },
  1395. 768: {
  1396. slidesPerView: 2
  1397. },
  1398. 992: {
  1399. slidesPerView:{if $block.itemcounts == "2"} 2{else} 3{/if}
  1400. },
  1401. 1200: {
  1402. slidesPerView:{if $block.itemcounts == ""} 3{else} {$block.itemcounts}{/if}
  1403. },
  1404. }
  1405. });
  1406. {/if}
  1407. {if $block.SbSwitcher && !$block.DisableSwitcher}
  1408. jQuery("#sec-{$blockkey} .product-billing-switcher-{$blockkey} .dropdown-menu li").click(function(){
  1409. var selText = jQuery(this).html();
  1410. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText);
  1411. });
  1412. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').on('click', function() {
  1413. var newCycle = jQuery(this).data('cycle');
  1414. var disBtnBilCycle = jQuery(this).data('cycle');
  1415. jQuery('.pricing-{$blockkey} .product_pricing .pricing_main').hide();
  1416. jQuery('.pricing-{$blockkey} .' + newCycle).show();
  1417. jQuery(this).addClass('active').siblings().removeClass('active');
  1418. jQuery('.pricing-{$blockkey} .cros-pricing-table').each(function(index) {
  1419. var btnOrder = jQuery(this).find('.btn-order-link');
  1420. if (btnOrder.length) {
  1421. var disBtnUrlFetch = btnOrder.attr('href');
  1422. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1423. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
  1424. btnOrder.attr('href', disBtnUrlFinal);
  1425. }
  1426. if (jQuery(this).find('.' + newCycle).length <= 0) {
  1427. jQuery(this).find('.pricing_main_default').show();
  1428. btnOrder.addClass('disabled');
  1429. } else {
  1430. jQuery(this).find('.pricing_main_default').hide();
  1431. btnOrder.removeClass('disabled');
  1432. }
  1433. });
  1434. });
  1435. jQuery('#sec-{$blockkey} .product-billing-switcher-{$blockkey} .cycle-change').first().trigger('click');
  1436. {else}
  1437. {if !$block.DisableSwitcher}
  1438. jQuery(".pricing-{$blockkey} .dropdown-menu li").click(function(){
  1439. var selText = jQuery(this).html();
  1440. jQuery(this).parents('.btn-group').find('.dropdown-toggle').html(selText+' <span class="fal fa-angle-down"></span>');
  1441. });
  1442. jQuery('.pricing-{$blockkey} .billinging_wrapr').click(function(){
  1443. var disBtnBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1444. var btnOrder = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table').find('.btn-order-link');
  1445. if (btnOrder.length) {
  1446. var disBtnUrlFetch = btnOrder.attr('href');
  1447. var disBtnUrlRemv = disBtnUrlFetch.indexOf('&billingcycle');
  1448. var disBtnUrlFinal = disBtnUrlFetch.substring(0, disBtnUrlRemv) + '&billingcycle=' + disBtnBilCycle;
  1449. btnOrder.attr('href', disBtnUrlFinal);
  1450. }
  1451. var crosPricingTable = jQuery(this).closest('.pricing-{$blockkey} .cros-pricing-table');
  1452. crosPricingTable.find('.pricing_main').each(function() {
  1453. var currentBilCycle = jQuery(this).attr('data-ultn-bilcycle');
  1454. if (currentBilCycle === disBtnBilCycle) {
  1455. jQuery(this).removeClass('w-hidden');
  1456. } else {
  1457. jQuery(this).addClass('w-hidden');
  1458. }
  1459. });
  1460. });
  1461. {/if}
  1462. {/if}
  1463. });
  1464. </script>
  1465. {/if}
  1466. {/if}