Initial commit: Add logistics and order_detail message types

- Add Logistics component with progress tracking - Add OrderDetail component for order information - Support data-driven steps and actions - Add blue color scale to widget SCSS - Fix node overflow and progress bar rendering issues - Add English translations for dashboard components Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-01-26 11:16:56 +08:00
commit 092fb2e083
7646 changed files with 975643 additions and 0 deletions
--- a/app/views/widget_tests/index.html.erb
+++ b/app/views/widget_tests/index.html.erb
@@ -0,0 +1,122 @@
+<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
+<body>
+</body>
+
+<%
+  # 使用动态的 user identifier，生成对应的 hash
+  user_id = '123'
+  user_hash = OpenSSL::HMAC.hexdigest(
+    'sha256',
+    @web_widget.hmac_token,
+    user_id.to_s
+  )
+
+%>
+<script>
+// Helper function to get cookie value by name
+function getCookie(name) {
+  const value = `; ${document.cookie}`;
+  const parts = value.split(`; ${name}=`);
+  if (parts.length === 2) return parts.pop().split(';').shift();
+  return null;
+}
+
+window.chatwootSettings = {
+  hideMessageBubble: false,
+  // showUnreadMessagesDialog: false,
+  // baseDomain: '.loca.lt',
+  position: '<%= @widget_position %>',
+  locale: 'zh_CN',
+  useBrowserLanguage: false,
+  type: '<%= @widget_type %>',
+  // showPopoutButton: true,
+  widgetStyle: '<%= @widget_style %>',
+  darkMode: '<%= @dark_mode %>',
+};
+
+// User ID for identification (simple string, not JWT token)
+const userId = '<%= user_id %>';
+
+(function(d,t) {
+  var BASE_URL = '';
+  var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
+  g.src= BASE_URL + "/packs/js/sdk.js";
+  g.async = true;
+  s.parentNode.insertBefore(g,s);
+  g.onload=function(){
+    // Get token from cookie (for custom attributes only)
+    const token = getCookie('token');
+
+    // Initialize config with simple userId as userIdentifier
+    const widgetConfig = {
+      websiteToken: '<%= @web_widget.website_token %>',
+      baseUrl: BASE_URL,
+      locale: 'zh_CN',
+      useBrowserLanguage: false
+    };
+
+    // Add userIdentifier (use simple userId, not JWT token)
+    if (userId) {
+      widgetConfig.userIdentifier = userId;
+    }
+
+    window.chatwootSDK.run(widgetConfig);
+
+    console.log('✅ Chatwoot Widget 已加载');
+    console.log('User ID:', userId);
+    console.log('Token from cookie:', token || 'Not set');
+
+    // Wait for widget to load, then set user attributes
+    setTimeout(function() {
+      if (userId && window.$chatwoot && window.$chatwoot.setUser) {
+        window.$chatwoot.setUser(userId, {
+          identifier_hash: '<%= user_hash %>',
+          email: 'user@example.com',
+          name: 'Token User',
+          phone_number: '',
+          custom_attributes: token ? {
+            jwt_token: token,
+            mall_token: token
+          } : {}
+        });
+        console.log('✅ 已通过 setUser 设置用户属性，userId:', userId);
+      } else if (token && window.$chatwoot && window.$chatwoot.setCustomAttributes) {
+        // Fallback: use setCustomAttributes
+        window.$chatwoot.setCustomAttributes({
+          jwt_token: token,
+          mall_token: token
+        });
+        console.log('✅ 已通过 setCustomAttributes 设置用户属性');
+      }
+    }, 1000);
+  }
+})(document,"script");
+
+window.addEventListener('chatwoot:ready', function() {
+  console.log('chatwoot:ready', window.$chatwoot);
+})
+
+window.addEventListener('chatwoot:error', function(e) {
+  console.log('chatwoot:error', e.detail)
+})
+
+window.addEventListener('chatwoot:on-message', function(e) {
+  console.log('chatwoot:on-message', e.detail)
+})
+
+window.addEventListener('chatwoot:postback', function(e) {
+  console.log('chatwoot:postback', e.detail)
+})
+
+window.addEventListener('chatwoot:opened', function() {
+  console.log('chatwoot:opened')
+})
+
+window.addEventListener('chatwoot:closed', function() {
+  console.log('chatwoot:closed')
+})
+
+window.addEventListener('chatwoot:on-start-conversation', function(e) {
+  console.log('chatwoot:on-start-conversation', e.detail)
+})
+</script>