From 542b404c51f67b8fb9e56ed0ba0562e31af7d257 Mon Sep 17 00:00:00 2001 From: gerson <1405270578@qq.com> Date: 星期六, 06 七月 2024 18:52:47 +0800 Subject: [PATCH] Merge branch 'master' of http://47.103.154.90:83/r/WI/Web.V1.0 --- src/views/project/ch/home/component/waterRight/bottom.vue | 96 ++++++++++++++++++++++++++++++------------------ 1 files changed, 60 insertions(+), 36 deletions(-) diff --git a/src/views/project/ch/home/component/waterRight/bottom.vue b/src/views/project/ch/home/component/waterRight/bottom.vue index 858b714..f524457 100644 --- a/src/views/project/ch/home/component/waterRight/bottom.vue +++ b/src/views/project/ch/home/component/waterRight/bottom.vue @@ -5,7 +5,7 @@ <span>搴旂敤鍦烘櫙</span> </div> <div class="cursor-pointer"> - <el-button link class="changeBatch" + <el-button link class="changeBatch" @click="lookMore" >鏌ョ湅鏇村 <el-icon> <ArrowRight /> @@ -17,56 +17,74 @@ <div class="main"> <div class="main_item flex cursor-pointer" - v-for="(item, index) in state.applicationScenarios" - :key="item.ID" - :class="{ main_item_active: item.ID === state.scenariosIndex }" + v-for="item in state.applicationScenarios" + :key="item.section_id" + :class="{ main_item_active: item.section_id === activeSectionAId }" @click="changeScenarios(item)" > <div :class="['iconfont icon-' + item.Icon]"></div> <div class="right"> - <h4>{{ item.Title }}</h4> - <p>{{ item.Content }}</p> + <h4>{{ item.section_name }}</h4> + <p>{{ item.section_title }}</p> </div> </div> + </div> + <div class="set-page"> + <el-pagination size="small" background layout="prev, pager, next" class="mt-4" /> </div> </div> </template> <script setup lang="ts"> -import { reactive } from 'vue'; +import { onMounted, reactive, computed } from 'vue'; +import { getSectionList } from '/@/api/ai/chat'; +import router from '/@/router'; +import { activeSectionAId } from '/@/stores/chatRoom'; + let state = reactive({ - applicationScenarios: [ - { - ID: 1, - Icon: 'biaodan', - Title: '琛屼笟鐭ヨ瘑搴�', - Content: '寮犱笁鎵撲簡鏉庡洓涓�宸存帉,鏉庡洓瀵瑰紶涓夎:"浣犳槸涓嶆槸娌″悆楗�",鏉庡洓璇磋繖鍙ヨ瘽鍚箟鏄�?', - }, - { - ID: 2, - Icon: 'putong', - Title: '鐢熶骇璋冨害', - Content: '鎬庝箞瑙i噴鍔姏鍜屽唴鍗风殑鍖哄埆?', - }, - { - ID: 3, - Icon: 'zhongduancanshuchaxun', - Title: '姘翠骇鐢熶骇', - Content: '璇锋悳绱綘鎯崇煡閬撶殑闂', - }, - { - ID: 4, - Icon: 'tuichuquanping', - Title: '绠$綉杩愯', - Content: '璇蜂互璇楃粡涓殑鍏告晠缁欑敺瀹濆疂鍙栧悕锛屽椤撅紝鍚嶅瓧瑕佹眰3涓瓧锛岀粰5涓悕瀛椾緵鎴戦�夋嫨銆�', - }, - ], - scenariosIndex: 0, + applicationScenarios: [], + scenariosIds: [], }); -const changeScenarios = (item) => { - state.scenariosIndex = item.ID; +const changeScenarios = async (item) => { + activeSectionAId.value = item.section_id; }; +const getMainSectionList = async () => { + const res = await getSectionList(); + let result = []; + const iconList = ['biaodan', 'putong', 'zhongduancanshuchaxun', 'shidu']; + res.sections.forEach((sectionItem, index) => { + sectionItem.Icon = iconList[index]; + if (index < 4) { + result.push(sectionItem); + } + }); + state.applicationScenarios = result; + + res.sections?.[0] && changeScenarios(res.sections[0]); + // state.scenariosIds = result.map((item) => item.section_id); +}; +const groupedArray = computed(() => { + const groups = []; + let i = 0; + while (state.applicationScenarios.length > i) { + groups.push(state.applicationScenarios.slice(i, (i += 4))); + } + return groups; +}); +const nextPage = () => { + const index = Math.floor(Math.random() * groupedArray.value.length); + state.applicationScenarios = groupedArray.value[index]; +}; +// 鏌ョ湅鏇村 +const lookMore = () => { + router.push({ + name: 'Scenario', + }); +}; +onMounted(() => { + getMainSectionList(); +}); </script> <style scoped lang="scss"> .pc-scenes { @@ -185,5 +203,11 @@ } } } + .set-page { + display: flex; + justify-content: center; + align-items: center; + margin: 10px 0px; + } } </style> -- Gitblit v1.9.3