{"id":355,"date":"2025-11-20T16:55:31","date_gmt":"2025-11-20T08:55:31","guid":{"rendered":"https:\/\/legolas.com.tw\/?page_id=355"},"modified":"2025-11-20T16:55:31","modified_gmt":"2025-11-20T08:55:31","slug":"%e5%8d%b3%e6%99%82%e5%ae%a2%e6%9c%8d%e8%81%8a%e5%a4%a9%e5%ae%a4","status":"publish","type":"page","link":"https:\/\/legolas.com.tw\/?page_id=355","title":{"rendered":"\u5373\u6642\u5ba2\u670d\u804a\u5929\u5ba4"},"content":{"rendered":"        <div id=\"gjp-chat-page\">\n            <div class=\"gjp-chat-box\">\n                <h2 class=\"gjp-title\">\u7dda\u4e0a\u5ba2\u670d\u804a\u5929\u5ba4<\/h2>\n                <div id=\"gjp-chat-messages\"><\/div>\n                <div id=\"gjp-chat-input-area\">\n                    <textarea id=\"gjp-chat-input\" rows=\"3\" placeholder=\"\u8acb\u8f38\u5165\u8a0a\u606f\u2026\"><\/textarea>\n                    <button id=\"gjp-chat-send\" type=\"button\">\u9001\u51fa<\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <style>\n            #gjp-chat-page {\n                display: flex;\n                justify-content: center;\n                padding: 20px 10px;\n                background: #f3e9dc;\n            }\n            .gjp-chat-box {\n                width: 100%;\n                max-width: 800px;\n                background: #f9f3ea;\n                border-radius: 16px;\n                box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n                padding: 12px;\n                display: flex;\n                flex-direction: column;\n                height: 70vh;\n            }\n            .gjp-title {\n                margin: 0 0 8px;\n                font-size: 18px;\n                color: #6f5b49;\n                text-align: center;\n            }\n            #gjp-chat-messages {\n                flex: 1;\n                overflow-y: auto;\n                padding: 10px;\n                background: #fdf8f0;\n                border-radius: 10px;\n                border: 1px solid #e3d5c5;\n                display: flex;\n                flex-direction: column;\n                gap: 6px;\n            }\n            .gjp-msg {\n                position: relative;\n                max-width: 78%;\n                padding: 9px 13px;\n                border-radius: 18px;\n                margin-bottom: 6px;\n                font-size: 14px;\n                line-height: 1.5;\n            }\n            .gjp-msg-customer {\n                background: #ffffff;\n                border: 1px solid #c9b39a;\n                color: #4a3f35;\n                margin-right: auto;\n                margin-left: 6px;\n                box-shadow: 0 1px 1px rgba(0,0,0,0.06);\n            }\n            .gjp-msg-customer::before {\n                content: \"\";\n                position: absolute;\n                left: -6px;\n                top: 10px;\n                border-width: 8px 8px 8px 0;\n                border-style: solid;\n                border-color: transparent #ffffff transparent transparent;\n            }\n            .gjp-msg-customer::after {\n                content: \"\";\n                position: absolute;\n                left: -8px;\n                top: 10px;\n                border-width: 9px 9px 9px 0;\n                border-style: solid;\n                border-color: transparent #c9b39a transparent transparent;\n                z-index: -1;\n            }\n            .gjp-msg-admin {\n                background: #c7a98a;\n                color: #ffffff;\n                border: none;\n                margin-left: auto;\n                margin-right: 6px;\n                box-shadow: 0 1px 1px rgba(0,0,0,0.1);\n            }\n            .gjp-msg-admin::before {\n                content: \"\";\n                position: absolute;\n                right: -6px;\n                top: 10px;\n                border-width: 8px 0 8px 8px;\n                border-style: solid;\n                border-color: transparent transparent transparent #c7a98a;\n            }\n            .gjp-msg-admin::after {\n                content: \"\u5df2\u8b80\";\n                position: absolute;\n                right: 4px;\n                bottom: -16px;\n                font-size: 10px;\n                color: #a58563;\n            }\n            .gjp-time {\n                display: inline-block;\n                font-size: 11px;\n                color: #8b6f5a;\n                margin-top: 3px;\n            }\n\n            #gjp-chat-input-area {\n                margin-top: 10px;\n                display: flex;\n                gap: 10px;\n                align-items: flex-start;\n            }\n            #gjp-chat-input {\n                flex: 1;\n                resize: none;\n                background: #ffffff;\n                border: 2px solid #d8c8b8;\n                border-radius: 20px;\n                padding: 8px 12px;\n            }\n            #gjp-chat-send {\n                background: #b38b68;\n                color: #ffffff;\n                border-radius: 20px;\n                border: none;\n                padding: 8px 16px;\n                cursor: pointer;\n            }\n\n            @media (max-width: 768px) {\n                .gjp-chat-box {\n                    height: 75vh;\n                    padding: 10px;\n                }\n            }\n        <\/style>\n\n        <script>\n        (function() {\n            var ajaxUrl     = \"https:\/\/legolas.com.tw\/wp-admin\/admin-ajax.php\";\n            var nonce       = \"f6cceaff5b\";\n            var autoReplies = [{\"keyword\":\"\\u4f60\\u597d\",\"reply\":\"\\u60a8\\u597d\\uff5e\\u9019\\u88e1\\u662f\\u7dda\\u4e0a\\u5ba2\\u670d\\uff0c\\u6709\\u4ec0\\u9ebc\\u53ef\\u4ee5\\u5e6b\\u60a8\\uff1f\"},{\"keyword\":\"\\u51fa\\u8ca8\",\"reply\":\"\\u51fa\\u8ca8\\u6642\\u9593\\u70ba\\u9031\\u4e00\\u5230\\u9031\\u4e94 15:00 \\u7d71\\u4e00\\u51fa\\u8ca8\\uff0c\\u51fa\\u8ca8\\u5f8c\\u7d04 1-2 \\u5929\\u9001\\u9054\\u5594\\u3002\"},{\"keyword\":\"\\u904b\\u8cbb\",\"reply\":\"\\u76ee\\u524d\\u5168\\u9928\\u6eff 999 \\u514d\\u904b\\uff0c\\u672a\\u6eff 999 \\u904b\\u8cbb 80 \\u5143\\u3002\"},{\"keyword\":\"\\u5ba2\\u670d\\u6642\\u9593\",\"reply\":\"\\u5ba2\\u670d\\u670d\\u52d9\\u6642\\u9593\\u70ba\\u6bcf\\u65e5 13:00 ~ 23:00\\uff0c\\u6709\\u554f\\u984c\\u90fd\\u53ef\\u4ee5\\u7559\\u8a00\\u7d66\\u6211\\u5011\\u3002\"}];\n\n                    function gjGetSessionId() {\n            var key = 'gj_chat_session_id';\n            try {\n                var id = window.localStorage ? localStorage.getItem(key) : null;\n                if (!id) {\n                    id = 'c_' + Math.random().toString(36).substring(2, 10) + '_' + Date.now();\n                    if (window.localStorage) localStorage.setItem(key, id);\n                }\n                return id;\n            } catch (e) {\n                \/\/ \u5982\u679c\u700f\u89bd\u5668\u7981\u6b62 localStorage\uff0c\u5c31\u9000\u800c\u6c42\u5176\u6b21\n                return 'c_' + Math.random().toString(36).substring(2, 10) + '_' + Date.now();\n            }\n        }\n        \n            var sessionId  = gjGetSessionId();\n            var lastId     = 0;\n            var messagesEl = document.getElementById('gjp-chat-messages');\n            var inputBox   = document.getElementById('gjp-chat-input');\n            var sendBtn    = document.getElementById('gjp-chat-send');\n\n            function scrollToBottom() {\n                if (!messagesEl) return;\n                messagesEl.scrollTop = messagesEl.scrollHeight;\n            }\n\n            function appendMessage(msg) {\n                var div = document.createElement('div');\n                var cls = msg.sender === 'admin' ? 'gjp-msg-admin' : 'gjp-msg-customer';\n                div.className = 'gjp-msg ' + cls;\n\n                var text = document.createElement('div');\n                text.textContent = msg.message;\n\n                var time = document.createElement('span');\n                time.className = 'gjp-time';\n                time.textContent = msg.created_at || '';\n\n                div.appendChild(text);\n                div.appendChild(document.createElement('br'));\n                div.appendChild(time);\n\n                messagesEl.appendChild(div);\n                scrollToBottom();\n            }\n\n            function fetchMessages() {\n                var xhr = new XMLHttpRequest();\n                xhr.open('POST', ajaxUrl, true);\n                xhr.setRequestHeader('Content-Type', 'application\/x-www-form-urlencoded; charset=UTF-8');\n                xhr.onload = function() {\n                    if (xhr.status === 200) {\n                        try {\n                            var res = JSON.parse(xhr.responseText);\n                            if (res.success && res.data && res.data.messages) {\n                                res.data.messages.forEach(function(msg) {\n                                    appendMessage(msg);\n                                    if (msg.id > lastId) lastId = msg.id;\n                                });\n                            }\n                        } catch (e) {}\n                    }\n                };\n                var params = 'action=gj_fetch_messages'\n                    + '&nonce=' + encodeURIComponent(nonce)\n                    + '&session_id=' + encodeURIComponent(sessionId)\n                    + '&last_id=' + encodeURIComponent(lastId);\n                xhr.send(params);\n            }\n\n            function handleAutoReply(lastCustomerText) {\n                if (!autoReplies || !autoReplies.length) return;\n                var replyText = null;\n                autoReplies.forEach(function(rule) {\n                    if (replyText) return;\n                    if (!rule.keyword || !rule.reply) return;\n                    if (lastCustomerText.indexOf(rule.keyword) !== -1) {\n                        replyText = rule.reply;\n                    }\n                });\n                if (!replyText) return;\n\n                var xhr = new XMLHttpRequest();\n                xhr.open('POST', ajaxUrl, true);\n                xhr.setRequestHeader('Content-Type', 'application\/x-www-form-urlencoded; charset=UTF-8');\n                xhr.onload = function() {\n                    if (xhr.status === 200) {\n                        try {\n                            var res = JSON.parse(xhr.responseText);\n                            if (res.success) fetchMessages();\n                        } catch (e) {}\n                    }\n                };\n                var params = 'action=gj_send_message'\n                    + '&nonce=' + encodeURIComponent(nonce)\n                    + '&session_id=' + encodeURIComponent(sessionId)\n                    + '&sender=' + encodeURIComponent('admin')\n                    + '&message=' + encodeURIComponent(replyText);\n                xhr.send(params);\n            }\n\n            function sendMessage() {\n                var txt = inputBox.value.trim();\n                if (!txt) return;\n                inputBox.value = '';\n\n                var xhr = new XMLHttpRequest();\n                xhr.open('POST', ajaxUrl, true);\n                xhr.setRequestHeader('Content-Type', 'application\/x-www-form-urlencoded; charset=UTF-8');\n                xhr.onload = function() {\n                    if (xhr.status === 200) {\n                        try {\n                            var res = JSON.parse(xhr.responseText);\n                            if (res.success) {\n                                fetchMessages();\n                                handleAutoReply(txt);\n                            }\n                        } catch (e) {}\n                    }\n                };\n                var params = 'action=gj_send_message'\n                    + '&nonce=' + encodeURIComponent(nonce)\n                    + '&session_id=' + encodeURIComponent(sessionId)\n                    + '&sender=' + encodeURIComponent('customer')\n                    + '&message=' + encodeURIComponent(txt);\n                xhr.send(params);\n            }\n\n            if (sendBtn) sendBtn.addEventListener('click', sendMessage);\n            if (inputBox) {\n                inputBox.addEventListener('keyup', function(e) {\n                    if (e.key === 'Enter' && !e.shiftKey) {\n                        e.preventDefault();\n                        sendMessage();\n                    }\n                });\n            }\n\n            fetchMessages();\n            setInterval(fetchMessages, 3000);\n        })();\n        <\/script>\n        \n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-355","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/legolas.com.tw\/index.php?rest_route=\/wp\/v2\/pages\/355","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/legolas.com.tw\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/legolas.com.tw\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/legolas.com.tw\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/legolas.com.tw\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=355"}],"version-history":[{"count":1,"href":"https:\/\/legolas.com.tw\/index.php?rest_route=\/wp\/v2\/pages\/355\/revisions"}],"predecessor-version":[{"id":356,"href":"https:\/\/legolas.com.tw\/index.php?rest_route=\/wp\/v2\/pages\/355\/revisions\/356"}],"wp:attachment":[{"href":"https:\/\/legolas.com.tw\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=355"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}