拉取sessions

src/views/assistant/dashboard/edit.vue

@@ -1,17 +1,19 @@
 <script setup lang="ts">
 import { useLoading } from '/@/utils/loading-util'
-import { computed, onMounted, ref } from 'vue'
+import { computed, onMounted, ref, watch } from 'vue'
 import DashboardDesigner from '/@/components/assistant/DashboardDesigner.vue'
 import ComponentLibrary from '/@/components/assistant/ComponentLibrary.vue'
 import { ElMessage } from 'element-plus'
 import type { MarkdownDashBoard, Position, Size, Content, AddCardData, ComponentLibraryItem } from '/@/components/assistant/types'
+import { LmSession } from '/@/api/assist/type'
+import assist from '/@/api/assist'
 
 // 预留props，暂时不使用
 const props = defineProps<{
 	id?: number
 }>()
 
-const data = ref<MarkdownDashBoard[]>([])
+const cards = ref<MarkdownDashBoard[]>([])
 
 // 预留加载功能，暂时不使用
 const { loading: loadingDashboard, doLoading: doLoadingDashBoard } = useLoading(async () => {
@@ -22,9 +24,7 @@ const { loading: loadingDashboard, doLoading: doLoadingDashBoard } = useLoading(
 	//TODO fetch remote
 })
 
-onMounted(doLoadingDashBoard)
-
-const renderer = computed<MarkdownDashBoard[]>(() => [...data.value].sort((a, b) => a.z - b.z))
+const renderer = computed<MarkdownDashBoard[]>(() => [...cards.value].sort((a, b) => a.z - b.z))
 
 // 生成唯一ID
 const generateId = () => {
@@ -51,16 +51,16 @@ const addCard = (cardData: AddCardData) => {
 		y: cardData.y ?? Math.random() * 50,
 		w: 30,
 		h: 25,
-		z: Math.max(...data.value.map((item) => item.z), 0) + 1,
+		z: Math.max(...cards.value.map((item) => item.z), 0) + 1,
 		title: cardData.title,
 		data: cardData.data,
 	}
-	data.value.push(newCard)
+	cards.value.push(newCard)
 }
 
 // 更新卡片位置
 const updateCardPosition = (id: string, position: Position) => {
-	const card = data.value.find((item) => item.id === id)
+	const card = cards.value.find((item) => item.id === id)
 	if (card) {
 		card.x = position.x
 		card.y = position.y
@@ -69,7 +69,7 @@ const updateCardPosition = (id: string, position: Position) => {
 
 // 更新卡片大小
 const updateCardSize = (id: string, size: Size) => {
-	const card = data.value.find((item) => item.id === id)
+	const card = cards.value.find((item) => item.id === id)
 	if (card) {
 		card.w = size.w
 		card.h = size.h
@@ -78,7 +78,7 @@ const updateCardSize = (id: string, size: Size) => {
 
 // 更新卡片内容
 const updateCardContent = (id: string, content: Content) => {
-	const card = data.value.find((item) => item.id === id)
+	const card = cards.value.find((item) => item.id === id)
 	if (card) {
 		card.title = content.title
 		card.data = content.data
@@ -87,41 +87,50 @@ const updateCardContent = (id: string, content: Content) => {
 
 // 删除卡片
 const removeCard = (id: string) => {
-	const index = data.value.findIndex((item) => item.id === id)
+	const index = cards.value.findIndex((item) => item.id === id)
 	if (index !== -1) {
-		data.value.splice(index, 1)
+		cards.value.splice(index, 1)
 	}
 }
 
+const chat = ref<LmSession[]>([])
+const currentSelectedChat = ref<number>()
+
+watch(currentSelectedChat, (newVal) => {
+	if (newVal === undefined) {
+		library.value = []
+		return
+	}
+	doLoadingLibrary(chat.value[newVal].session_id)
+})
+
+const { loading: loadingChat, doLoading: doLoadingChat } = useLoading(async () => {
+	const data: { list: LmSession[]; total: number } = await assist.session
+		.list({
+			pageNum: 1,
+			pageSize: 30,
+		})
+		.catch(() => {
+			return {
+				list: [],
+				total: 0,
+			}
+		})
+
+	chat.value = data.list
+})
+
 // 组件库数据
-const library = ref<ComponentLibraryItem[]>([
-	{
-		id: 'quote-block',
-		title: '引用块',
-		icon: 'ele-Document',
-		description: '用于显示引用内容',
-		data: `> ### 重要提示
->
-> 这是一个引用块示例，可以用来显示重要信息、提示或者引用其他内容。
->
-> 支持多行内容和**格式化文本**。`,
-		preview: `> 这是一个引用块示例\n> 可以包含重要信息`,
-	},
-	{
-		id: 'data-table',
-		title: '数据表格',
-		icon: 'ele-Document',
-		description: '用于显示结构化数据',
-		data: `| 指标名称 | 当前值 | 目标值 | 完成率 |
-|----------|--------|--------|--------|
-| 用户注册 | 1,234 | 1,500 | 82.3% |
-| 活跃用户 | 856 | 1,000 | 85.6% |
-| 转化率 | 12.5% | 15% | 83.3% |
-| 收入 | ¥45,678 | ¥50,000 | 91.4% |`,
-		preview: `| 指标 | 数值 | 状态 |\n|------|------|------|\n| 用户 | 1,234 | 正常 |`,
-	},
-])
-//
+const library = ref<ComponentLibraryItem[]>([])
+
+const { loading: loadingLibrary, doLoading: doLoadingLibrary } = useLoading(async (id: number) => {})
+
+onMounted(async ()=> {
+	await Promise.all([
+		doLoadingChat(),
+		doLoadingDashBoard(),
+	])
+})
 </script>
 
 <template>
@@ -154,7 +163,10 @@ const library = ref<ComponentLibraryItem[]>([
 
 			<!-- 右侧组件库面板 -->
 			<div class="library-panel">
-				<ComponentLibrary :library="library" @add-card="addCard" />
+				<el-select class="library-panel-header" v-model="currentSelectedChat" v-loading="loadingChat">
+					<el-option v-for="(i,index) in chat" :key="i.session_id" :value="index" :label="i.title"></el-option>
+				</el-select>
+				<ComponentLibrary class="library-panel-content" :library="library" @add-card="addCard" />
 			</div>
 		</div>
 	</div>
@@ -208,5 +220,18 @@ const library = ref<ComponentLibraryItem[]>([
 	width: 300px;
 	background: var(--el-bg-color);
 	border-left: 1px solid var(--el-border-color-light);
+
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+
+	.library-panel-header {
+		width: 95%;
+		margin: 5%;
+	}
+
+	.library-panel-content {
+		width: 100%;
+	}
 }
 </style>