products.tpl 76 KB

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