CINXE.COM
Harydy ga媒tarmak we 莽aly艧mak
<!DOCTYPE html> <html lang="tm"> <head> <title> Harydy ga媒tarmak we 莽aly艧mak </title> <meta name="base-url" content="https://elektronika.com.tm"> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="csrf-token" content="wMMowGkYQNWA2u1PyHfuHpRw9OmT4yWhnL6Jsw3y"> <meta http-equiv="content-language" content="tm"> <meta name="format-detection" content="telephone=no"> <link rel="icon" sizes="16x16" href="https://elektronika.com.tm/storage/channel/1/mqBSudN2L7qe5rcd8k3qq1vcYQKk1ippNY2B7Y6u.png" /> <meta name="title" content="Harydy ga媒tarmak we 莽aly艧mak" /> <meta name="description" content="Harytlary 莽aly艧mak we yzyna ga媒tarmak" /> <meta name="keywords" content="7 g眉n眉艌" /> <link rel="stylesheet" href="https://elektronika.com.tm/themes/elektronika/assets/styles/style.css" /> <link rel="stylesheet" href="https://elektronika.com.tm/themes/elektronika/assets/styles/delivery-desc.css" /> <style> </style> </head> <body style="scroll-behavior: smooth;"> <nav class="header"> <div class="container header-inner no-mobile"> <div class="header-left-side"> <div class="clock-wrapper"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/clock.svg" alt="clock" /> </div> <div class="head-left-text-wrapper"> <span class="head-left-text">Du艧enbe - Anna: 09:00 - 18:00</span><span class="head-left-text-further">艦enbe: 09:00 - 13:00</span> </div> </div> <div class="header-right-side"> <div class="phone-wrapper"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/telephone.svg" alt="telephone" /> </div> <div class="head-right-text-wrapper"> <span class="head-right-text head-left-text">+993 60 14 22 51; +993 62 56 01 31</span> </div> <div class="language-select"> <div class="flag-wrapper"> <img src="https://elektronika.com.tm/storage/settings/locale-images/2/odryLmOMUpd73KsGAjw8r6fJ14Ri67P1nJCYdah0.png" alt="" width="30" height="20" /> </div> <div class="language-wrapper"> <span class="language">T眉rkmen莽e</span> <ul class="language-list hidden" id="locale-switcher" onchange="window.location.href = this.value"> <li class="language-el" selected><a href="?locale=tm">T眉rkmen莽e</a></li> <li class="language-el" ><a href="?locale=ru">袪褍褋褋泻懈泄</a></li> </ul> </div> </div> </div> </div> </nav> <div id="app"> <flash-wrapper ref='flashes' cancel-btn-img="https://elektronika.com.tm/themes/elektronika/assets/icons/cancel.svg"></flash-wrapper> <my-mobile-nav></my-mobile-nav> <my-nav></my-nav> <!-- BREADCRUMB ======================================================================== --> <section class="breadcrumb"> <div class="container breadcrumb-container"> <ul class="breadcrumb"> <li><a href="/">Ba艧 sahypa</a></li> <li><a href="#" class="current">Harydy ga媒tarmak we 莽aly艧mak</a></li> </ul> </div> </section> <!-- BREADCRUMB end ==================================================================== --> <section class="delivery-desc"> <div class="container delivery-desc-inner"> <div class="item-section-title"> <h2 class="item-section-title-text">Harydy ga媒tarmak we 莽aly艧mak</h2> </div> <div class="horizontal"></div> <div class="description-top"> <p class="MsoNormal"><strong></strong>Tölege çenli harydy gaýtaryp bermek:<o:p></o:p></p> <p class="MsoNormal">Mü艧deri satyn almak kararyna gelýänçä sargyt eden harytlaryny艌 ählisini ýada bir bölegini olary艌 umumy bahasyny艌 we eltip berme hyzmatyny艌 tölegini etmezden ö艌 ret edip/yzyna gaýtaryp biler.<o:p></o:p></p> <p class="MsoNormal">Tölegden so艌 harydy yzyna gaýtarmak 艧ertleri:<o:p></o:p></p> <p class="MsoNormal">Mü艧deri töleg edeninden so艌ra<span style="mso-spacerun: yes;"> </span>harydy yzyna gaýtaryp biler, eger-de haryt hilinde kemçilik bar bolsa, has takyky önüm kemçiligi ýa-da harydy艌 ýetmezçiligi bar bolsa (ýetmezçilik – haryda bolan hökmany talaplaryny艌 bozulmasy)<o:p></o:p></p> <p class="MsoNormal">Görkezilen haryt gabat gelmeýän bolsa onda Mü艧deri harydy 7 günü艌 dowamynda yzyna gaýtaryp biler.<o:p></o:p></p> <p class="MsoNormal">Hili gowy harydy艌 yzyna gaýtarylmagy di艌e a艧akda görkezilen ýagdaýlarda amala a艧yrylýar:<o:p></o:p></p> <p class="MsoNormal">Ulanylmadyk ýagdaýda<o:p></o:p></p> <p class="MsoNormal">Haryt görnü艧i çyky艧 ýagdaýynda bolsa<o:p></o:p></p> <p class="MsoNormal">Sarp edijilik alamatlaryny saklan bolsa<o:p></o:p></p> <p class="MsoNormal">Haryt yzyna gaýtarylanda toplumdaky ähli zatlary, ähli gaplamalary we etiketkalary ýerbe-ýer bolmaly we täze/ulanylmadyk görnü艧de bolmaly.</p> </div> </div> </section> <footer class="footer"> <div class="container footer-inner"> <div class="assist-block footer-block"> <div class="footer-title-wrapper active"> <h2 class="footer-title">Tiz k枚mek</h2> <div class="footer-title-arrow"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/arrow-downside.svg" alt="arrow"> </div> </div> <div class="hr-lines"> <div class="bright-line"></div> <div class="dim-line"></div> </div> <div class="assist-block-content footer-content visible"> <ul class="footer-links-list"> <li class="footer-list-el"><a href="https://elektronika.tm/page/komek">Nädip hasaba alynmaly</a></li> <li class="footer-list-el"><a href="#">Nädip sargyt etmeli</a></li> <li class="footer-list-el"><a href="https://elektronika.tm/page/eltip-berme-hyzmaty-barada">Eltip berme</a></li> <li class="footer-list-el"><a href="https://elektronika.tm/page/harydy-gaytarmak-we-calyshmak">Çaly艧mak we gaýtarmak</a></li> <li class="footer-list-el"><a href="https://elektronika.tm/page/hyzmatlar-merkezi">Hyzmat merkezi</a></li> </ul> </div> </div> <div class="contacts-block footer-block"> <div class="footer-title-wrapper"> <h2 class="footer-title">Habarla艧mak 眉莽in</h2> <div class="footer-title-arrow"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/arrow-downside.svg" alt="arrow"> </div> </div> <div class="hr-lines"> <div class="bright-line"></div> <div class="dim-line"></div> </div> <div class="contacts-block-content footer-content"> <div class="contacts-block-address"> <span class="contacts-block-dim-text">Adres :</span> <p class="contacts-block-bright-text">A艧gabat, Bitarap T眉rkmenistan 艧a媒oly 183</p> </div> <div class="contacts-block-address"> <span class="contacts-block-dim-text phone-number">Telefon :</span> <p class="contacts-block-bright-text">+993 60 14 22 51; +993 62 56 01 31</p> </div> <div class="contacts-block-number"> <span class="contacts-block-dim-text">Email : </span> <a href="mailto: contact1@tehnikadunyasi.com" class="contacts-block-bright-text" data-address="operator#tehnikadunyasi.com">contact1@tehnikadunyasi.com</a> </div> </div> </div> <div class="soon-block footer-block"> <div class="footer-title-wrapper"> <h2 class="footer-title">Mobil go艧undylar</h2> <div class="footer-title-arrow"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/arrow-downside.svg" alt="arrow"> </div> </div> <div class="hr-lines"> <div class="bright-line"></div> <div class="dim-line"></div> </div> <div class="soon-block-content footer-content"> <div class="soon-download"> <div class="download-icon"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/apple.svg" alt="appstore"> </div> <div class="download-text"> <span class="download-text-dim">Download on the</span> <a href="https://apps.apple.com/us/app/elektronika/id1632194687?l=ru" class="download-text-bright">App Store</a> </div> </div> <div class="soon-download"> <div class="download-icon"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/google-play.svg" alt="googleplay"> </div> <div class="download-text"> <span class="download-text-dim">Download on the</span> <a class="download-text-bright" href="https://play.google.com/store/apps/details?id=com.elektronika.tm">Google Play</a> </div> </div> </div> </div> <div class="social-block footer-block"> <div class="footer-title-wrapper"> <h2 class="footer-title">Sos. ulgamda</h2> <div class="footer-title-arrow"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/arrow-downside.svg" alt="arrow"> </div> </div> <div class="hr-lines"> <div class="bright-line"></div> <div class="dim-line"></div> </div> <div class="social-block-content footer-content"> <div class="social-block-content-wrapper"> <a href="https://www.facebook.com/profile.php?id=100088671716200&mibextid=b06tZ0" class="social-facebook social-icon"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/facebook.svg" alt="facebook"> </a> <a href="#" class="social-twitter social-icon"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/twitter.svg" alt="twitter"> </a> <a href="https://instagram.com/elektronika.tm?igshid=MzRlODBiNWFlZA==" class="social-instagram social-icon"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/instagram.svg" alt="instagram"> </a> <a href="#" class="social-google social-icon"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/google-plus.svg" alt="google-plus"> </a> </div> </div> </div> </div> <div class="hr-line"></div> <div class="footer-bottom container footer-bottom-inner"> <span class="footer-bottom-text"> 漏 脛hli hukuklary goralan. D枚rediji <a href=#>TPS Digital</a> </span> </div> </footer> <overlay-loader :is-open="show_loader"></overlay-loader> <go-top bg-color="#c5000e"></go-top> <section class="sign-up"> <div class="sign-up-container"> <div class="sign-up-wrapper"> <login-form-component></login-form-component> <signup-form-component></signup-form-component> <recovery-form-component></recovery-form-component> </div> </div> </section> </div> <script type="text/javascript"> window.flashMessages = []; window.serverErrors = []; </script> <script type="text/javascript" src="https://elektronika.com.tm/themes/elektronika/assets/scripts/shop.js" ></script> <script type="text/x-template" id="my-mobile-nav-template"> <nav class="nav-block container"> <div class="burger-mobile" @click.capture="closeMobileMenu($event)"> <div class="burger-mobile-inner"> <ul class="burger-list"> <!---------------------------------TODO MOBILE CATEGORIES----------------------------------------------> <li> <div class="burger-item-title active"> <span class="burger-item-name">Kategori媒alar</span> <div class="arrow black"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/burger-arrow-black.svg" alt="burger arrow black" /> </div> <div class="arrow white"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/burger-arrow-white.svg" alt="burger arrow white"> </div> </div> <div class="burger-dropdown"> <ul class="burger-list-inner"> <!-- Loop root categories --> <li v-for="(category, indexRoot) in categories"> <div class="burger-item-title-inner"> <a :href="'/' + category.url_path" class="burger-item-name">{{ category.name }}</a> <div class="arrow black" @click.capture="toggleRootCategories(indexRoot)"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/burger-arrow-black.svg" alt=""> </div> </div> <div class="burger-dropdown-inner"> <ul class="burger-list-inner-inner"> <!-- Loop child categories --> <li v-for="(child_category, indexChild) in category.children"> <div class="burger-item-title-inner-inner biti" :id="'item-title-root-' + indexRoot + '-child-' + indexChild" > <a :href="'/' + child_category.url_path" class="burger-item-name child-category">{{ child_category.name }}</a> <div class="arrow black" @click.capture="toggleChildCategories(indexRoot, indexChild)"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/burger-arrow-black.svg" alt=""> </div> </div> <div class="burger-dropdown-inner3" :id="'item-drop-root-' + indexRoot + '-child-' + indexChild" > <ul class="burger-list-inner-inner"> <!-- Loop grandchild categories --> <li v-for="grand_child_category in child_category.children"> <a :href="'/' + grand_child_category.url_path">{{grand_child_category.name}}</a> </li> <!-- Loop grandchild categories end --> </ul> </div> </li> <!-- Loop child categories end --> </ul> </div> </li> <!-- Loop root categories end --> </ul> </div> </li> <!-----------------------------------------------------------------------------------------------------> <li class="burger-item-title-inactive"> <a href="https://elektronika.com.tm/page/hyzmatlar-merkezi" class="burger-item-name">Hyzmat</a> </li> <li class="burger-item-title-inactive"> <a href="https://elektronika.com.tm/page/eltip-berme-hyzmaty-barada" class="burger-item-name">Eltip berme</a> </li> <li class="burger-item-title-inactive"> <a href="https://elektronika.com.tm/page/harydy-gaytarmak-we-calyshmak" class="burger-item-name">脟aly艧mak we ga媒tarmak</a> </li> <li class="burger-item-title-inactive"> <a href="https://elektronika.com.tm/page/komek" class="burger-item-name">K枚mek</a> </li> <li> <div class="burger-item-title-inactive" @click.prevent="loginModal"> <span class="burger-item-name" > <span>Giri艧</span> <div class="enter"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/enter.svg" alt="enter"> </div> </span> </div> </li> </ul> </div> </div> <div class="nav-inner no-mobile"> <div class="logo-wrapper"> <a href="https://elektronika.com.tm"> <img class="logo" src="https://elektronika.com.tm/storage/channel/1/mLXNGfzZy5Taacto7NAe5iX5hqOqEKtAvJAHc5bl.png" alt="ElektronikaTM" /> </a> </div> <div class="search-bar"> <form role="search" action="https://elektronika.com.tm/search" method="GET"> <input required name="term" type="search" value="" class="search-field" id="search-bar" placeholder="Harytlary 艧u 媒erde g枚zl盲艌"/> <button type="submit" class="search-button"> <div class="button-content"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/search.svg" alt="Search" /> </div> </button> </form> </div> <div class="nav-buttons"> <div class="login logged-false logged"> <a href="#" class="nav-link"> <div class="icon-wrapper"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/signin.svg" alt="login" /> </div> <span>Giri艧</span> </a> </div> <div class="cart"> <a href="https://elektronika.com.tm/checkout/cart" class="nav-link"> <div class="icon-wrapper"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/icon (cart).svg" alt="cart" /> </div> <span>Sebet <span class="count-cart-item"><span></span> </a> </div> </div> </div> <div class="nav-inner-mobile no-desktop"> <div class="nav-inner-top"> <div class="logo-wrapper-mobile"> <a href="https://elektronika.com.tm"> <img src="https://elektronika.com.tm/storage/channel/1/mLXNGfzZy5Taacto7NAe5iX5hqOqEKtAvJAHc5bl.png" alt="ElektronikaTM" /> </a> </div> <div class="nav-top-right"> <div clas="nav-inner-top-lang lang-active" id="language-dropdown"> <div class="burger-item-title lang-dropdown-title"> <div class="burger-item-name lang"> <div class="burger-lang"> <img src="https://elektronika.com.tm/storage/settings/locale-images/2/odryLmOMUpd73KsGAjw8r6fJ14Ri67P1nJCYdah0.png" alt=""> </div> </div> <div class="arrow black"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/burger-arrow-black.svg" alt="burger arrow black"> </div> <div class="arrow white"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/burger-arrow-white.svg" alt="burger arrow white"> </div> </div> <div class="language-dropdown" id="language-dropdown-content" onchange="window.location.href = this.value"> <a class=" active-lang burger-item-name lang lang-second" href="?locale=tm" > <div class="burger-lang"> <img src="https://elektronika.com.tm/storage/settings/locale-images/2/odryLmOMUpd73KsGAjw8r6fJ14Ri67P1nJCYdah0.png" alt=""> </div> </a> <a class=" burger-item-name lang lang-second" href="?locale=ru" > <div class="burger-lang"> <img src="https://elektronika.com.tm/storage/settings/locale-images/3/wpHEMIlFonGbf96FGev4qanPxQhzk5Hl3IUMD6og.png" alt=""> </div> </a> </div> </div> <a href="https://elektronika.com.tm/checkout/cart" class="nav-link"> <div class="icon-wrapper"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/cart.svg" alt="cart" /> <span class="cart-quantity"></span> </div> </a> </div> </div> <div class="nav-inner-bottom"> <div class="burger" @click.capture="getCategories" style="position:relative;"> <div class="burger-lines"> <span class="line line-1"></span> <span class="line line-2"></span> <span class="line line-3"></span> </div> <!-- Spinner --> <div v-if="loading" class="lds-ring"><div></div><div></div><div></div><div></div></div> <!-- Spinner end --> </div> <div class="search-bar"> <form role="search" action="https://elektronika.com.tm/search" method="GET"> <input required name="term" type="search" value="" class="search-field" id="search-bar2" placeholder="Harytlary 艧u 媒erde g枚zl盲艌" /> <button type="submit" class="search-button"> <div class="button-content"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/search.svg" alt="Search" /> </div> </button> </form> </div> </div> </div> </nav> </script> <script> Vue.component('my-mobile-nav', { template: '#my-mobile-nav-template', data () { return { categories: [], loading: false, burger: undefined, burgerItemInner: undefined, burgerDropInner: undefined, } }, methods: { getCategories() { if(!this.categories.length) { // if we have not fetched categories yet this.setLoading(true) fetch("https://elektronika.com.tm/api/descendant-categories?parent_id=1&locale=tm ") .then(res => res.json()) .then(res => { this.categories = res.data }) .then(() => { // when all categories are fetched, set listeners to DOM elements this.setListenersToDomElements() // find and assign DOM elements this.assignDomElements() this.toggleCategoriesDomElements() this.setLoading(false) }) .catch(err => { alert(err) this.categories = [] this.setLoading(false) this.burger = undefined this.burgerItemInner = undefined this.burgerDropInner = undefined }) } else { // if we have already fetched categories this.toggleCategoriesDomElements() } }, closeMobileMenu(e) { const burgerInner = this.s('.burger-mobile-inner'); if (e.target.contains(burgerInner)) this.burger.classList.remove('active'); document.body.style.overflow = 'visible'; }, toggleRootCategories(index) { this.burgerItemInner[index].classList.toggle('active'); this.burgerDropInner[index].classList.toggle('active'); }, toggleChildCategories(indexRoot, indexChild) { const burgerInner2 = document.getElementById('item-title-root-' + indexRoot + '-child-' + indexChild); const burgerDropInner3 = document.getElementById('item-drop-root-' + indexRoot + '-child-' + indexChild); burgerInner2.classList.toggle('active'); burgerDropInner3.classList.toggle('active'); }, /** * Set loading config while categories are fetched */ setLoading(loading) { this.loading = loading document.querySelector('.burger-lines').style.opacity = loading ? 0 : 1 }, /** * Quering DOM elements after categories are fetched * Called one time * when categories are fetched - in `promise` */ setListenersToDomElements() { const burgerItem = this.sAll('.burger-item-title'); const burgerDrop = this.sAll('.burger-dropdown'); burgerItem.forEach((el, i) => el.addEventListener('click', () => { burgerItem[i].classList.toggle('active'); burgerDrop[i].classList.toggle('active'); }) ); }, assignDomElements() { this.burger = this.s('.burger-mobile'); this.burgerItemInner = this.sAll('.burger-item-title-inner'); this.burgerDropInner = this.sAll('.burger-dropdown-inner'); }, // query selector s(identifier) { return document.querySelector(identifier); }, // query selector all sAll(identifier) { return document.querySelectorAll(identifier); }, /** * Can be called two times * - when categories are fecthed in `promise` * - when categories have already been fecthed in `else` section */ toggleCategoriesDomElements() { this.burger.classList.toggle('active'); if (this.burger.classList.contains('active')) document.body.style.overflow = 'hidden'; else document.body.style.overflow = 'visible'; }, loginModal() { this.burger.classList.remove('active'); document.querySelector('.registration-form').style.display = 'none'; document.querySelector('.password-recovery-nr').style.display = 'none'; document.querySelector('.password-recovery-sms').style.display = 'none'; document.querySelector('.sign-up').style.display = 'block'; // document.querySelector('.login-form.confirm').style.display = 'none'; document.body.style.overflowY = 'hidden'; } } }) </script> <script type="text/x-template" id="my-nav-template"> <nav class="no-mobile container" id="menu"> <ul class="link-list"> <!-- Categories expand --> <li class="service-li active skewed edited" @click.prevent="getCategories"> <a href="#" class="categories"> <div class="burger"> <span class="line line-1"></span> <span class="line line-2"></span> <span class="line line-3"></span> </div> <span class="link-text white-text">Kategori媒alar</span> </a> <!-- Spinner --> <div v-if="loading" class="lds-ring"><div></div><div></div><div></div><div></div></div> <!-- Spinner end --> </li> <!-- Categories expand end --> <li class="service-li skewed"> <a href="https://elektronika.com.tm/page/eltip-berme-hyzmaty-barada"> <span class="link-text">Eltip berme</span> </a> </li> <li class="service-li skewed"> <a href="https://elektronika.com.tm/page/hyzmatlar-merkezi"> <span class="link-text">Hyzmat</span> </a> </li> <li class="service-li skewed"> <a href="https://elektronika.com.tm/page/harydy-gaytarmak-we-calyshmak"> <span class="link-text">脟aly艧mak we ga媒tarmak</span> </a> </li> <li class="service-li skewed"> <a href="https://elektronika.com.tm/page/ordering"> <span class="link-text displaced-text">N盲dip sargyt etmeli</span> </a> </li> <li> <div class="cat-dropdown"> <div class="cat-dropdown-inner"> <ul> <!-- Loop root categories --> <li class="cat-li" v-for="category in categories" @click.capture="expandChildCategories($event)"><span>{{ category.name }}</span> <div class="cat-arrow"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/arrow-dropdown.svg" alt="arrow"> </div> </li> <!-- Loop root categories end --> </ul> </div> </div> <!-- Loop root categories --> <div class="cat-data-block cat-data" v-for="category in categories" :data-img="category.image_url"> <!-- Loop children categories --> <ul v-for="child_category in category.children"> <li><a :href="'/' + child_category.url_path" class="data-title">{{ child_category.name }}</a></li> <!-- Loop grandchildren categories --> <li v-for="grand_child_category in child_category.children"> <a :href="'/' + grand_child_category.url_path" class="data-text">{{grand_child_category.name}}</a> </li> <!-- Loop grandchildren categories end --> </ul> <!-- Loop children categories end --> </div> <!-- Loop root categories end --> </li> </ul> </nav> </script> <script> Vue.component('my-nav', { template: '#my-nav-template', props: { }, data () { return { categories: [], checker: true, // from app.js last: undefined, // from app.js // Frontend Dom Elements catBlock: undefined, // from app.js lis: undefined, // from app.js cat: undefined, // from app.js loading: false, } }, methods: { getCategories() { if(!this.categories.length) { // if we have not fetched categories yet this.setLoading(true) fetch("https://elektronika.com.tm/api/descendant-categories?parent_id=1&locale=tm ") .then(res => res.json()) .then(res => { this.categories = res.data }) .then(() => { // when all categories are fetched, query DOM elements this.queryDomElements() // when all categories are fetched, numerator set data attrs this.numerator('cat-li') this.numerator('cat-bg') this.numerator('cat-data-block') // todo: Toggle categories DOM elements this.toggleCategoriesDomElements() // set bg to category blocks this.setBgToCategoryBlocks() this.setLoading(false) }) .catch(err => { alert(err) this.categories = [] this.checker = true this.last = undefined // Set empty DOM elements this.catBlock = undefined this.lis = undefined this.cat = undefined this.setLoading(false) }) } else { // if we have already fetched categories // todo: Toggle categories DOM elements this.toggleCategoriesDomElements() } }, /** * Quering DOM elements after categories are fetched * Called one time * when categories are fetched - in `promise` */ queryDomElements() { this.catBlock = document.querySelectorAll('.cat-data-block'); this.lis = document.querySelectorAll('.cat-li'); this.cat = document.querySelector('.cat-dropdown'); }, /** * Can be called two times * when categories are fecthed in `promise` * when categories have already been fecthed in `else` section */ toggleCategoriesDomElements() { this.cat.classList.toggle('active'); if (this.checker) { this.catBlock[0].classList.toggle('active'); this.lis[0].classList.toggle('active'); this.checker = false; } else { if (this.last) { this.catBlock[this.last].classList.toggle('active'); this.lis[this.last].classList.toggle('active'); } else { this.catBlock[0].classList.toggle('active'); this.lis[0].classList.toggle('active'); } } }, /** * Set bg to category blocks * Call one time * when categories are fetched - in `promise` */ setBgToCategoryBlocks() { this.catBlock.forEach((el) => { const imgPath = el.getAttribute('data-img'); el.style.background = `linear-gradient( to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.4) ), url(${imgPath}), center, no-repeat`; el.style.backgroundSize = 'cover'; }); }, /** * Call one time * when categories are fetched - in `promise` */ numerator(className) { const items = document.querySelectorAll(`.${className}`); items.forEach((el, i) => { el.classList.add(`${className}-${i + 1}`); el.setAttribute('data-index', i + 1); }); }, /** * Show child categories */ expandChildCategories(e) { let el = e.target.tagName == 'LI' ? e.target : e.target.parentNode this.last = el.getAttribute('data-index') - 1 this.catBlock.forEach((el) => { el.classList.remove('active'); }) this.catBlock[this.last].classList.add('active') this.lis.forEach((el) => { el.classList.remove('active'); }); el.classList.add('active'); }, /** * Set loading config while categories are fetched */ setLoading(loading) { this.loading = loading document.querySelector('a.categories').style.opacity = loading ? 0 : 1 }, handleClickOutside(event) { if (!this.$el.contains(event.target) && this.cat?.classList?.contains("active")) { this.toggleCategoriesDomElements(); } } }, mounted() { document.addEventListener('click', this.handleClickOutside); }, beforeDestroy() { document.removeEventListener('click', this.handleClickOutside); }, }) </script> <script type="text/javascript"> const handleMailTo = (address) => { address.replace('#', '@'); window.open(`mailto:${address}`, '_blank'); }; const mailSrc = document.querySelector( '.contacts-block-number a.contacts-block-bright-text' ); mailSrc.addEventListener( 'click', ()=> handleMailTo(mailSrc.getAttribute('data-address')) ); </script> <script type="text/javascript" defer src="https://elektronika.com.tm/themes/elektronika/assets/scripts/auth.js"></script> <script type="text/x-template" id="login-form-component-template"> <div class="login-form"> <div class="sign-up-title"> <span>Giri艧</span> <div class="sign-up-exit-img" @click="close()"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/cancel.svg" alt="exit"> </div> </div> <form class="sign-up-content" @submit.prevent="validateLoginForm('login')" data-vv-scope="login" autocomplete="on"> <span class="control-error" v-if="errors.has('login.login')">{{ errors.first('login.login') }}</span> <div class="sign-up-input"> <span>Telefon</span> <div class="dif-input"> <span class="pointer-ev-none">+993</span> <input class="abs-input" type="text" v-model="phone" name="phone" v-validate="'required|numeric|digits:8'" autocomplete="on" data-vv-as=""Telefon"" value=""> <span class="control-error" v-if="errors.has('login.phone')">{{ errors.first('login.phone') }}</span> </div> </div> <div class="sign-up-input"> <span>A莽ar s枚zi</span> <div class="dif-input"> <input type="password" name="password" v-validate="'required|min:6'" v-model="password" autocomplete="off" data-vv-as=""A莽ar s枚zi""> <span class="control-error" v-if="errors.has('login.password')">{{ errors.first('login.password') }}</span> </div> </div> <span class="forgot-pass" @click="forgotPassword()">A莽ar s枚zi unutdym</span> <button type="submit" class="log-in" :disabled="disable_button">Girmek</button> <div class="sign-up-footer"> <span>Hasaby艌yz 媒ok bolsa</span> <a href="#" class="sign-up-btn" @click="signup()">agza bolu艌</a> </div> </form> </div> </script> <script> Vue.component('login-form-component', { template: '#login-form-component-template', inject: ['$validator'], data: function() { return { phone: '', password: "", error_message: '', disable_button: false } }, watch: { phone: function (value) { if (value != '') { this.error_message = ''; } } }, methods: { validateLoginForm(scope){ let self = this; self.error_message = null; self.disable_button = true; this.$validator.validateAll(scope).then(result => { if (result) { axios.post('https://elektronika.com.tm/customer/login', {phone: self.phone,password:self.password}) .then(function(response) { // console.log(response.data); if (response.data.success) { if(response.data.message){ window.flashMessages = [{'type': 'alert-success', 'message': response.data.message}]; self.$root.addFlashMessages(); } window.location.href = response.data.redirect; } else { self.error_message = response.data.message; } self.disable_button = false; }) .catch(function(error) { self.error_message = error.response.data.message; self.disable_button = false; let errorFields = Object.keys(error.response.data.errors); errorFields.map(field => { let errorString = error.response.data.errors[field].join(', '); self.$validator.errors.add({ field:field, msg: errorString, scope:scope }); }); }); } else { self.disable_button = false; eventBus.$emit('onFormError') } }); }, forgotPassword(){ let loginForm = document.querySelector('.login-form'); let resetForm = document.querySelector('.reset-password'); loginForm.style.display = 'none'; resetForm.style.display = 'block'; }, signup(){ let loginForm = document.querySelector('.login-form'); let signupForm = document.querySelector('.signup-form'); loginForm.style.display = 'none'; signupForm.style.display = 'block'; }, close(){ let loginForm = document.querySelector('.login-form'); loginForm.style.display = 'none'; } } }); </script> <script type="text/x-template" id="signup-form-template"> <div class="signup-form"> <div v-if="registration" class="login-form registration-form"> <div class="sign-up-title"> <p>Agza bolu艌</p> <div class="sign-up-exit-img"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/cancel.svg" alt="exit"> </div> </div> <form class="sign-up-content" method="post" @submit.prevent="validateLSignupForm('register')" data-vv-scope="register" autocomplete="on"> <span class="control-error" v-if="errors.has('register.register')">{{ errors.first('register.register') }}</span> <h1 class="control-error" v-if="message">{{ message }}</h1> <div class="sign-up-input"> <span>Ady</span> <div class="dif-input"> <input type="text" name="first_name" v-model="first_name" v-validate="'required|alpha|min:3'" autocomplete="on" data-vv-as=""Ady""> <span class="control-error" v-if="errors.has('register.first_name')">{{ errors.first('register.first_name') }}</span> </div> </div> <div class="sign-up-input"> <span>Telefon</span> <div class="dif-input"> <span class="pointer-ev-none">+993</span> <input class="abs-input" type="text" name="phone" v-model="phone" v-validate="'required|numeric|digits:8'" autocomplete="on" data-vv-as=""Telefon"" > <span class="control-error" v-if="errors.has('register.phone')">{{ errors.first('register.phone') }}</span> </div> </div> <div class="sign-up-input"> <span>Email</span> <div class="dif-input"> <input type="email" name="email" v-model="email"> </div> </div> <div class="sign-up-input"> <span>A莽ar s枚zi</span> <div class="dif-input"> <input type="password" name="password" v-model="password" v-validate="'required|min:6'" ref="password" autocomplete="off" data-vv-as=""A莽ar s枚zi""> <span class="control-error" v-if="errors.has('register.password')">{{ errors.first('register.password') }}</span> </div> </div> <div class="agree"> <div class="agree-input"> <input id="agree" type="checkbox" name="agree" v-model="agree" v-validate="'required'" autocomplete="off" data-vv-as=""Razy""> <label for="agree" style="margin: 0 0 0 15px">Bildiri艧leri almaga razymy ?</label> </div> <div class="agree-error" style="display: flex;justify-content: center;"> <span class="control-error" v-if="errors.has('register.agree')" style="">{{ errors.first('register.agree') }}</span> </div> </div> <button type="submit" class="log-in" :disabled="disable_button" >Registrasi媒a</button> <div class="sign-up-footer"> <span>Sizi艌 枚艌den hasaby艌yz bar! </span> <span class="sign-up-btn sign-up-btn-return">Ulgama girmek</span> </div> </form> </div> </div> </script> <script> Vue.component('signup-form-component', { template: '#signup-form-template', inject: ['$validator'], data: function() { return { phone: '', password: "", first_name: '', email: '', agree: '', message: null, disable_button: false, registration: true, code:'' } }, methods: { validateLSignupForm(scope){ let self = this; self.message = null; self.disable_button = true; this.$validator.validateAll(scope).then(result => { if (result) { axios.post('https://elektronika.com.tm/customer/register', { phone: self.phone, email: self.email, password:self.password, first_name:self.first_name }) .then(function(response) { // console.log(response.data); self.message = response.data.message; if (response.data.success) { window.flashMessages = [{'type': 'alert-success', 'message': response.data.message}]; self.$root.addFlashMessages(); // window.location.href = response.data.redirect; setTimeout(function() { // let regForm = document.querySelector('.registration-form'); let loginForm = document.querySelector('.login-form'); console.log(loginForm); // regForm.style.display = 'none'; loginForm.style.display = 'block'; }, 1500); self.registration = false; } self.disable_button = false; }) .catch(function(error) { self.error_message = error.response.data.message; // self.$setErrorsFromResponse(error.response.data); self.disable_button = false; let errorFields = Object.keys(error.response.data.errors); errorFields.map(field => { let errorString = error.response.data.errors[field].join(', '); self.$validator.errors.add({ field:field, msg: errorString, scope:scope }); }); }); } else { self.disable_button = false; eventBus.$emit('onFormError') } }); }, verifyPhone(scope){ let self = this; self.message = null; this.$validator.validateAll(scope).then(result => { if (result) { axios.post('https://elektronika.com.tm/customer/verify', {code: self.code}) .then(function(response) { self.message = response.data.message; window.flashMessages = [{'type': 'alert-success', 'message': response.data.message}]; self.$root.addFlashMessages(); // window.location.href = response.data.redirect; setTimeout(function() { let regForm = document.querySelector('.registration-form'); let loginForm = document.querySelector('.login-form'); regForm.style.display = 'none'; loginForm.style.display = 'block'; }, 1500); self.verification = false; }).catch(function(error) { self.error_message = error.response.data.message; let errorFields = Object.keys(error.response.data.errors); errorFields.map(field => { let errorString = error.response.data.errors[field].join(', '); self.$validator.errors.add({ field:field, msg: errorString, scope:scope }); }); }); } }); } } }); </script> <script type="text/x-template" id="recovery-form-template"> <div class="reset-password"> <div v-show="recovery" class="login-form password-recovery-nr"> <div class="sign-up-title"> <span>A莽ar s枚z眉ni dikeltmek</span> <div class="sign-up-exit-img"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/cancel.svg" alt="exit"> </div> </div> <form class="sign-up-content" method="post" @submit.prevent="validateRecoveryForm('recovery')" data-vv-scope="recovery"> <span class="control-error" v-if="errors.has('recovery.recovery')">{{ errors.first('recovery.recovery') }}</span> <div class="sign-up-input"> <span>Telefon</span> <div class="dif-input"> <span class="pointer-ev-none">+993</span> <input class="abs-input" type="text" v-model="phone" name="phone" v-validate="'required|numeric|digits:8'" autocomplete="on" data-vv-as=""Telefon""> <span class="control-error" v-if="errors.has('register.phone')">{{ errors.first('register.phone') }}</span> </div> </div> <button type="submit" class="log-in topped sms-trigger" :disabled="disable_button">Sms Ugrat</button> </form> </div> <div v-show="!recovery" class="login-form password-recovery-sms"> <div class="sign-up-title"> <span>A莽ar s枚zi dikeltmek</span> <div class="sign-up-exit-img"> <img src="https://elektronika.com.tm/themes/elektronika/assets/icons/cancel.svg" alt="exit"> </div> </div> <form class="sign-up-content" method="post" @submit.prevent="resetPassword('reset')" data-vv-scope="reset" autocomplete="on"> <span class="control-error" v-if="errors.has('reset.reset')">{{ errors.first('reset.reset') }}</span> <div class="sign-up-input"> <span>Sms bilen gelen kod</span> <div class="dif-input"> <input type="text" name="token" v-model="code" v-validate="'required|numeric|min:4'"> <span class="control-error" v-if="errors.has('reset.token')">{{ errors.first('reset.token') }}</span> </div> </div> <div class="sign-up-input"> <span>A莽ar s枚z</span> <div class="dif-input"> <input type="password" v-model="password" autocomplete="off" name="password" v-validate="'required|min:6'" ref="password"> <span class="control-error" v-if="errors.has('reset.password')">{{ errors.first('reset.password') }}</span> </div> </div> <button type="submit" class="log-in topped">Tassykla</button> <div class="sign-up-footer"> <span>Sms bilen kod gelmedik bolsa.</span> <span class="sign-up-btn resend-sms" @click="recovery=true">T盲zeden ugrat</span> </div> </form> </div> </div> </script> <script> Vue.component('recovery-form-component', { template: '#recovery-form-template', inject: ['$validator'], data: function() { return { phone: '', password: "", message: null, disable_button: false, recovery: true, code:'', reset_password: true, } }, methods: { validateRecoveryForm(scope){ let self = this; self.message = null; self.disable_button = true; this.$validator.validateAll(scope).then(result => { if (result) { axios.post('https://elektronika.com.tm/customer/recovery', {phone: self.phone}) .then(function(response) { // console.log(response.data); self.message = response.data.message; if (response.data.success) { self.recovery = false; } self.disable_button = false; }) .catch(function(error) { self.error_message = error.response.data.message; // self.$setErrorsFromResponse(error.response.data); self.disable_button = false; let errorFields = Object.keys(error.response.data.errors); errorFields.map(field => { let errorString = error.response.data.errors[field].join(', '); self.$validator.errors.add({ field:field, msg: errorString, scope:scope }); }); }); } else { self.disable_button = false; eventBus.$emit('onFormError') } }); }, resetPassword(scope) { let self = this; self.message = null; self.error_message = null; self.disable_button = true; // Validate the form fields this.$validator.validateAll(scope).then(result => { if (result) { // Validation successful, send the request axios.post('https://elektronika.com.tm/customer/reset-password', { phone: self.phone, token: self.code, password: self.password }) .then(function(response) { window.flashMessages = [{'type': 'alert-success', 'message': response.data.message}]; self.$root.addFlashMessages(); setTimeout(function() { let loginForm = document.querySelector('.login-form'); let resetForm = document.querySelector('.reset-password'); loginForm.style.display = 'block'; resetForm.style.display = 'none'; self.reset_password = false; }, 1500); self.disable_button = false; }) .catch(function(error) { console.error('Error received:', error.response.data); self.error_message = error.response.data.message; self.disable_button = false; if (error.response.data.errors) { let errorFields = Object.keys(error.response.data.errors); errorFields.map(field => { let errorString = error.response.data.errors[field].join(', '); self.$validator.errors.add({ field: field, msg: errorString, scope: scope }); }); } }); } else { // Validation failed self.disable_button = false; // Display validation errors let validationErrors = this.$validator.errors.items.filter(e => e.scope === scope); self.error_message = validationErrors.map(e => e.msg).join(', '); eventBus.$emit('onFormError'); } }).catch(err => { console.error('Validation error:', err); }); } } }); </script> <div class="modal-overlay"></div> <!-- Yandex.Metrika counter --> <script type="text/javascript" > (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(97330493, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true, webvisor:true }); </script> <noscript><div><img src="https://mc.yandex.ru/watch/97330493" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-PETK150JLY"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-PETK150JLY'); </script> </body> </html>