<template>
    <div class="support-chat">
        <h1>在线客服</h1>
        <p>如果您有任何问题，请通过在线客服联系我们。</p>
        <p>请点击右下角按钮联系客服</p>
    </div>
</template>

<script setup>

onMounted(() => {
    // 插入客服脚本
    (function (d, t) {
        const BASE_URL = "https://service.quannengcha.com";
        const g = d.createElement(t),
            s = d.getElementsByTagName(t)[0];
        g.src = BASE_URL + "/packs/js/sdk.js";
        g.defer = true;
        g.async = true;

        s.parentNode.insertBefore(g, s);
        g.onload = function () {
            window.chatwootSDK.run({
                websiteToken: "XJqwnEWKVNte8iJW8DLroEzd",
                baseUrl: BASE_URL,
                type: "expanded_bubble", // 使用自动展开模式
            });

            console.log("Chatwoot script initialized", g);
        };
    })(document, "script");
});
</script>

<style scoped>
.support-chat {
    text-align: center;
    padding: 20px;
}

.support-chat h1 {
    font-size: 28px;
    color: #005a9e;
    margin-bottom: 10px;
}

.support-chat p {
    font-size: 16px;
    color: #333;
}

iframe {
    background: #000000;
}

iframe::content .file-uploads.file-uploads-html5.text-black-900 {
    display: none !important;
}
</style>
