feat: 快速预定的组件调试

pages/booking/QuickBookingComponent.vue

@@ -0,0 +1,50 @@
+<template>
+	<view class="container">
+		<view class="calendar"></view>
+		
+		<view v-for="item in commodityGroupDTOList" :key="item.title">
+			
+			<QuickBookingContentList :commodityGroupDTO="item" />
+		</view>
+		
+	</view>
+</template>
+
+<script setup>
+	import QuickBookingContentList from './QuickBookingContentList.vue'
+	import { defineProps, ref } from 'vue'
+	import { onMounted } from 'vue'
+	import { quickBookingComponent } from '../../request/api/QuickBookingComponent'
+	
+	const commodityGroupDTOList = ref([])
+
+	const loadQuickBookingComponent = async () => {
+		const res = await quickBookingComponent('2025-07-29')
+		if(res.code === 0 && res.data) {
+			commodityGroupDTOList.value = res.data.commodityGroupDTOList
+		}
+		console.log(res)
+	}
+
+	onMounted(() => {
+		console.log('=============')
+		loadQuickBookingComponent()
+	})
+	
+</script>
+
+<style scoped lang="scss">
+	.container {
+		width: 100%;
+		flex: 1;
+		
+		.calendar {
+			width: 100%;
+			height: 58px;
+			background-color: rgba(140,236,255,0.24);	
+		}
+		
+		
+		
+	}
+</style>

pages/booking/QuickBookingContentList.vue

@@ -0,0 +1,92 @@
+<template>
+	<view class="container">
+		<view class="mk-title">
+			<text class="title"> {{ commodityDTO.title }}</text>
+		    <image class="wave" src="@/static/wave_icon.png" mode="widthFix"/>
+		</view>
+		<view class="container-scroll">
+			<view class="mk-card-item" v-for="(item, index) in commodityDTO.commodityList" :key="item.commodityName">
+				<image :src="item.commodityIcon" mode="widthFix"></image>
+				<text>{{ item.commodityName }}</text>
+				<view></view>
+				<text>·往返观光车票</text>
+				<text>·营业时间：9:00—22:00</text>
+				<view>
+					<text>￥120/人</text>
+					<text> 下单</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { defineProps } from 'vue'
+	const props = defineProps({
+		commodityDTO: {
+			type: Object,
+			default: {}
+		}
+	})
+
+</script>
+
+<style lang="scss" scoped>
+	.container {		
+		.mk-title {
+			padding: 4px 0;
+			display: inline-block;
+			position: relative;
+			.title {
+				font-weight: 400;
+				font-size: 16px;
+				color: #000000;
+				z-index: 2;
+				position: relative;
+			}
+			.wave {
+				position: absolute;
+				bottom: 2px;
+				left: 0;
+				width: 100%;
+				z-index: 1;
+			}
+		}
+		
+		.container-scroll {
+			display: flex;
+			flex-direction: row;
+			overflow-x: auto;
+			margin-top: 4px;
+			
+			/* 隐藏滚动条 */
+			scrollbar-width: none; 
+			&::-webkit-scrollbar {
+			  display: none; 
+			}
+			
+			.mk-card-item {
+				display: flex;
+				flex-direction: column;
+				align-items: start;
+				width: 188px;
+				height: 244px;
+				background-color: #ffffff;
+				border-radius: 10px;
+				margin-right: 8px;
+				
+				image {
+					width: 188px;
+					height: 112px;
+				}
+				text {
+					padding: 12px;
+					text-align: center;
+					font-weight: 500;
+					font-size: 12px;
+					color: #333333;
+				}
+			}
+		}
+	}
+</style>

pages/chat/ChatMainList.vue

@@ -26,8 +26,11 @@
 			
 			  <view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">				  
 				  <template v-if="item.msgType === MessageRole.AI">
-					  <ChatCardAI class="message-item-ai" :text="item.msg">
+						<ChatCardAI class="message-item-ai" :text="item.msg">
-					  </ChatCardAI>			  
+							<template v-if="item.toolCall">								
+								<QuickBookingComponent v-if="item.toolCall.componentName === 'createWorkOrderCard'" />
+							</template>
+						</ChatCardAI>			  
 				  </template>
 				  
 				  <template v-else-if="item.msgType === MessageRole.ME">
@@ -78,6 +81,7 @@
 	import ChatMoreTips from './ChatMoreTips.vue';
 	import ChatInputArea from './ChatInputArea.vue'
 	import CommandWrapper from '@/components/CommandWrapper/index.vue'
+	import QuickBookingComponent from '../booking/QuickBookingComponent.vue'
 
 	import { MessageRole, MessageType } from '../../model/ChatModel';
 	
@@ -349,12 +353,22 @@
 						loadingTimer = null;
 		                isTyping = false;
 						typeWriterTimer = null;
-		                // 补全：如果消息内容还停留在'加载中.'或为空，则给出友好提示
+		                
-		                const msg = chatMsgList.value[aiMsgIndex].msg;
+						// 补全：如果消息内容还停留在'加载中.'或为空，则给出友好提示
+						const msg = chatMsgList.value[aiMsgIndex].msg;
 						console.log('msg:', msg)
-		                if (!msg || msg === '加载中.' || msg.startsWith('加载中')) {
+						if (!msg || msg === '加载中.' || msg.startsWith('加载中')) {
-		                    chatMsgList.value[aiMsgIndex].msg = '未获取到内容，请重试';
+							chatMsgList.value[aiMsgIndex].msg = '未获取到内容，请重试';
-		                }
+							if(chunk.toolCall) {
+								chatMsgList.value[aiMsgIndex].msg = '';
+							}
+						}
+						
+						if(chunk.toolCall) {
+							console.log('chunk.toolCall:', chunk.toolCall)
+							chatMsgList.value[aiMsgIndex].toolCall = chunk.toolCall
+						}
+						
 		                isSessionActive = false;
 		                scrollToBottom();
 		            }

pages/chat/ChatTopWelcome.vue

@@ -4,7 +4,7 @@
 			<!-- :style="backgroundStyle" -->
 			<view class="top-item1-left">
 				<image :src="initPageImages.welcomeImageUrl"></image>
-				<text>{{ currentDate }} 多云 -3～6℃ ff </text>						  
+				<text>{{ currentDate }} 多云 -3～6℃ ccc </text>						  
 			</view>
 			<view class="top-item1-right">
 				<image :src="initPageImages.logoImageUrl"></image>

request/api/QuickBookingComponent.js

@@ -1,7 +1,8 @@
 import request from "../base/request";
 
-function quickBookingComponent() {
+function quickBookingComponent(selectedData) {
-	return request.post('/mainScene/quickBookingComponent');
+	const args = { selectedData: selectedData }
+	return request.post('/hotelBiz/mainScene/quickBookingComponent', args);
 }
 
 export { quickBookingComponent }