Files
assistant-storefront/app/views/widgets/show.html.erb

45 lines
2.3 KiB
Plaintext
Raw Normal View History

<!DOCTYPE html>
<html>
<head>
<title><%= @global_config['INSTALLATION_NAME'] %></title>
<%= csrf_meta_tags %>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
<script>
window.chatwootWebChannel = {
avatarUrl: '<%= @web_widget.inbox.avatar_url %>',
hasAConnectedAgentBot: '<%= @web_widget.inbox.agent_bot&.name %>',
locale: '<%= @web_widget.account.locale %>',
websiteName: '<%= @web_widget.inbox.name %>',
websiteToken: '<%= @web_widget.website_token %>',
welcomeTagline: <%= @web_widget.welcome_tagline.to_json.html_safe %>,
welcomeTitle: '<%= @web_widget.welcome_title %>',
widgetColor: '<%= @web_widget.widget_color %>',
portal: <%= @web_widget.inbox.portal.to_json.html_safe %>,
enabledFeatures: <%= @web_widget.selected_feature_flags.to_json.html_safe %>,
enabledLanguages: <%= available_locales_with_name.to_json.html_safe %>,
replyTime: '<%= @web_widget.reply_time %>',
preChatFormEnabled: <%= @web_widget.pre_chat_form_enabled %>,
preChatFormOptions: <%= @web_widget.pre_chat_form_options.to_json.html_safe %>,
workingHoursEnabled: <%= @web_widget.inbox.working_hours_enabled %>,
csatSurveyEnabled: <%= @web_widget.inbox.csat_survey_enabled %>,
workingHours: <%= @web_widget.inbox.working_hours.to_json.html_safe %>,
outOfOfficeMessage: <%= @web_widget.inbox.out_of_office_message.to_json.html_safe %>,
utcOffset: '<%= ActiveSupport::TimeZone[@web_widget.inbox.timezone].now.formatted_offset %>',
timezone: '<%= @web_widget.inbox.timezone %>',
allowMessagesAfterResolved: <%= @web_widget.inbox.allow_messages_after_resolved %>,
disableBranding: <%= @web_widget.inbox.account.feature_enabled?('disable_branding') %>,
feat: add search_image and product_list content types with image upload ## 新增功能 ### 1. 新增消息类型 - 添加 search_image (17) 和 product_list (18) content_type - 支持图片搜索和商品列表消息展示 ### 2. 图片上传功能 - 添加 ImageUploadButton 组件,支持图片上传到 Mall API - 上传后发送 search_image 类型消息,图片 URL 存储在 content_attributes - 支持图片文件验证(类型、大小) ### 3. Webhook 推送优化 - 修改 webhook_listener.rb,允许 search_image 类型即使 content 为空也推送 webhook - 解决 search_image 消息不触发 webhook 的问题 ### 4. 前端组件 - 新增 SearchImage.vue 组件(widget 和 dashboard) - 新增 ProductList.vue、Logistics.vue、OrderDetail.vue、OrderList.vue 组件 - 更新 Message.vue 路由逻辑支持新的 content_type - 更新 UserMessage.vue 支持 search_image 消息显示 ### 5. API 层修改 - widget/messages_controller.rb: 允许 content_attributes 参数 - widget/base_controller.rb: 使用前端传入的 content_attributes - widget/conversation API: 支持 contentAttributes 参数传递 - conversation actions 和 helpers: 完整的 content_attributes 数据流 ### 6. Widget 测试页面优化 - 重写 /widget_tests 页面,支持游客/用户模式切换 - 登录流程:使用 reset() + setUser(),不刷新页面 - 退出流程:使用 reset() + 刷新页面 - 添加详细的日志输出和状态显示 ## 技术细节 ### Message Model ```ruby enum content_type: { # ...existing types... search_image: 17, product_list: 18 } ``` ### Webhook Listener ```ruby # Allow search_image webhook even if content is blank return if message.content.blank? && message.content_type != 'search_image' ``` ### Widget Upload Flow ``` 用户选择图片 → 上传到 Mall API → 获取图片 URL → 发送消息: { content: '', content_type: 'search_image', content_attributes: { url: '...' } } ``` Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-01-27 19:03:46 +08:00
mallUrl: '<%= ENV.fetch('MALL_URL', 'https://apicn.qa1.gaia888.com') %>',
}
window.chatwootPubsubToken = '<%= @contact_inbox.pubsub_token %>'
window.authToken = '<%= @token %>'
window.globalConfig = <%= raw @global_config.to_json %>
</script>
<%= vite_client_tag %>
<%= vite_javascript_tag 'widget' %>
</head>
<body>
<div id="app" class="h-full"></div>
<%= yield %>
</body>
</html>