<template>
	<view class="index-dialog-page">
		<!-- <MarkdownPreview/> -->
		<view class="top-bg"></view>
		<view class="bot-bg"></view>
		<scroll-view class="index-dialog-body" :scroll-y="true" upper-threshold="0" refresher-enabled="true"
			refresher-default-style="none" @refresherrefresh="scrolltolower">
			<view class="body-title">
				<!-- <uv-icon class="arrow-icon" name="arrow-left" @click="common.navigateBack()"/> -->
				AI问答演示
			</view>

			<view class="ai-info">
				<!-- <image src="@/static/images/dialog/pet-3.png" alt="" class="image-pet-bg"></image> -->
				<image src="@/static/images/dialog/pet-bg-base.png" alt="" class="image-pet-bg"></image>
				<image :src="userInfo?.mascotInfo?.imgAddr || ''" alt="" class="image-pet" mode="widthFix"></image>
				<view class="ai-info-bg-box">
					<view class="hello-text">{{ userInfo ? 'Hi，我是' + userInfo?.mascotInfo?.mascotName : 'Hi' }}</view>
					<view class="info-text">工作学习，我都能帮你！</view>
					<view class="info-btn">试试他的能力</view>
				</view>
			</view>
			<!-- <view class="questions-view">
				<scroll-view :scroll-x="true" :show-scrollbar="false">
					<view class="question-row">
						<view
							class="question-item"
							v-for="item in Math.ceil(questionList.length / 2)"
							@click="sendText(questionList[item - 1].hotContent)"
						>
							{{ questionList[item - 1].hotContent }}
						</view>
					</view>
					<view class="question-row">
						<view
							class="question-item"
							v-for="item in questionList.length - Math.ceil(questionList.length / 2)"
							@click="sendText(questionList[item + Math.ceil(questionList.length / 2) - 1].hotContent)"
						>
							{{ questionList[item + Math.ceil(questionList.length / 2) - 1].hotContent }}
						</view>
					</view>
				</scroll-view>
			</view> -->
			<view class="talking-list">
				<scroll-view class="talking-scroll-list" :scroll-y="true" :scroll-top="scrollTop" :show-scrollbar="false"
					:scroll-with-animation="false">
					<TalkingItem v-for="(item, index) in talkingList" :talkingType="item.type" :talkingInfo="item"
						:isLast="index + 1 === talkingList.length" :isAnswering="!answerIsOver"
						:activeVoiceId="activeVoiceTalkingItemId" @handleEvents="talkItemEvents"></TalkingItem>
				</scroll-view>
			</view>
			<TouchBtn class="talk-btns" @uploadVoice="uploadRecordNow" @submitAnswer="submitAnswerNow" formatType="wav"
				@startRecord="startRecordCallback" :loadingText="sendLoadingText" :isLoading="!answerIsOver"
				:adjustPosition="true" :isDisabled="isHistory" />
		</scroll-view>
	</view>

	<!-- 水印组件 -->
	<watermark ref="watermarkRef"></watermark>
</template>

<script setup>
	import {
		ref,
		unref,
		onMounted,
		watch,
		nextTick,
		computed,
		onActivated
	} from 'vue';
	import common from '@/common/common';
	import {
		setupKeyboardHeightListener
	} from '@/common/common';
	import TouchBtn from '@/pages/course/components/touchBtn.vue';
	import TalkingItem from './components/talking-item.vue';
	import {
		useSocketStore
	} from '@/store/socket.js';
	import {
		useStorageStore
	} from '@/store/storage.js';
	import {
		storeToRefs
	} from 'pinia';
	import {
		onLoad,
		onShow,
		onUnload,
		onHide,
		onBackPress
	} from '@dcloudio/uni-app';
	import {
		get_base_url,
		goto_login_fun
	} from '@/api/request';
	import {
		getUserInfo,
		getPhoneEnvBool
	} from '@/common/common';
	import {
		commonUploadVoiceFile
	} from '@/api/common.js';
	import {
		queryHotQuestionApi,
		insertTraAskFeedback,
		queryAskHisByBatchIdPaging,
		updateLikeStat,
		updateDownvoteStat,
		chatVoice
	} from '@/api/dialog.js';

	const {
		statusBarHeight
	} = uni.getWindowInfo();

	const pageTopPadding = computed(() => statusBarHeight + 'px');

	const socketStore = useSocketStore();
	const {
		SocketObj
	} = storeToRefs(socketStore);

	const feedbackRef = ref();
	const watermarkRef = ref();
	const userInfo = ref(getUserInfo());
	const userParams = '/' + (unref(userInfo)?.userName ?? '') + ' ' + (unref(userInfo)?.loginName ?? '');
	const questionList = ref([
		// '对公小程序开户流程？',
		// '厅堂服务经理2025年管理办法？',
		// '厅堂服务经理2025年考核表单？',
		// '吉林银行重要空白凭证调微业务操作规程？',
		// '协助有权机关查询冻结扣划业务操作规程？',
		// '柜面个人账户操作规程？',
		// '久悬未取款账户如何办理销户？',
		// '境外来华人员个人账户业务开户如何办理？',
		// '营业机构日间管理风险防控要点有哪些？',
		// '现金管理平台柜面业务操作？'
	]);
	const scrollBoxRef = ref();
	const scrollTop = ref(99999);
	const scrollToBottomNow = (time = 100) => {
		nextTick(() => {
			setTimeout(() => {
				scrollTop.value += 100;
				scrollTop.value += 100;
			}, time);
		});
	};
	const isHistory = ref(false);
	const activeVoiceTalkingItemId = ref('');
	// ws 初始化逻辑
	const reconnectTimer = null; // 重连timer
	const isManualClose = ref(false); // 是否手动关闭
	const reqBatch = ref('');
	const seqNo = ref('');
	const mascotId = computed(() => {
		return unref(userInfo)?.mascotInfo?.mascotId || 'Tst00001';
	});
	const answerText = ref('');
	const answerFileList = ref('');
	const answerIsOver = ref(true);
	const talkingList = ref([
		// {
		// 					type: 'answer',
		// 					isLoading: false,
		// 					id: 1 + 'loading',
		// 					talkingText: '是否手动关闭',
		// 					talkingVoice: 'askData.value.talkingVoice'
		// 				}

	]);

	const createNewDialog = () => {
		if (talkingList.value.length === 0) {
			common.msg('已经是最新对话');
		}
		common.redirectTo(`/pages/index/dialog`);
	};
	const showModelComfirm = ref(false);
	const reconcatNum = ref(1);
	const initsocketTask = () => {
		isHistory.value = false;
		socketStore.creatSocket('/traask/asksocket/open?summary=');
		unref(SocketObj).on('error', () => {
			if (watchFlag.value === 1 || showModelComfirm.value) return;
			if (reconcatNum.value === 5) {
				common.msg('系统网络异常，请稍后再试！');
				return;
			}
			showModelComfirm.value = true;
			common
				.show('提示信息', '网络环境不稳定，请重试！', false, '', '确认')
				.then((res) => {
					reconcatNum.value += 1;
					common.redirectTo(`/pages/index/dialog`);
				})
				.finally(() => {
					showModelComfirm.value = false;
				});
		});
		unref(SocketObj).on('message', (res) => {
			const {
				rtnCode,
				body,
				commond
			} = JSON.parse(res.data);
			let _id = new Date().getTime() + 'id';
			if (rtnCode === '0000') {
				if (commond === 'ASK-OPEN') {
					if (!answerIsOver.value) {
						// 问题没完成， 重新尝试回答
						sendMessage({
							commond: 'ASK-RE-START',
							body: {
								reqBatch: reqBatch.value,
								seqNo: seqNo.value,
								answerContent: answerText.value
							}
						});
					} else {
						// 新连接
						sendMessage({
							commond: 'ASK-START',
							body: {
								mascotId: mascotId.value,
								deviceImei: ''
							}
						});
					}
					return;
				}
				if (commond === 'ASK-START') {
					// console.log('开启对话！')
					reqBatch.value = body.reqBatch;
					return;
				}
				if (commond === 'ASK') {
					console.log('发送问题成功！');
					if (talkingList.value.length > 0 && talkingList.value[talkingList.value.length - 1].isLoading) {
						talkingList.value.pop();
					}
					seqNo.value = body.seqNo;
					touchBtnCallBack.value && touchBtnCallBack.value();
					touchBtnCallBack.value = null;
					talkingList.value.push({
						type: 'question',
						talkingText: body.intrctContent,
						isLoading: false,
						id: _id,
						...body,
						talkingVoice: askData.value.talkingVoice
					});
					talkingList.value.push({
						type: 'answer',
						isLoading: true,
						id: _id + 'loading'
					});
					scrollToBottomNow();
					return;
				}
				if (commond === 'ASK-STOP') {
					console.log('停止回答标记!');
					stopAnswerCallBack.value && stopAnswerCallBack.value(askData.value);
					setTimeout(() => {
						stopAnswerCallBack.value = null;
						answerIsOver.value = true;
					}, 10);
					return;
				}
				if (commond === 'ASK-ANSWER') {
					if (body.event === 'start') {
						console.log('开始回答！');
						answerIsOver.value = false;
						answerText.value = '';
						talkingList.value.pop();
						talkingList.value.push({
							type: 'answer',
							talkingText: answerText.value,
							isLoading: false,
							id: _id,
							...body,
							askData: {
								...askData.value
							},
							talkingFiles: [],
							talkingCrsList: []
						});
					} else if (body.event === 'token') {
						answerIsOver.value = false;
						answerText.value += body.data;
					} else if (body.event === 'end') {
						console.log('完成回答！');
						answerIsOver.value = true;
					} else if (body.event === 'sourceDocuments') {
						console.log('回答返回文件列表！');
						console.log('body: ', body);
						if (talkingList.value.length === 0) return;
						let _data = body.data;
						talkingList.value[talkingList.value.length - 1].talkingFiles = _data.knowledgeList || [];
						talkingList.value[talkingList.value.length - 1].talkingCrsList = _data.crsList || [];
					}
					return;
				}
				if (commond === 'ASK-RE-ANSWER') {
					// console.log('开始继续回答！')
					if (body.event === 'start') {
						answerIsOver.value = false;
						answerText.value = '';
					} else if (body.event === 'token') {
						answerIsOver.value = false;
						answerText.value = body.data;
					} else if (body.event === 'end') {
						answerIsOver.value = true;
					}
					return;
				}

				if (commond === 'ASK-ERR') {
					console.log('提问失败，系统异常！');
					return;
				}
			} else {
				if (['0005', 'QQ0005'].includes(res.rtnCode)) {
					goto_login_fun();
				}
			}
		});
		watchFlag.value += 1;
	};
	const sendLoadingText = ref('问题回答中，请在问题回答结束后重试！');
	const sendMessage = (data) => {
		touchBtnCallBack.value && touchBtnCallBack.value();
		touchBtnCallBack.value = null;
		let _id = new Date().getTime() + 'id';
		talkingList.value.push({
			type: 'question',
			talkingText: data.body.intrctContent,
			isLoading: false,
			...data.body,
			id: _id + 'q',
			talkingVoice: askData.value.talkingVoice || ''
		});
		talkingList.value.push({
			type: 'answer',
			isLoading: true,
			id: _id + 'loading'
		});
		scrollToBottomNow()
		chatVoice({
			chatVoice: data.body.intrctContent,
			asrTime: data.body.asrTime || 0
		}).then(res => {
			talkingList.value.pop()
			talkingList.value.push({
				type: 'answer',
				talkingText: res.body.aiContent,
				isLoading: false,
				id: _id + 'a',
				talkingFiles: [],
				talkingCrsList: [],
				talkingVoice: '',
				talkingVoiceId: res.body.fileId,
				...res.body
			});
			scrollToBottomNow()
		})

	};
	watch(
		() => answerText.value,
		(val) => {
			if (val) {
				changeText(val);
				scrollToBottomNow();
			}
		}
	);

	const changeText = () => {
		if (talkingList.value.length === 0) return;
		talkingList.value[talkingList.value.length - 1].talkingText = answerText.value;
	};

	const stopAnswerCallBack = ref(null);
	const talkItemEvents = ({
		type,
		data,
		id,
		info = {}
	}) => {
		switch (type) {
			case 'reAnswer':
				console.log('重新提问回答');
				// 停止获取
				sendMessage({
					commond: 'ASK-STOP',
					body: {
						reqBatch: reqBatch.value,
						seqNo: seqNo.value
					}
				});
				sendMessage({
					commond: 'ASK',
					body: data.askData
				});
				// // 设置停止回调
				// stopAnswerCallBack.value = ($data) => {
				// 	sendMessage({
				// 		"commond": 'ASK',
				// 		"body": $data
				// 	})
				// }
				break;
			case 'stop':
				console.log('停止获取数据');
				stopAnswerCallBack.value = null;
				// ASK-STOP
				sendMessage({
					commond: 'ASK-STOP',
					body: {
						reqBatch: reqBatch.value,
						seqNo: seqNo.value
					}
				});
				break;
			case 'changePlay':
				activeVoiceTalkingItemId.value = id;
				break;
			case 'feedback':
				let _feedstatus = data.downvoteStat === 'Y' ? 'N' : 'Y';
				let _feedid = data.seqNo || data.askId;
				if (_feedstatus === 'N') {
					updateDownvoteStat({
						askId: _feedid,
						stat: _feedstatus
					}).then((res) => {
						talkingList.value.forEach((t) => {
							if (t.seqNo === _feedid || t.askId === _feedid) {
								t.downvoteStat = 'N';
							}
						});
					});
				} else {
					feedbackRef.value.open(data);
				}
				break;
			case 'great':
				let _status = data.likeStat === 'Y' ? 'N' : 'Y';
				let _id = data.seqNo || data.askId;
				updateLikeStat({
					askId: _id,
					stat: _status
				}).then((res) => {
					talkingList.value.forEach((t) => {
						if (t.seqNo === _id || t.askId === _id) {
							t.likeStat = _status;
							if (_status === 'Y') {
								t.downvoteStat = 'N';
							}
						}
					});
				});
				break;
			case 'preview':
				common.navigateTo('/pages/index/preview?fileId=' + info.docId);
				// if (getPhoneEnvBool('AND')) {
				// 	common.navigateTo('/pages/index/preview?fileId=' + info.docId);
				// } else {
				// 	const base_url = get_base_url('/traask/traFilePreview/');
				// 	let fileUrl = base_url + '/traask/traFilePreview/' + info.docId + userParams;
				// 	const localFilePath = '_doc/pdf_view/' + info.docName + '.pdf';
				// 	downloadAndSaveAvatar(fileUrl, localFilePath).then((res) => {
				// 		uni.openDocument({
				// 			filePath: res,
				// 			showMenu: true,
				// 			success: function() {
				// 				console.log('打开文档成功');
				// 			}
				// 		});
				// 	});
				// }
				break;
			case 'toCourse':
				console.log(type, data, id);
				break;
			default:
				break;
		}
	};
	const downloadAndSaveAvatar = async (fileUrl, localFilePath) => {
		try {
			//#ifdef APP-PLUS
			return new Promise((resolve, reject) => {
				console.log('开始下载:', fileUrl);
				const dtask = plus.downloader.createDownload(
					fileUrl, {
						filename: localFilePath
					},
					(d, status) => {
						if (status === 200) {
							console.log('保存路径：', d.filename);
							resolve(d.filename);
						} else {
							console.error('文件下载失败：', status);
							reject(new Error(`下载失败，状态码: ${status}`));
						}
					}
				);
				dtask.start();
			});
			// #endif
			//#ifdef H5
			return new Promise((resolve, reject) => {
				resolve();
			});
			// #endif
		} catch (error) {
			console.error('创建目录失败:', error);
			throw error;
		}
	};
	const feedbackAnswer = (params) => {
		talkingList.value.forEach((t) => {
			if (t.seqNo === params.askId) {
				t.downvoteStat = 'Y';
				t.likeStat = 'N';
			}
		});
	};
	const historyRef = ref(null);
	const showMenuList = ref(false);
	const showHistory = () => {
		showMenuList.value = false;
		historyRef.value.open();
	};
	const toMessage = () => {
		showMenuList.value = false;
		common.navigateTo('/pages/messageNotification/index');
	};
	const toMePage = () => {
		showMenuList.value = false;
		common.switchTab('/pages/me/index');
	};

	const showHistoryDetail = (item) => {
		isHistory.value = true;
		queryAskHisByBatchIdPaging({
			batchId: item.reqBatch,
			page: 1,
			limit: 100
		}).then((res) => {
			console.log(res);

			talkingList.value = (res.body || []).map((t, index) => {
				let _text;
				let _talkingCrsList;
				let _talkingFiles;
				if (t.chatRole === 'TCH') {
					_text = t.respContentVo?.messageBuileder || '';
					_talkingCrsList = t.respContentVo?.resultMap?.crsList || [];
					_talkingFiles = t.respContentVo?.resultMap?.knowledgeList || [];
				} else {
					_text = t.respContent;
				}
				return {
					type: t.chatRole === 'TCH' ? 'answer' : 'question',
					talkingText: _text,
					isLoading: false,
					askId: t.askId,
					seqNo: t.askId,
					id: t.askId + index,
					talkingVoice: '',
					reqBatch: item.reqBatch,
					intrctWay: '01', //01-文本；02-语音；03-图片
					intrctContent: _text,
					bucketKey: '',
					downvoteStat: t.downvoteStat,
					likeStat: t.likeStat,
					talkingCrsList: _talkingCrsList,
					talkingFiles: _talkingFiles,
					isHistory: true
				};
			});
			historyRef.value.close();
		});
	};

	const touchBtnCallBack = ref(null);
	const askData = ref({});
	const sendText = (item) => {
		submitAnswerNow(item);
	};
	// 发送语音
	const uploadRecordNow = (voicePath) => {
		// /traask/traAskchat/voiceTrans
		//#ifndef APP-PLUS
		// h5 假数据
		// #endif
		//#ifdef APP-PLUS
		talkingList.value.push({
			type: 'question',
			talkingText: '',
			isLoading: true
		});
		scrollToBottomNow();
		commonUploadVoiceFile(voicePath, '/traask/traTestchat/voiceTrans', {})
			.then((_res) => {
				console.log(_res)
				if (!!(_res.body.transContent || '').trim()) {
					talkingList.value.pop();
					askData.value = {
						reqBatch: reqBatch.value,
						intrctWay: '02', //01-文本；02-语音；03-图片
						intrctContent: _res.body.transContent,
						bucketKey: _res.body.fileId,
						ossFileAddr: _res.body.ossFileAddr,
						talkingVoice: voicePath,
						asrTime: _res.body.asrTime || 1000
					};
					sendMessage({
						commond: 'ASK',
						body: askData.value
					});
				} else {
					talkingList.value.pop();
					uni.showToast({
						title: '未识别到文字',
						icon: 'none',
						duration: 1000
					});
				}
			})
			.catch((err) => {
				talkingList.value.pop();
				uni.showToast({
					title: '系统异常，请联系管理员',
					icon: 'none',
					duration: 1000
				});
			});
		// #endif
	};
	// 发送文本
	const submitAnswerNow = (val, cb = null) => {
		if (!answerIsOver.value) {
			// 问题回答中
			return;
		}
		touchBtnCallBack.value = cb;
		askData.value = {
			reqBatch: reqBatch.value,
			intrctWay: '01', //01-文本；02-语音；03-图片
			intrctContent: val,
			bucketKey: ''
		};
		sendMessage({
			commond: 'ASK',
			body: askData.value
		});
	};
	const startRecordCallback = () => {
		// 开始录音回调
	};
	const watchFlag = ref(1);

	const scrolltolower = () => {
		common.navigateBack();
	};

	const getQuestionList = () => {
		queryHotQuestionApi().then((res) => {
			console.log(res);
			questionList.value = res.body
				.map((t) => {
					return {
						...t,
						hotContent: t.refineContent
					};
				})
				.filter((t) => t.refineContent);
		});
	};
	const loadData = async () => {
		userInfo.value = getUserInfo();
		// getQuestionList();
		// initsocketTask();
	};
	onLoad(() => {
		changeAppHeightBottom();
		if (!common.isLogin()) {
			common.navigateTo('/pages/login/login');
			return;
		}
		// 判断下如果没有设置吉祥物就跳转到吉祥物页面
		if (userInfo.value?.mascotInfo.mascotId === null) {
			//说明这人在上次选吉祥物的时候退出了，没有选到吉祥物
			common.redirectTo('/pages/mascot/mascot_select_list');
			return;
		}
		loadData();
	});
	const previewRef = ref();
	const previewFileRef = ref();
	const showPreview = ref(false);
	onMounted(() => {
		// previewFileRef.value.open({
		// 	fileId: '0006e7f7-a332-4c81-9802-ac4e2d971c71'
		// })
	});

	const refreshData = () => {
		loadData();
	};

	const keyboardHeight = ref('0px');
	const setHeight = (res) => {
		keyboardHeight.value = (res.height || 0) + 'px';
	};
	const keyBoardIsHide = computed(() => {
		return parseInt(keyboardHeight.value) == 0;
	});
	const bottomHeight = ref('0px');
	const totalBotHeight = computed(() => {
		return keyBoardIsHide.value ? 0 + 'px' : parseInt(keyboardHeight.value) - parseInt(bottomHeight.value) + 'px';
	});
	const changeAppHeightBottom = (height) => {
		//#ifdef APP-PLUS
		// 获取系统信息
		const systemInfo = uni.getSystemInfoSync();
		// 计算安全区域底部高度
		bottomHeight.value = systemInfo.screenHeight - systemInfo.safeArea.bottom + 'px';
		// #endif
	};

	const deleteFolder = () => {
		//#ifdef APP-PLUS
		plus.io.resolveLocalFileSystemURL('_doc/pdf_view', function(entry) {
			console.log('entry', entry);
			entry.removeRecursively(function(res) {
				console.log('删除成功');
			});
		});
		// #endif
	};

	onUnload(() => {
		watchFlag.value = 1;
	});
	defineExpose({
		refreshData
	});
</script>

<style scoped lang="scss">
	.index-dialog-page {
		position: relative;
		display: flex;
		flex-direction: column;
		height: 100vh;
		overflow: hidden;
	}

	.top-bg {
		background: linear-gradient(0deg, rgba(234, 246, 255, 0) 0%, #e6eafd 100%);
		height: 480rpx;
		width: 100%;
	}

	.bot-bg {
		// background-color: #F6F8FF;
		background: linear-gradient(136deg, rgba(234, 246, 255, 0) 0%, #fff 100%);
		width: 100%;
		flex: 1;
	}

	.index-dialog-body {
		position: absolute;
		overflow: hidden;
		height: calc(100% - v-bind(totalBotHeight));
		width: 100%;
		padding: 0;
		bottom: 0;
		left: 0;
		box-sizing: border-box;
		padding-top: v-bind(pageTopPadding);
		// padding-bottom: v-bind(bottomHeight);
		// display: flex;
		// flex-direction: column;

		.body-title {
			height: 90rpx;
			text-align: center;
			font-size: 33rpx;
			padding-top: 20rpx;

			line-height: 46rpx;
			box-sizing: border-box;
			font-weight: 500;
			color: #000;
			position: relative;

			// margin-bottom: 23rpx;
			.arrow-icon {
				position: absolute;
				left: 36rpx;
				top: 30rpx;
				color: #000;
			}
		}

		.seek-setting {
			position: absolute;
			z-index: 13;
			right: 45rpx;
			top: 8rpx;
			font-size: 26rpx;
			width: 140rpx;
			height: 52rpx;
			padding: 10rpx 0;
			// overflow: hidden;
			line-height: 32rpx;
			text-align: right;
			padding-right: 48rpx;

			.more-list {
				position: absolute;
				top: 100%;
				right: 0;
				width: 100rpx;
				text-align: center;
				background-color: #fff;
				border-radius: 12rpx;
				padding: 16rpx 0;
				display: none;
				z-index: 21;

				&.show {
					display: block;
				}

				.more-item {
					line-height: 60rpx;
					font-size: 29rpx;
					color: #333;
					position: relative;
					z-index: 22;
				}
			}

			.image-icon {
				width: 30rpx;
				height: 32rpx;
				position: absolute;
				right: 0;
				top: 10rpx;
			}

			.image-icon-new {
				right: 50rpx;
				width: 30rpx;
				height: 32rpx;
				position: absolute;
				top: 10rpx;
			}
		}

		.ai-info {
			padding: 0 24rpx;
			height: 250rpx;
			overflow: hidden;
			padding-top: 72rpx;
			margin-bottom: 24rpx;
			position: relative;
			box-sizing: border-box;

			.image-pet {
				width: 230rpx;
				// height: 235rpx;
				position: absolute;
				right: 24rpx;
				top: -20rpx;
				z-index: 2;
			}

			.image-pet-bg {
				position: absolute;
				padding: 0 24rpx;
				box-sizing: border-box;
				width: 100%;
				height: 230rpx;
				left: 0;
				bottom: 0;
				z-index: 2;
			}

			.ai-info-bg-box {
				position: absolute;
				z-index: 3;
				left: 0;
				top: 68rpx;
				width: 100%;
				// background-color: #ccc;
				padding: 0 64rpx;
				height: 178rpx;

				.hello-text {
					height: 54rpx;
					line-height: 44rpx;
					font-size: 28rpx;
					color: #666;
				}

				.info-text {
					height: 44rpx;
					line-height: 44rpx;
					font-size: 32rpx;
					color: #000;
					font-weight: 600;
				}

				.info-btn {
					width: 220rpx;
					font-size: 29rpx;
					height: 54rpx;
					color: #fff;
					background: linear-gradient(104deg, #5547f3 0%, #4e86f4 100%);
					line-height: 54rpx;
					text-align: center;
					border-radius: 15rpx 15rpx 0 0;
					position: absolute;
					left: 68rpx;
					bottom: 0;
				}
			}
		}

		.questions-view {
			padding-left: 24rpx;
			padding-right: 24rpx;
			height: 184rpx;
			box-sizing: border-box;

			.question-row {
				white-space: nowrap;
				margin-bottom: 16rpx;
			}

			.question-item {
				white-space: nowrap;
				height: 66rpx;
				line-height: 66rpx;
				background-color: #fff;
				border: 2rpx solid #e0dede;
				padding: 0 16rpx;
				border-radius: 11rpx;
				margin-right: 16rpx;
				display: inline-block;
				font-size: 26rpx;

				&:last-child {
					margin-right: 0;
				}
			}
		}

		.router-list {
			height: 84rpx;
			padding: 20rpx 30rpx 0;
			background-color: #fff;
			border-radius: 15rpx 15rpx 0 0;
			white-space: nowrap;
			box-sizing: border-box;

			.btns-item {
				display: inline-block;
				box-sizing: border-box;
				height: 62rpx;
				border: 2rpx solid #e0dede;
				border-radius: 15rpx;
				margin-right: 16rpx;
				padding: 0 20rpx 0 64rpx;
				line-height: 58rpx;
				font-size: 29rpx;
				position: relative;

				.image-icon {
					position: absolute;
					width: 31rpx;
					height: 31rpx;
					top: 50%;
					transform: translateY(-50%);
					left: 24rpx;
				}

				&:last-child {
					margin-right: 0;
				}
			}
		}

		.talking-list {
			height: calc(100% - 514rpx);
			padding: 12rpx 24rpx;
			box-sizing: border-box;

			.talking-scroll-list {
				height: 100%;
			}
		}
	}

	// .talking-list {
	// 	height: calc(100% - 832rpx);
	// 	padding: 12rpx 24rpx;
	// 	box-sizing: border-box;

	// 	.talking-scroll-list {
	// 		height: 100%;
	// 	}
	// }
</style>