src/main.ts - dev - vdele/app

src/main.ts
106 строк4 KB
Vasilii Polshakov
last fixes for 0.0.1-alpha
02 апр 2025, 12:32
02 апр 2025, 12:32ef3d4ef
import '@/style.css';
import { createApp} from 'vue';
import { createPinia } from 'pinia';
import router from '@/plugins/router';
import { useOrder, useModalStrore } from '@/stores/index';
import App from '@/App.vue';
import DevOnly from '@/components/services/DevOnly.vue';

if(import.meta.env.MODE === 'production'){
    const script = document.createElement('script');
    script.type = 'text/javascript'

    script.innerHTML = `(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(${100564896}, "init", {
                clickmap:true,
                trackLinks:true,
                accurateTrackBounce:true,
                webvisor:true,
                ecommerce:"dataLayer"
    });`;

    document.head.appendChild(script);

    // Добавляем noscript для случаев, когда JavaScript отключен
    const noscript = document.createElement('noscript');
    const div = document.createElement('div');
    const img = document.createElement('img');
    img.src = `https://mc.yandex.ru/watch/${100564896}`;
    img.style.position = 'absolute';
    img.style.left = '-9999px';
    img.alt = '';
    div.appendChild(img);
    noscript.appendChild(div);
    document.body.appendChild(noscript);

    console.log('🍒 yandex-metrika client script install.');
}

const app = createApp(App);
const pinia = createPinia();

//state stores
const orderStore = useOrder();
const modalStore = useModalStrore();

// global component registration
app.component('DevOnly', DevOnly);

// provide data
app.provide('orderStore', orderStore);
app.provide('modalStore', modalStore);

app.use(router);
app.use(pinia);

// применение анимации динамического пересчета к цифрам (счетчик)
app.directive('counter', {
    mounted: (el: HTMLElement, _binding) => {
        //console.group('counter');
        //console.log('counter:mounted', binding);
        //console.log('counter:mounted', binding.arg);
        //console.groupEnd();
        el.setAttribute('val', '100');
    },
    updated: (el: HTMLElement, binding) => {
        /*
        console.group('counter');
        console.log('counter:update', binding);
        console.log('counter:update', binding.arg);
        console.groupEnd();
        */
        let oldValue = binding.oldValue ?? binding.value;
        let newValue = binding.value;

        let startValue = parseInt(oldValue);
        let endValue = parseInt(newValue);
        let duration = Math.floor(5000 / endValue);
        if (duration === 0) duration = 10;
        let changeStep = Math.abs(Math.floor((oldValue - newValue) / 100));
        //console.log(changeStep);
        let counter = setInterval(() => {
            if (parseInt(oldValue) - parseInt(newValue) >= 0) {
                startValue -= changeStep;
                el.textContent = startValue.toLocaleString("ru-RU", { style: "currency", currency: "RUB", minimumFractionDigits: 2, maximumFractionDigits: 2 }).replace(',', '.');
                if (startValue <= endValue) {
                    el.textContent = newValue.toLocaleString("ru-RU", { style: "currency", currency: "RUB", minimumFractionDigits: 2, maximumFractionDigits: 2 }).replace(',', '.');
                    clearInterval(counter);
                }
            } else {
                startValue += changeStep;
                el.textContent = startValue.toLocaleString("ru-RU", { style: "currency", currency: "RUB", minimumFractionDigits: 2, maximumFractionDigits: 2 }).replace(',', '.');
                if (startValue >= endValue) {
                    el.textContent = newValue.toLocaleString("ru-RU", { style: "currency", currency: "RUB", minimumFractionDigits: 2, maximumFractionDigits: 2 }).replace(',', '.');
                    clearInterval(counter);
                }
            }
        }, 1);
    },
});

app.mount('#app');