chore:商品可以分享给智能客服进行解答

This commit is contained in:
2026-03-14 10:53:55 +08:00
parent 0912b9b031
commit 875072bb68
3 changed files with 83 additions and 176 deletions

View File

@@ -120,6 +120,10 @@
<text>{{ showMarketPrice(item) }}</text>
</view>
</view>
<view class="ai-chat-btn" @tap.stop="sendToAIChat(item)">
<text class="iconfont">🤖</text>
<text>更多详情</text>
</view>
<!-- <view class="right-wrap" v-if="value.template == 2 || value.template == 4">
<block v-if="item.is_virtual">
<view class="color-base-bg select-sku" @tap.stop="toDetail(item)">立即购买</view>
@@ -212,6 +216,10 @@
<text>{{ showMarketPrice(item) }}</text>
</view>
</view>
<view class="ai-chat-btn" @tap.stop="sendToAIChat(item)">
<text class="iconfont">🤖</text>
<text>更多详情</text>
</view>
<view class="right-wrap" v-if="value.template == 2">
<block v-if="item.is_virtual">
<view class="color-base-bg select-sku" @tap.stop="toDetail(item)">立即购买</view>
@@ -718,6 +726,25 @@ export default {
}
}
},
/**
* 发送商品信息到智能客服
* @param {Object} item 商品信息
*/
sendToAIChat(item) {
const productInfo = {
goods_id: item.goods_id,
goods_name: item.goods_name,
price: this.showPrice(item),
image: this.goodsImg(item.goods_image),
category_id: item.category_id
}
uni.setStorageSync('selectedProduct', productInfo)
uni.navigateTo({
url: '/pages_tool/ai-chat/index'
})
},
diyRedirectTo(link) {
if (!link) return;
this.$util.diyRedirectTo(JSON.parse(link));
@@ -1384,4 +1411,28 @@ export default {
color: var(--main-color);
}
}
.ai-chat-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 8rpx;
padding: 8rpx 16rpx;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-radius: 20rpx;
font-size: 24rpx;
font-weight: 500;
margin-top: 10rpx;
transition: all 0.3s ease;
&:active {
transform: scale(0.95);
opacity: 0.8;
}
.iconfont {
font-size: 28rpx;
}
}
</style>

View File

@@ -137,20 +137,7 @@
</view>
</view>
<!-- 商品卡片 -->
<view v-else-if="message.type === 'product'" class="product-content">
<view class="product-card" @click="viewProduct(message)">
<view class="product-image">
<image :src="message.image" mode="aspectFill" />
</view>
<view class="product-info">
<text class="product-title">{{ message.title }}</text>
<text class="product-price color-base-text">¥{{ message.price }}</text>
<text class="product-desc">{{ message.description }}</text>
</view>
</view>
</view>
<!-- 加载中状态 -->
<view v-else-if="message.type === 'loading'" class="loading-content">
<view class="loading-dots">
@@ -182,9 +169,6 @@
<!-- 输入区域 -->
<view class="input-area">
<view class="input-tools">
<button class="tool-btn" @click="selectProduct">
<text class="iconfont icon-goods">🛍️</text>
</button>
<button class="tool-btn" @click="showMoreTools" style="display: none;">
<text class="iconfont icon-plus">...</text>
</button>
@@ -282,50 +266,6 @@
</view>
</view>
<!-- 商品选择弹窗 -->
<view v-if="showProductSelector" class="product-selector-popup">
<view class="product-selector-mask" @click="closeProductSelector"></view>
<view class="product-selector-panel">
<view class="product-selector-header">
<text>选择商品</text>
<button class="close-btn" @click="closeProductSelector">
<text class="iconfont icon-close"></text>
</button>
</view>
<view class="product-selector-content">
<scroll-view class="category-list" scroll-y>
<view
v-for="(category, index) in productCategories"
:key="category.id"
class="category-item"
:class="{ active: selectedCategoryIndex === index }"
@click="selectCategory(index)">
{{ category.category_name }}
</view>
</scroll-view>
<scroll-view class="product-list" scroll-y>
<view v-if="loadingProducts" class="loading">
<text>加载商品中...</text>
</view>
<view v-else-if="selectedCategoryProducts.length === 0" class="empty">
<text>该分类下暂无商品</text>
</view>
<view
v-for="product in selectedCategoryProducts"
:key="product.id"
class="product-item"
@click="selectProductItem(product)">
<image :src="product.image" class="product-image" mode="aspectFill" />
<view class="product-info">
<text class="product-name">{{ product.goods_name }}</text>
<text class="product-price">¥{{ product.price }}</text>
</view>
</view>
</scroll-view>
</view>
</view>
</view>
<!-- 头像选择弹窗 -->
<view v-if="showAvatarSelector" class="avatar-selector-popup" style="pointer-events: auto;">
<view class="avatar-selector-mask" @click="closeAvatarSelector"></view>
@@ -463,12 +403,7 @@ export default {
defaultNickname: '我', // 默认昵称
showNicknameEditor: false, // 昵称编辑弹窗控制
tempNickname: '', // 昵称编辑临时值
// 商品选择相关
showProductSelector: false, // 商品选择弹窗控制
productCategories: [], // 商品分类列表
selectedCategoryIndex: 0, // 当前选中的分类索引
selectedCategoryProducts: [], // 当前分类下的商品列表
loadingProducts: false, // 商品加载状态
// Dify API相关
currentConversationId: null,
isAIServiceAvailable: true,
@@ -1320,11 +1255,7 @@ export default {
this.$emit('link-open', message)
},
// 查看商品
viewProduct(message) {
this.$emit('product-view', message)
},
// 处理操作
handleAction(action, message) {
// 处理重试操作
@@ -1519,110 +1450,7 @@ export default {
})
},
// 选择商品
selectProduct() {
this.hideToolsPanel()
this.showProductSelector = true
this.loadProductCategories()
},
// 关闭商品选择弹窗
closeProductSelector() {
this.showProductSelector = false
},
// 加载商品分类
loadProductCategories() {
uni.showLoading({ title: '加载商品分类中...' })
this.$api.sendRequest({
url: '/api/goodscategory/tree',
data: {
level: 2
},
success: (res) => {
uni.hideLoading()
if (res.code == 0 && res.data) {
this.productCategories = res.data
if (res.data.length > 0) {
this.selectCategory(0)
}
} else {
uni.showToast({
title: '获取商品分类失败',
icon: 'none'
})
this.closeProductSelector()
}
},
fail: () => {
uni.hideLoading()
uni.showToast({
title: '网络错误,请稍后重试',
icon: 'none'
})
this.closeProductSelector()
}
})
},
// 选择分类
selectCategory(index) {
this.selectedCategoryIndex = index
const category = this.productCategories[index]
if (category) {
this.loadCategoryProducts(category.id)
}
},
// 加载分类商品
loadCategoryProducts(categoryId) {
this.loadingProducts = true
this.selectedCategoryProducts = []
this.$api.sendRequest({
url: '/api/goods/list',
data: {
category_id: categoryId,
page: 1,
limit: 50
},
success: (res) => {
this.loadingProducts = false
if (res.code == 0 && res.data && res.data.list) {
this.selectedCategoryProducts = res.data.list
} else {
this.selectedCategoryProducts = []
}
},
fail: () => {
this.loadingProducts = false
this.selectedCategoryProducts = []
}
})
},
// 选择商品
selectProductItem(product) {
// 构建商品消息
const productMessage = {
id: ++this.messageId,
role: 'user',
type: 'text',
content: `我想了解以下商品的信息:\n商品名称:${product.goods_name}\n价格:¥${product.price}\n商品ID:${product.id}`,
timestamp: Date.now(),
product: product
}
this.messages.push(productMessage)
this.closeProductSelector()
this.$emit('product-selected', productMessage)
// 触发AI回复
this.sendMessageWithContent(productMessage.content)
},
// 清空聊天记录
clearMessages() {

View File

@@ -257,6 +257,20 @@ export default {
// ========== 初始化页面 ==========
initChat() {
console.log('AI聊天页面初始化');
// 检查是否有从商品分类传递过来的商品信息
const selectedProduct = uni.getStorageSync('selectedProduct')
if (selectedProduct) {
console.log('检测到选择的商品:', selectedProduct)
// 清除存储的商品信息,避免重复发送
uni.removeStorageSync('selectedProduct')
// 延迟发送商品信息,确保聊天组件已经初始化
setTimeout(() => {
this.sendProductToAI(selectedProduct)
}, 500)
}
},
async initNavigation() {
@@ -482,6 +496,20 @@ export default {
onVideoPause(message) {
console.log('视频暂停:', message);
},
sendProductToAI(product) {
if (!this.$refs.chat) {
console.error('聊天组件未初始化')
return
}
const productContent = `我想了解以下商品的详细信息:\n商品名称:${product.goods_name}\n价格:¥${product.price}\n商品ID:${product.goods_id}`
console.log('商品信息已发送到AI客服:', productContent)
// 使用sendMessageWithContent方法发送商品信息
this.$refs.chat.sendMessageWithContent(productContent)
},
onLinkOpen(message) {
uni.showModal({