## 主要变更 ### 1. Dify 机器人优化 **文件**: public/index.html - ✅ 恢复 Dify 机器人代码 - ✅ 添加显示控制逻辑:只在 /home 页面显示 - ✅ 使用 JavaScript 监听路由变化,动态控制显示/隐藏 - ✅ 保留所有样式配置 ### 2. Bytedesk 客服系统集成 **文件**: src/bytedesk-integration/config/bytedesk.config.js - ✅ 配置开发环境使用代理路径(/bytedesk-api) - ✅ 修复 X-Frame-Options 跨域问题 - ✅ 优化 shouldShowCustomerService 逻辑:默认所有页面显示,只在 /login 隐藏 - ✅ 保留白名单模式代码作为备用方案 **文件**: src/components/GlobalComponents.js - ✅ 集成 BytedeskWidget 组件 - ✅ 使用 shouldShowCustomerService 控制显示 ### 3. 客服显示规则 **Dify 机器人**: - ✅ /home 页面 → 显示 - ❌ 其他页面 → 隐藏 **Bytedesk 客服**: - ✅ 所有页面 → 显示 - ❌ /login 页面 → 隐藏 ## 已知问题 - ⚠️ Bytedesk 服务器配置 enabled: false,需要后端修改为 true - ⚠️ 配置接口: /config/bytedesk/properties ## 测试建议 1. 访问 /home 页面,检查 Dify 机器人是否显示 2. 访问其他页面,检查 Dify 是否隐藏 3. 等待后端修改 enabled 后,测试 Bytedesk 客服功能 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
219 lines
7.2 KiB
HTML
Executable File
219 lines
7.2 KiB
HTML
Executable File
<!--
|
||
/*!
|
||
|
||
=========================================================
|
||
* Argon Dashboard Chakra PRO - v1.0.0
|
||
=========================================================
|
||
|
||
* Product Page: https://www.creative-tim.com/product/argon-dashboard-chakra-pro
|
||
* Copyright 2022 Creative Tim (https://www.creative-tim.com/)
|
||
|
||
* Designed and Coded by Simmmple & Creative Tim
|
||
|
||
=========================================================
|
||
|
||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||
|
||
*/
|
||
-->
|
||
<!DOCTYPE html>
|
||
<html lang="en" dir="ltr" layout="admin">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta
|
||
name="viewport"
|
||
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
||
/>
|
||
<meta name="theme-color" content="#000000" />
|
||
<!--
|
||
manifest.json provides metadata used when your web app is added to the
|
||
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
|
||
-->
|
||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png" />
|
||
<link
|
||
rel="apple-touch-icon"
|
||
sizes="76x76"
|
||
href="%PUBLIC_URL%/apple-icon.png"
|
||
/>
|
||
|
||
|
||
|
||
<link rel="shortcut icon" type="image/x-icon" href="./favicon.png" />
|
||
|
||
<!--
|
||
Notice the use of %PUBLIC_URL% in the tags above.
|
||
It will be replaced with the URL of the `public` folder during the build.
|
||
Only files inside the `public` folder can be referenced from the HTML.
|
||
|
||
Unlike "/favicon.png" or "favicon.png", "%PUBLIC_URL%/favicon.png" will
|
||
work correctly both with client-side routing and a non-root public URL.
|
||
Learn how to configure a non-root public URL by running `npm run build`.
|
||
-->
|
||
<title>价值前沿——LLM赋能的分析平台</title>
|
||
</head>
|
||
<body>
|
||
<noscript> You need to enable JavaScript to run this app. </noscript>
|
||
<div id="root"></div>
|
||
<!--
|
||
This HTML file is a template.
|
||
If you open it directly in the browser, you will see an empty page.
|
||
|
||
You can add webfonts, meta tags, or analytics to this file.
|
||
The build step will place the bundled scripts into the <body> tag.
|
||
|
||
To begin the development, run `npm start` or `yarn start`.
|
||
To create a production bundle, use `npm run build` or `yarn build`.
|
||
-->
|
||
<!-- ============================================
|
||
Dify 机器人配置 - 只在 /home 页面显示
|
||
============================================ -->
|
||
<script>
|
||
window.difyChatbotConfig = {
|
||
token: 'DwN8qAKtYFQtWskM',
|
||
baseUrl: 'https://app.valuefrontier.cn',
|
||
inputs: {
|
||
// You can define the inputs from the Start node here
|
||
// key is the variable name
|
||
// e.g.
|
||
// name: "NAME"
|
||
},
|
||
systemVariables: {
|
||
// user_id: 'YOU CAN DEFINE USER ID HERE',
|
||
// conversation_id: 'YOU CAN DEFINE CONVERSATION ID HERE, IT MUST BE A VALID UUID',
|
||
},
|
||
userVariables: {
|
||
// avatar_url: 'YOU CAN DEFINE USER AVATAR URL HERE',
|
||
// name: 'YOU CAN DEFINE USER NAME HERE',
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<!-- Dify 机器人显示控制脚本 -->
|
||
<script>
|
||
// 控制 Dify 机器人只在 /home 页面显示
|
||
function controlDifyVisibility() {
|
||
const currentPath = window.location.pathname;
|
||
const difyChatButton = document.getElementById('dify-chatbot-bubble-button');
|
||
|
||
if (difyChatButton) {
|
||
// 只在 /home 页面显示
|
||
if (currentPath === '/home') {
|
||
difyChatButton.style.display = 'flex';
|
||
console.log('[Dify] 显示机器人(当前路径: /home)');
|
||
} else {
|
||
difyChatButton.style.display = 'none';
|
||
console.log('[Dify] 隐藏机器人(当前路径:', currentPath, ')');
|
||
}
|
||
}
|
||
}
|
||
|
||
// 页面加载完成后执行
|
||
window.addEventListener('load', function() {
|
||
console.log('[Dify] 初始化显示控制');
|
||
|
||
// 初始检查(延迟执行,等待 Dify 按钮渲染)
|
||
setTimeout(controlDifyVisibility, 500);
|
||
setTimeout(controlDifyVisibility, 1500);
|
||
|
||
// 监听路由变化(React Router 使用 pushState)
|
||
const observer = setInterval(controlDifyVisibility, 1000);
|
||
|
||
// 清理函数(可选)
|
||
window.addEventListener('beforeunload', function() {
|
||
clearInterval(observer);
|
||
});
|
||
});
|
||
</script>
|
||
|
||
<script
|
||
src="https://app.valuefrontier.cn/embed.min.js"
|
||
id="DwN8qAKtYFQtWskM"
|
||
defer>
|
||
</script>
|
||
<style>
|
||
#dify-chatbot-bubble-button {
|
||
background-color: #1C64F2 !important;
|
||
width: 60px !important;
|
||
height: 60px !important;
|
||
box-shadow: 0 4px 12px rgba(28, 100, 242, 0.3) !important;
|
||
transition: all 0.3s ease !important;
|
||
}
|
||
|
||
#dify-chatbot-bubble-button:hover {
|
||
transform: scale(1.1) !important;
|
||
box-shadow: 0 6px 16px rgba(28, 100, 242, 0.4) !important;
|
||
}
|
||
|
||
#dify-chatbot-bubble-window {
|
||
width: 42rem !important;
|
||
height: 80vh !important;
|
||
max-height: calc(100vh - 2rem) !important;
|
||
position: fixed !important;
|
||
bottom: 100px !important;
|
||
right: 20px !important;
|
||
border-radius: 16px !important;
|
||
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
|
||
border: 1px solid rgba(28, 100, 242, 0.1) !important;
|
||
z-index: 9999 !important;
|
||
}
|
||
|
||
/* 确保Dify聊天窗口中的超链接正确显示 */
|
||
#dify-chatbot-bubble-window a,
|
||
#dify-chatbot-bubble-window a:link,
|
||
#dify-chatbot-bubble-window a:visited,
|
||
#dify-chatbot-bubble-window a:hover,
|
||
#dify-chatbot-bubble-window a:active {
|
||
color: #1C64F2 !important;
|
||
text-decoration: underline !important;
|
||
cursor: pointer !important;
|
||
pointer-events: auto !important;
|
||
}
|
||
|
||
/* 确保超链接在Dify消息区域中可见 */
|
||
#dify-chatbot-bubble-window .message-content a,
|
||
#dify-chatbot-bubble-window .markdown-content a,
|
||
#dify-chatbot-bubble-window [class*="message"] a {
|
||
color: #0066cc !important;
|
||
text-decoration: underline !important;
|
||
font-weight: 500 !important;
|
||
}
|
||
|
||
/* 桌面端大屏优化 */
|
||
@media (min-width: 1440px) {
|
||
#dify-chatbot-bubble-window {
|
||
width: 45rem !important;
|
||
height: 85vh !important;
|
||
}
|
||
}
|
||
|
||
/* 平板端适配 */
|
||
@media (max-width: 1024px) and (min-width: 641px) {
|
||
#dify-chatbot-bubble-window {
|
||
width: 38rem !important;
|
||
height: 75vh !important;
|
||
right: 15px !important;
|
||
bottom: 90px !important;
|
||
}
|
||
}
|
||
|
||
/* 移动端适配 */
|
||
@media (max-width: 640px) {
|
||
#dify-chatbot-bubble-window {
|
||
width: calc(100vw - 20px) !important;
|
||
height: 85vh !important;
|
||
max-height: 85vh !important;
|
||
right: 10px !important;
|
||
bottom: 80px !important;
|
||
left: 10px !important;
|
||
}
|
||
|
||
#dify-chatbot-bubble-button {
|
||
width: 56px !important;
|
||
height: 56px !important;
|
||
}
|
||
}
|
||
</style>
|
||
</body>
|
||
</html>
|