From 5d7b63225ca327aee2650fd6d36c3a7fc8f11cf1 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期一, 28 十月 2024 15:40:51 +0800
Subject: [PATCH] Merge branch 'test' of http://47.103.154.90:83/r/WI/Web.V1.0 into test
---
src/views/project/ch/home/component/waterRight/center.vue | 96 ++++++++++++++++++++++++++---------------------
1 files changed, 53 insertions(+), 43 deletions(-)
diff --git a/src/views/project/ch/home/component/waterRight/center.vue b/src/views/project/ch/home/component/waterRight/center.vue
index 4235038..444e49f 100644
--- a/src/views/project/ch/home/component/waterRight/center.vue
+++ b/src/views/project/ch/home/component/waterRight/center.vue
@@ -6,17 +6,36 @@
<span class="split"></span>
<span class="change cursor-pointer" @click="advanceExampleClick">楂樼骇绀轰緥 ></span>
</div>
- <div class="cursor-pointer">
- <span class="mr-1 changeBatch" @click="batchChange">鎹竴鎵�</span>
+ <div class="cursor-pointer" @click="batchChange">
+ <span class="mr-1 changeBatch">鎹竴鎵�</span>
<i class="myiconfont icon-shuaxin"></i>
</div>
</div>
<div class="main">
- <el-carousel height="80" :interval="6000" indicator-position="none">
- <el-carousel-item v-for="group in batchSourceData" :key="group" class="set-carousel-item">
+ <el-carousel height="80" :interval="6000" indicator-position="none" v-show="!state.isShowExample">
+ <el-carousel-item v-for="(group, index) in state.m_groupArr" :key="index" class="set-carousel-item">
<div
class="main_item flex items-center cursor-pointer"
- v-for="(item, index) in state.exampleContent"
+ v-for="(item, index) in group"
+ :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>
+ <el-carousel height="80" :interval="6000" indicator-position="none" v-show="state.isShowExample">
+ <el-carousel-item v-for="(group, index) in state.m_groupArr" :key="index" class="set-carousel-item">
+ <div
+ class="main_item flex items-center cursor-pointer"
+ v-for="(item, index) in group"
:key="index"
:class="{ main_item_active: item.sample_id === activeSampleId }"
@click="changeExample(item)"
@@ -36,12 +55,13 @@
</template>
<script setup lang="ts">
-import { computed, onMounted, reactive, ref } from 'vue';
+import { onMounted, reactive, ref } from 'vue';
import { getSelectSample } from '/@/api/ai/chat';
import { activeRoomId, activeSampleId, activeSectionAId, setRoomConfig } from '/@/stores/chatRoom';
let state = reactive({
exampleContent: [],
- exampleRandomContent: [],
+ isShowExample: false,
+ m_groupArr: [],
});
const exampleList = ref([]); //妯＄増鍒楄〃
const emits = defineEmits<{
@@ -51,28 +71,20 @@
onMounted(() => {
getSelectListSample();
});
-//鎹竴鎵规暟鎹簮
-const groupedArray = computed(() => {
+
+const initGroupedArr = () => {
const groups = [];
let i = 0;
- while (state.exampleRandomContent.length > i) {
- groups.push(state.exampleRandomContent.slice(i, (i += 4)));
+ while (state.exampleContent.length > i) {
+ groups.push(state.exampleContent.slice(i, (i += 4)));
}
- 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;
-});
+
+ state.m_groupArr = groups;
+};
+
//鑾峰彇妯＄増鍒楄〃
const getSelectListSample = async () => {
const res = await getSelectSample({});
- state.exampleRandomContent = res.samples;
const array = [];
res.samples.forEach((sample, index) => {
sample.Icon = '/static/images/wave/ChatImg.png';
@@ -82,7 +94,6 @@
}
});
exampleList.value = res.samples;
- state.exampleContent = array;
};
const changeExample = (item) => {
@@ -93,33 +104,31 @@
};
//鎹竴鎵�
const batchChange = () => {
- const index = Math.floor(Math.random() * groupedArray.value.length);
- state.exampleContent = groupedArray.value[index];
+ let groups = state.m_groupArr;
+ // 鎵撲贡鎵规椤哄簭
+ for (let i = groups.length - 1; i > 0; i--) {
+ const j = Math.floor(Math.random() * (i + 1));
+ [groups[i], groups[j]] = [groups[j], groups[i]];
+ }
+
+ state.m_groupArr = groups;
};
//鎵撳紑楂樼骇绀轰緥
const advanceExampleClick = () => {
emits('advanceExampleClick', true);
};
-const tagListClick = (group_item) => {
- const curGroupID = group_item.p_group_id;
- const curID = group_item.group_id;
- const exampleContent = exampleList.value;
- let curGroupIDs = [];
- if (!curGroupID) {
- curGroupIDs.push(curID);
- } else {
- exampleContent.forEach((item) => {
- curGroupIDs.push(item.group_id);
- });
- }
+const tagListClick = (tagList) => {
let result = [];
- curGroupIDs.forEach((curItem) => {
- exampleContent.forEach((sample) => {
- if (curItem == sample.group_id) result.push(sample);
+ tagList.forEach((tag) => {
+ exampleList.value.forEach((sample) => {
+ if (tag == sample.group_id) {
+ result.push(sample);
+ }
});
});
- console.log('馃殌 ~ result:', result);
- batchChange();
+ state.exampleContent = result;
+
+ initGroupedArr();
};
//闅忔満鐢熸垚棰滆壊
const randomHexColor = () => {
@@ -173,6 +182,7 @@
width: calc(50% - 16px);
margin: 8px;
padding: 12px;
+ height: 84px;
border: 1px solid #d9dbde;
border-radius: 5px;
background-color: transparent;
--
Gitblit v1.9.3