Feat(云灵AI):首页送礼重构&交互使用模拟数据书写对应逻辑

This commit is contained in:
lifizer
2026-05-28 18:03:38 +08:00
parent 9c6aa2351b
commit 4e0972f38a
5 changed files with 483 additions and 39 deletions
+18
View File
@@ -572,6 +572,24 @@ export default {
createNewHandle() {
uni.setStorageSync('addNewChat', '1')
uni.navigateBack()
},
bottomToolClickHandle(item) {
if (item.giftCardEnabled === 1) {
uni.setStorageSync('addNewChat', '2')
uni.navigateBack()
return
}
if (item.navType === 'prompt') {
this.streamReq({
prompt: item.promptContent,
init: 0
})
}
if (item.navType === 'url') {
uni.navigateTo({
url: item.url
})
}
}
}
}
+9
View File
@@ -66,6 +66,9 @@
lazy-load
/>
</view>
<view class="goods-desc">
相似度99%
</view>
</view>
</view>
</view>
@@ -301,6 +304,12 @@ export default {
align-items: flex-end;
justify-content: space-between;
}
.goods-desc {
padding: 10rpx 14rpx 20rpx 14rpx;
font-size: 24rpx;
color: #999;
line-height: 1;
}
.price-left {
display: flex;
+229 -19
View File
@@ -16,7 +16,7 @@
transparent="auto"
barPlaceholder="hidden"
title="云灵"
@click-left="clickBackHandle"
@click-left="pageContainerBeforeleave"
/>
<page-container
:show="true"
@@ -45,12 +45,12 @@
<view class="focus-guide-wrap">
<view class="guide-left">
<image
:src="webUrl + '/aiChat/logo-01.gif'"
class="avatar"
:src="webUrl + '/aiChat/logo-transition.png'"
class="avatar avatar-bounce"
mode="widthFix"
/>
</view>
<view class="guide-right">
<view v-if="!showGiftSteps" class="guide-right">
<view class="title">{{ settingInfo.helloMessageTitle }}</view>
<view class="content">{{ settingInfo.helloMessageContent }}</view>
</view>
@@ -99,7 +99,7 @@
</swiper-item>
</swiper>
</view> -->
<view class="topic-wrap">
<view v-if="!showGiftSteps" class="topic-wrap">
<view class="title">
<view class="title-left">大家都在问</view>
<view class="title-right" @click="loadData('click')">
@@ -133,6 +133,38 @@
</view>
</view>
</view>
<!-- 在这里实现送礼步骤 -->
<view v-if="showGiftSteps" class="gift-steps-wrap">
<view class="gift-step-title">{{ giftBuyOptions[currentGiftStepIndex].title }}</view>
<view v-if="giftBuyOptions[currentGiftStepIndex].type === 'option_card'" class="gift-options">
<view
v-for="opt in giftBuyOptions[currentGiftStepIndex].options"
:key="opt.id"
class="gift-option-item"
:class="{ active: isGiftOptionSelected(giftBuyOptions[currentGiftStepIndex].id, opt.id) }"
@click="toggleGiftOption(giftBuyOptions[currentGiftStepIndex].id, opt.id)"
>
{{ opt.optionName }}
<image v-if="isGiftOptionSelected(giftBuyOptions[currentGiftStepIndex].id, opt.id)" :src="webUrl + '/aiChat/gift-options-check.png'" class="icon-check" />
</view>
</view>
<view v-if="giftBuyOptions[currentGiftStepIndex].type === 'price_input'" class="gift-price-input">
<view class="input-wrap">
<text class="label">价格预算</text>
<input v-model="giftBudget" placeholder="例如100以内/300~500元" class="input-budget" placeholder-style="color: #ccc;" />
</view>
</view>
<view class="gift-step-actions">
<view class="action-btn-group">
<view v-if="currentGiftStepIndex > 0" class="btn btn-prev" @click="prevGiftStep">上一步</view>
<view class="btn btn-next" :class="{'full-width': currentGiftStepIndex === 0}" @click="nextGiftStep">下一步</view>
</view>
<view class="btn-skip" @click="skipGiftStep">跳过</view>
</view>
</view>
</view>
</block>
<view v-if="chatMessageListLength > 0" class="chat-wrap">
@@ -502,7 +534,7 @@
</view>
<view class="container">
<view
v-if="chatNumber"
v-if="chatNumber || showGiftSteps"
class="new-chat"
@click="createNewHandle"
>
@@ -516,15 +548,18 @@
<view
v-for="(item, index) in bottomTools"
:key="index"
:class="{
'hide': !item.display
}"
class="bottom-tool-item"
@click="bottomToolClickHandle(item)"
>
<image
:src="webUrl + '/aiChat/' + item.icon + '.png'"
:src="item.icon"
class="tool-icon"
mode="widthFix"
/>
{{ item.text }}
{{ item.name }}
</view>
</view>
</view>
@@ -586,19 +621,174 @@ export default {
settingInfo: {},
topicList: [],
onlyOneToAddCart: false,
topicIsRotate: false
topicIsRotate: false,
showGiftSteps: false,
currentGiftStepIndex: 0,
giftSelections: {},
giftBudget: '',
giftBuyOptions: [
{
"id": 1,
"sort": 1,
"title": "礼品是送给谁的呢?",
"type": "option_card",
"status": 1,
"createTime": 1779777608000,
"updateTime": 1779850697000,
"options": [
{
"id": 1,
"configId": 1,
"optionName": "送长辈",
"sort": 1,
"createTime": 1779777924000
},
{
"id": 2,
"configId": 1,
"optionName": "送朋友",
"sort": 2,
"createTime": 1779777924000
},
{
"id": 3,
"configId": 1,
"optionName": "送同事",
"sort": 3,
"createTime": 1779777924000
},
{
"id": 4,
"configId": 1,
"optionName": "送亲戚",
"sort": 4,
"createTime": 1779777924000
},
{
"id": 5,
"configId": 1,
"optionName": "送爱人",
"sort": 5,
"createTime": 1779777924000
},
{
"id": 6,
"configId": 1,
"optionName": "送领导",
"sort": 6,
"createTime": 1779777924000
}
]
},
{
"id": 2,
"sort": 2,
"title": "有什么特别的场合吗?",
"type": "option_card",
"status": 1,
"createTime": 1779777608000,
"updateTime": 1779789421000,
"options": [
{
"id": 11,
"configId": 2,
"optionName": "生日",
"sort": 1,
"createTime": 1779789420000
},
{
"id": 12,
"configId": 2,
"optionName": "节日",
"sort": 2,
"createTime": 1779789420000
},
{
"id": 13,
"configId": 2,
"optionName": "乔迁",
"sort": 3,
"createTime": 1779789420000
},
{
"id": 14,
"configId": 2,
"optionName": "感谢",
"sort": 4,
"createTime": 1779789420000
}
]
},
{
"id": 3,
"sort": 3,
"title": "对礼品类型有什么偏好?",
"type": "option_card",
"status": 1,
"createTime": 1779777608000,
"updateTime": 1779789393000,
"options": [
{
"id": 7,
"configId": 3,
"optionName": "特色礼盒",
"sort": 1,
"createTime": 1779789393000
},
{
"id": 8,
"configId": 3,
"optionName": "商务",
"sort": 2,
"createTime": 1779789393000
},
{
"id": 9,
"configId": 3,
"optionName": "茶叶",
"sort": 3,
"createTime": 1779789393000
},
{
"id": 10,
"configId": 3,
"optionName": "精美实惠",
"sort": 4,
"createTime": 1779789393000
}
]
},
{
"id": 4,
"sort": 4,
"title": "预算大概在什么范围?",
"type": "price_input",
"status": 1,
"createTime": 1779777608000,
"updateTime": 1779777608000,
"options": []
}
]
}
},
onLoad(options) {
this.cityName = options.cityName || ''
},
onShow() {
const addNewChat = uni.getStorageSync('addNewChat') === '1'
// 1-新对话,2-我要送礼
const addNewChat = uni.getStorageSync('addNewChat') || ''
// 从历史界面点击新增对话
if (addNewChat && this.chatNumber) {
console.log(addNewChat)
if (addNewChat) {
if (addNewChat === '1' && (this.chatNumber || this.showGiftSteps)) {
this.createNewHandle()
}
if (addNewChat === '2') {
const giftOptionItem = this.bottomTools.find((i) => i.type === 'gift')
if (giftOptionItem) {
this.bottomToolClickHandle(giftOptionItem)
}
}
uni.removeStorageSync('addNewChat')
this.createNewHandle()
}
},
methods: {
@@ -643,13 +833,12 @@ export default {
})
},
// 创建新会话
createNewHandle() {
createNewHandle(type = '') {
this.closeAttrWindow()
if (this.audioContext) {
this.audioContext.stop()
}
wx.getBackgroundAudioManager().stop()
if (!this.chatNumber) return
this.closeWsFn()
this.chatNumber = ''
this.showCursor = false
@@ -657,9 +846,17 @@ export default {
this.getConfigLoading = false
this.chatMessageList = []
this.loadData()
if (type !== 'giftChat') {
const idx = this.bottomTools.findIndex((i) => i.giftCardEnabled === 1)
this.$set(this, 'showGiftSteps', false)
if (idx > -1) {
this.$set(this.bottomTools[idx], 'display', true)
}
}
},
/*
clickBackHandle() {
if (!this.chatNumber) {
if (!this.chatNumber && !this.showGiftSteps) {
if (getCurrentPages().length > 1) {
uni.navigateBack()
} else {
@@ -671,8 +868,9 @@ export default {
this.createNewHandle()
}
},
*/
pageContainerBeforeleave() {
if (!this.chatNumber) {
if (!this.chatNumber && !this.showGiftSteps) {
if (getCurrentPages().length > 1) {
uni.navigateBack()
} else {
@@ -737,8 +935,10 @@ export default {
.guide-left {
.avatar {
display: block;
width: 230rpx;
height: 404rpx;
width: 430rpx;
}
.avatar-bounce {
animation: bounce 2s infinite ease-in-out;
}
}
.guide-right {
@@ -822,4 +1022,14 @@ export default {
transform: translateX(-50%);
}
}
@keyframes bounce {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-20rpx);
}
}
</style>