WI/Web.V1.0.git

			@@ -8,26 +8,29 @@
			</div>
			<div class="cursor-pointer">
			<span class="mr-1 changeBatch" @click="batchChange">换一批</span>
			<i class="iconfont icon-shuaxin"></i>
			<i class="myiconfont icon-shuaxin"></i>
			</div>
			</div>

			<div class="main">
			<div
			class="main_item flex items-center cursor-pointer"
			v-for="(item, index) in state.exampleContent"
			:key="index"
			:class="{ main_item_active: item.sample_id === activeSampleId }"
			@click="changeExample(item)"
			>
			<div class="left flex items-center justify-center" :class="['color' + index]">
			<img :src="item.Icon" alt="" />
			</div>
			<div class="right">
			<h4>{{ item.sample_title }}</h4>
			<p>{{ item.sample_question }}</p>
			</div>
			</div>
			<el-carousel height="80" :interval="5000" indicator-position="none">
			<el-carousel-item v-for="group in batchSourceData" :key="group" class="set-carousel-item">
			<div
			class="main_item flex items-center cursor-pointer"
			v-for="(item, index) in state.exampleContent"
			:key="index"
			:class="{ main_item_active: item.sample_id === activeSampleId }"
			@click="changeExample(item)"
			>
			<div class="left flex items-center justify-center" :class="['color' + index]">
			<img :src="item.Icon" alt="" />
			</div>
			<div class="right">
			<h4>{{ item.sample_title }}</h4>
			<p>{{ item.sample_question }}</p>
			</div>
			</div>
			</el-carousel-item>
			</el-carousel>
			</div>
			</div>
			</template>
			@@ -36,7 +39,6 @@
			import { computed, onMounted, reactive, ref } from 'vue';
			import { getSelectSample } from '/@/api/ai/chat';
			import { activeRoomId, activeSampleId, activeSectionAId, setRoomConfig } from '/@/stores/chatRoom';
			import emitter from '/@/utils/mitt';
			let state = reactive({
			exampleContent: [],
			exampleRandomContent: [],
			@@ -44,11 +46,12 @@
			const exampleList = ref([]); //模版列表
			const emits = defineEmits<{
			(event: 'advanceExampleClick', data): void;
			(event:'updateChatInput',val):void;
			(event: 'updateChatInput', val): void;
			}>();
			onMounted(() => {
			getSelectListSample();
			});
			//换一批数据源
			const groupedArray = computed(() => {
			const groups = [];
			let i = 0;
			@@ -57,12 +60,18 @@
			}
			return groups;
			});
			//自动播放
			const batchSourceData = computed(() => {
			const batch = [];
			let i = 0;
			while (exampleList.value.length > i) {
			batch.push(exampleList.value.slice(i, (i += 4)));
			}
			return batch;
			});
			//获取模版列表
			const getSelectListSample = async () => {
			const res = await getSelectSample({
			section_b_id: '',
			});
			// console.log(res, 63);
			const res = await getSelectSample({});
			state.exampleRandomContent = res.samples;

			const array = [];
			@@ -78,7 +87,7 @@
			};

			const changeExample = (item) => {
			emits('updateChatInput',item.sample_question)
			emits('updateChatInput', item.sample_question);
			setRoomConfig(activeRoomId.value, 'isAnswerByLLM', false);
			activeSampleId.value = item.sample_id;
			activeSectionAId.value = item.section_a_id;
			@@ -202,6 +211,10 @@
			}
			}
			}
			.set-carousel-item {
			display: flex;
			flex-wrap: wrap;
			}
			}
			}

			@@ -220,4 +233,11 @@
			:deep(.el-drawer__body) {
			overflow-x: hidden;
			}
			:deep(.el-carousel--horizontal) {
			width: 100%;
			}
			:deep(.el-carousel__container) {
			width: 100%;
			height: 200px !important;
			}
			</style>