<template>
    <router-view />
    <login></login>
</template>
<script setup>
import login from "@/components/public/login.vue"
import store from "@/store"
import {onMounted, watch, watchEffect} from "vue"
import {useRoute} from "vue-router"
import api from "./utils/api"
let socketTask = null

onMounted(() => {
    // useSocket()
    document.addEventListener("visibilitychange", () => {
        if (document.visibilityState === "visible" && socketTask.readyState != 1) useSocket()
    })

    // 创建cnzz统计js  //v1.cnzz.com/z_stat.php?id=1281224882&amp;web_id=1281224882
    // const script = document.createElement("script")
    // script.src = "https://v1.cnzz.com/z_stat.php?id=1281224882&web_id=1281224882"
    // script.language = "JavaScript"
    // document.body.appendChild(script)

    getBannerData()
})

const route = useRoute()

watch(route, (newValue, oldValue) => {
    if (window._czc) {
        let location = window.location
        let contentUrl = location.pathname + location.hash
        let refererUrl = "/"

        window._czc.push(["_trackPageview", contentUrl, refererUrl])
        window._czc.push(["_setAutoPageview", false])
    }
    if (window._hmt) {
        if (newValue["path"]) window._hmt.push(["_trackPageview", newValue["fullPath"]])
    }
})

const useSocketInterval = 50000 // Socket的时间间隔
const useSocket = () => {
    let token = getMiucmsSessionCookie() || ""
    socketTask = new WebSocket(`wss://app.gter.net/socket?token=${token}`)
    socketTask.onopen = () => {
        let user = store.state.user || {}
        if (user && token) {
            socketTask.send(
                JSON.stringify({
                    type: "bind",
                    data: {
                        token,
                        uid: user.uid || 0,
                    },
                })
            )
        }
        setTimeout(() => timedTransmission(), useSocketInterval)
    }
    socketTask.onclose = () => {
        // timedTransmissionState = false
        console.log("socket关闭了", new Date())
    }
}

// let timedTransmissionState = false // 定时器启动状态
// 定时发送
const timedTransmission = () => {
    // if (socketTask.readyState != 1 || timedTransmissionState) return
    if (socketTask.readyState != 1) return
    // timedTransmissionState = true
    socketTask.send(JSON.stringify({type: "ping"}))
    console.log("ping", new Date())
    setTimeout(() => timedTransmission(), useSocketInterval)
}

const getMiucmsSessionCookie = () => {
    let cookies = document.cookie.split(";")
    for (let i = 0; i < cookies.length; i++) {
        let cookie = cookies[i].split("=")
        if (cookie[0].trim() === "miucms_session") {
            return cookie[1]
        }
    }
    return null
}

// 获取轮播图的 数据
const getBannerData = () => {
    api.banner().then(res => {
        if (res.code === 200) {
            // bannerData
            store.state.bannerData = res.data
        }
    })
}
</script>
<style lang="less">
header.page-header {
    z-index: 1000 !important;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "PingFangSC-Regular", "PingFang SC", sans-serif;
}

a {
    text-decoration: none;
}

html {
    // background-color: #eff7ff;
    background-color: rgba(238, 242, 245, 1);
}

img {
    object-fit: contain;
}

.wordbreak {
    word-break: break-word;
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.shadow {
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
}

.radius16 {
    border-radius: 16px;
}

.flexflex {
    display: flex;
}

.flex1 {
    flex: 1;
}

.flexcenter {
    display: flex;
    justify-content: center;
    align-items: center;
}

.flexacenter {
    display: flex;
    align-items: center;
}

.flexjcenter {
    display: flex;
    justify-content: center;
}

.wid1200 {
    width: 1200px;
}

.box-min-1200-src {
    min-width: 1200px;
    overflow-x: scroll;
}

/* // 全局css 加上以下代码，可以隐藏上下箭头 */

/* // 取消input的上下箭头 */
input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
}

input::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
}

input[type="number"] {
    -moz-appearance: textfield;
}

.scrollbar {
    /*滚动条样式*/
    &::-webkit-scrollbar {
        width: 8px;
    }

    &::-webkit-scrollbar-thumb {
        border-radius: 10px;
        box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
        background: rgba(242, 242, 242, 1);
    }

    &::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px rgba(0, 0, 0, 0);
        border-radius: 0;
        background: transparent;
    }
}

@font-face {
    font-family: "Arial-Black";
    src: url("data:font/woff2;charset=utf-8;base64,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") format("woff2"), url("data:font/woff;charset=utf-8;base64,d09GRgABAAAAAAn4AA0AAAAADrwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAJ3AAAABoAAAAcd1dlsUdERUYAAAnAAAAAHAAAAB4AJwAYT1MvMgAAAaAAAABXAAAAYHccjRFjbWFwAAACLAAAAGoAAAFiEr41yWdhc3AAAAm4AAAACAAAAAj//wADZ2x5ZgAAAsAAAAS7AAAFgMTqZbBoZWFkAAABMAAAADIAAAA2B36I+mhoZWEAAAFkAAAAHAAAACQPegRDaG10eAAAAfgAAAAyAAAASFYGBJhsb2NhAAACmAAAACYAAAAmDIgLUG1heHAAAAGAAAAAIAAAACACJwBnbmFtZQAAB3wAAAH6AAAFHLRG6/Zwb3N0AAAJeAAAAD0AAABNnbd3+XjaY2BkYGBgYmDoOKPQG89v85WBm4MBBC7cnB+CoP9rs61i02JgZOAAqWVgAAA9FAsEAAB42mNgZGDgOPe3jYGBbRUDA5hkZEAFQgBlfAPOAAEAAAASADYAAwAAAAAAAgAGAC8ANwAAAdQAAAAAAAB42mNgYQ1lnMDAysDAOovVmIGBoQlCM25nSGMS4mBl4uZiYWJkYmJiYWBgahdgQABffz9/BgUg9GbdxbiJUZnjHFOVAgPD/PvXQbKsu4CEAgMjAC90DSYAeNpjY4AAplVAvJqBgTWMwQyIQ4B4OZTtAcRaQOwMxGFAHA2Vd2dbxTADhEH6AGXNC+4AAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMKgwWDJ4MHj//w8UBfEMILz/j/8/+H/1//H/R6EmwAEjGwNciJEJSDAxoCmAWM2CJMTKxs7BycXNw8uHqpSfgUGAYQgCAM5qEMQAAAAAABQAFAAUABQAagCiALwA7gE2AVYBkAHUAfQCRAKIAqICwALAAAB42lWUe0wUVxTG75nHbmrDyuzuLGgQWXB5g7ivUbELBl1Y3QIrLjRLAXF4WasCFl1ZqmAFAhEbHlZjNaa2ppG0MdEoFLG1iZYWgrY1xTaSatrGV7VYbUnEnUvvjsXamfnjTibnnO/7nXMGUYhcDGIRopESoUWcnjPoOT2D/BH0BX86i56iCOZC4Kt1OoFVKeJRDEpGFoSATYYYjgnR8VoVpeSjLMl0jCEcQrhkymK2ChYTHw6sCnitLkRjA4s5Oob5Be8NSzJDSkVr6YFeX1d3X3OWGnrUr9iHTzQ8mey6+UD6IN1oSuty52SUMqWpmUIYvuHy7BjYdLZeYM+fD1pZ31G2UHwtEkoXrzmz+9REkCiq+pfxtvjE5TopVlNgXZgTGbBDobXTt1mKvYrUaD5CmmCkN4ZTRCk5REbHRFOGYJ3JSEQFR0dFKtZCEph7Pveu5OPwI3z2s98cllToEYtthQmiWO6hfoVjkO2oa8r/6BSuwfu21bpgzgl8Z7RgcAgWfDNK6gH6mACaIPVmkRdCUAVKzgYCPYHLys51fHtrOXt1Kon+zlmcANkZg+1IjrES7n4SMw+hOLCqDTIkokdpsFEmYzghp1CSRHrG/3Qp/wMYTpeJq7NFDleFNt69fG2i7cgVX95iquEMpP3U3G7LKFnfoP/ky8r1Iztb/upyrxDkGlmEA01qJJMXg3WBKYIJZNWFBLKrICqStJD0zGS0yqWVGt3MUQE38K4U4KZgPqCqDe4kh6vFP/r17f2xcCC0PHvNpg2elLV8pCZ3Y649y8OoV/ZfHDtWcmgpH5bUXdH4+67iM21WX4m3rKI6FKLYCntGbkGgL/EIsQkypyCiSM+Rx8RFcfo5AHSwNJe6BWJ/Pz6CvaCGHLrW78MX8R9UNoxik+wng/hRsAOItFlDplRpI9oRr6UYYoX6nxWC8Qk9JNVErWhePg7qDiwNd17p9ITD4dmbne4t1UWpQtwifJwdwOfGIyLw5PA+PNUubGqvTBIrmxrfqZ/HC8Zns5RPaqqI5jAU+2zq5ez/Vg5AXEBx8oQBaP/jx0zgjcGrBVGI1TgOlV+E2W2P+8bx5FHIhtiTIy2SxVuQ+2Z1nnsrU21028uy7q/KxHeudT70vQcOmA0dUOM67Je2t9bvaNi9U/ZeSNgh4j1I9q4gGhS0fi5o9IXM8ferdjqWavEbKZdvSInE04O9H371+DzGUAm3gA/4oJ/vxDwUJ+8vWQSLWbDKM0GSySNBBUaCrO+LTugXzuBYl7js09afIRrmLI73bK8r777ecHey0Qvmkhy7p9ixqki3zel4q+5VZw2tNaXlV/fXeW72ivnpy5YM1m7+omrR5rE9TafB5Sx63eEsKZLSSn1vrytt8BLOmdO3mekZzhq5l4JVCABGFnMAN6MOcCYCQdbCy7oqYH+wU1gvxGoJ5kv4z/ZHfeMw6yg+hX88OdxCDXvzXRu35OXXgsPktouO+6vtEDrW9dB3APeRbd+K33UdpmmCud4nYyacDyKk0BDOLz+bsZn7IFyCCRjCSzCHU9kBaZqCKTvlkk7OxPQ+jwH9S6AnvwA55jrlke5RydL3eOSeHDhGxUvX/Fuowr/xIfQPjxqjlwB42t1SvW7bMBA+UY6NIkXRKegUHDoWkBEbyOCiS37QLUsRZCzASIxEW7YEkk6gPEsfIFO3Tt3zAn2AvkO3bPlIs67boECRIUMlkPfd8ePH4x2J6CXdUkKr70tSR5zQtngbsaCBOIs4pV3xKeIeON8i3qLn4i7iPm2nuxEPKE9/YFfSewbRaVDwOKEd8TpiQS/E+4hTeic+RtwD52vEW/RKfI+4TztpP+IB3aZv6Jg0lRgO45oUFcQYEr4EyqmhljoygVUhynQKq2BPsLbAcFhvQ+QIngH2swyKnsE0ogn+EWUR7dMQ0QOq8fOGtg2eglWwlyGbFdNzJNif4enA89m5cE4B3hzW0Ayxhi4eleMVdmjctwL2ah3sedjhMyrDqS7ktaqRDrvyEPG1WvlTWoZcLThe7ae+xT3oWJfa6WtVcCGd5LxpO6PLyvFppfikWTSuaxUfNaZtjHS6WfBoMhllmPaHfFDXHNiWjbLKXKoCQaNlfcPasmRnZKHm0sy4ufi74lWl84rnsuNzBaFSW6cMMtILzpVxEna6NNoWOvd8i7R/VZ/pELPEvWYI+7P5sJY5nA+hRsuwauCqcllLgIf1z37r56Yi/6myvkDGG4fxWvxfEjsLDbLrNo/RiDHtYUEZ6wsyHo73NqWyB1JZlPpPXuFTvJl7TH4S/gAAeNptwTkOQEAAAMDZldC7rx9IJF5FodCK3rNFojYj+jy3y5+cEEWJTKFUqTVand5gNJmFdN3PY1terxUFwwAAAAAAAAH//wACeNpjYGRgYOABYjEgZmJgBEJBIGYB8xgABFkAQHjaY2BgYGQAgqtL1DlA9IWb80NgNABD5QbiAAA=") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

.no-scrollbar {
    scrollbar-width: none;
    /* 隐藏滚动条 */

    &::-webkit-scrollbar {
        width: 0;
        background-color: transparent;
    }

    &::-webkit-scrollbar-thumb {
        background-color: transparent;
    }

    &::-webkit-scrollbar-track {
        background-color: transparent;
    }

    &::-webkit-scrollbar {
        display: none;
        /* 隐藏 Chrome 浏览器的滚动条 */
    }
}

.rotate180 {
    transform: rotate(180deg);
}

.el-loading-mask {
    z-index: 2100 !important;
}

header.page-header {
    width: 100%;
    position: absolute;
    background: transparent;
    z-index: 1;
}
</style>
