From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/views/ai/chat/index/components/role/RoleRepository.vue | 246 +++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 246 insertions(+), 0 deletions(-)
diff --git a/src/views/ai/chat/index/components/role/RoleRepository.vue b/src/views/ai/chat/index/components/role/RoleRepository.vue
new file mode 100644
index 0000000..0411373
--- /dev/null
+++ b/src/views/ai/chat/index/components/role/RoleRepository.vue
@@ -0,0 +1,246 @@
+<!-- chat 瑙掕壊浠撳簱 -->
+<template>
+ <el-container class="bg-[var(--el-bg-color)] -mt-25px">
+ <ChatRoleForm ref="formRef" @success="handlerAddRoleSuccess" />
+ <!-- main -->
+ <el-main class="flex-1 overflow-hidden m-0 !p-0 relative">
+ <div class="mx-3 mt-3 mb-0 absolute right-0 -top-1.25 z-100">
+ <!-- 鎼滅储鎸夐挳 -->
+ <el-input
+ :loading="loading"
+ v-model="search"
+ class="!w-60"
+ size="default"
+ placeholder="璇疯緭鍏ユ悳绱㈢殑鍐呭"
+ :suffix-icon="Search"
+ @change="getActiveTabsRole"
+ />
+ <el-button
+ v-if="activeTab == 'my-role'"
+ type="primary"
+ @click="handlerAddRole"
+ class="ml-20px"
+ >
+ <Icon icon="ep:user" class="mr-1.25" />
+ 娣诲姞瑙掕壊
+ </el-button>
+ </div>
+ <!-- tabs -->
+ <el-tabs v-model="activeTab" @tab-click="handleTabsClick" class="relative h-full">
+ <el-tab-pane label="鎴戠殑瑙掕壊" name="my-role" class="flex flex-col h-full overflow-y-auto">
+ <RoleList
+ :loading="loading"
+ :role-list="myRoleList"
+ :show-more="true"
+ @on-delete="handlerCardDelete"
+ @on-edit="handlerCardEdit"
+ @on-use="handlerCardUse"
+ @on-page="handlerCardPage('my')"
+ class="mt-3"
+ />
+ </el-tab-pane>
+ <el-tab-pane label="鍏叡瑙掕壊" name="public-role" class="!pt-2">
+ <RoleCategoryList
+ class="mx-3"
+ :category-list="categoryList"
+ :active="activeCategory"
+ @on-category-click="handlerCategoryClick"
+ />
+ <RoleList
+ :role-list="publicRoleList"
+ @on-delete="handlerCardDelete"
+ @on-edit="handlerCardEdit"
+ @on-use="handlerCardUse"
+ @on-page="handlerCardPage('public')"
+ class="mt-3"
+ loading
+ />
+ </el-tab-pane>
+ </el-tabs>
+ </el-main>
+ </el-container>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import RoleList from './RoleList.vue'
+import ChatRoleForm from '@/views/ai/model/chatRole/ChatRoleForm.vue'
+import RoleCategoryList from './RoleCategoryList.vue'
+import { ChatRoleApi, ChatRolePageReqVO, ChatRoleVO } from '@/api/ai/model/chatRole'
+import { ChatConversationApi, ChatConversationVO } from '@/api/ai/chat/conversation'
+import { Search } from '@element-plus/icons-vue'
+import { TabsPaneContext } from 'element-plus'
+import { useTagsViewStore } from '@/store/modules/tagsView'
+
+const router = useRouter() // 璺敱瀵硅薄
+const { currentRoute } = useRouter() // 璺敱
+const { delView } = useTagsViewStore() // 瑙嗗浘鎿嶄綔
+
+// 灞炴�у畾涔�
+const loading = ref<boolean>(false) // 鍔犺浇涓�
+const activeTab = ref<string>('my-role') // 閫変腑鐨勮鑹� Tab
+const search = ref<string>('') // 鍔犺浇涓�
+const myRoleParams = reactive({
+ pageNo: 1,
+ pageSize: 50
+})
+const myRoleList = ref<ChatRoleVO[]>([]) // my 鍒嗛〉澶у皬
+const publicRoleParams = reactive({
+ pageNo: 1,
+ pageSize: 50
+})
+const publicRoleList = ref<ChatRoleVO[]>([]) // public 鍒嗛〉澶у皬
+const activeCategory = ref<string>('鍏ㄩ儴') // 閫夋嫨涓殑鍒嗙被
+const categoryList = ref<string[]>([]) // 瑙掕壊鍒嗙被绫诲埆
+
+/** tabs 鐐瑰嚮 */
+const handleTabsClick = async (tab: TabsPaneContext) => {
+ // 璁剧疆鍒囨崲鐘舵��
+ activeTab.value = tab.paneName + ''
+ // 鍒囨崲鐨勬椂鍊欓噸鏂板姞杞芥暟鎹�
+ await getActiveTabsRole()
+}
+
+/** 鑾峰彇 my role 鎴戠殑瑙掕壊 */
+const getMyRole = async (append?: boolean) => {
+ const params: ChatRolePageReqVO = {
+ ...myRoleParams,
+ name: search.value,
+ publicStatus: false
+ }
+ const { list } = await ChatRoleApi.getMyPage(params)
+ if (append) {
+ myRoleList.value.push.apply(myRoleList.value, list)
+ } else {
+ myRoleList.value = list
+ }
+}
+
+/** 鑾峰彇 public role 鍏叡瑙掕壊 */
+const getPublicRole = async (append?: boolean) => {
+ const params: ChatRolePageReqVO = {
+ ...publicRoleParams,
+ category: activeCategory.value === '鍏ㄩ儴' ? '' : activeCategory.value,
+ name: search.value,
+ publicStatus: true
+ }
+ const { list } = await ChatRoleApi.getMyPage(params)
+ if (append) {
+ publicRoleList.value.push.apply(publicRoleList.value, list)
+ } else {
+ publicRoleList.value = list
+ }
+}
+
+/** 鑾峰彇閫変腑鐨� tabs 瑙掕壊 */
+const getActiveTabsRole = async () => {
+ if (activeTab.value === 'my-role') {
+ myRoleParams.pageNo = 1
+ await getMyRole()
+ } else {
+ publicRoleParams.pageNo = 1
+ await getPublicRole()
+ }
+}
+
+/** 鑾峰彇瑙掕壊鍒嗙被鍒楄〃 */
+const getRoleCategoryList = async () => {
+ categoryList.value = ['鍏ㄩ儴', ...(await ChatRoleApi.getCategoryList())]
+}
+
+/** 澶勭悊鍒嗙被鐐瑰嚮 */
+const handlerCategoryClick = async (category: string) => {
+ // 鍒囨崲閫夋嫨鐨勫垎绫�
+ activeCategory.value = category
+ // 绛涢��
+ await getActiveTabsRole()
+}
+
+/** 娣诲姞/淇敼鎿嶄綔 */
+const formRef = ref()
+const handlerAddRole = async () => {
+ formRef.value.open('my-create', null, '娣诲姞瑙掕壊')
+}
+/** 缂栬緫瑙掕壊 */
+const handlerCardEdit = async (role) => {
+ formRef.value.open('my-update', role.id, '缂栬緫瑙掕壊')
+}
+
+/** 娣诲姞瑙掕壊鎴愬姛 */
+const handlerAddRoleSuccess = async (e) => {
+ // 鍒锋柊鏁版嵁
+ await getActiveTabsRole()
+}
+
+/** 鍒犻櫎瑙掕壊 */
+const handlerCardDelete = async (role) => {
+ await ChatRoleApi.deleteMy(role.id)
+ // 鍒锋柊鏁版嵁
+ await getActiveTabsRole()
+}
+
+/** 瑙掕壊鍒嗛〉锛氳幏鍙栦笅涓�椤� */
+const handlerCardPage = async (type) => {
+ try {
+ loading.value = true
+ if (type === 'public') {
+ publicRoleParams.pageNo++
+ await getPublicRole(true)
+ } else {
+ myRoleParams.pageNo++
+ await getMyRole(true)
+ }
+ } finally {
+ loading.value = false
+ }
+}
+
+/** 閫夋嫨 card 瑙掕壊锛氭柊寤鸿亰澶╁璇� */
+const handlerCardUse = async (role) => {
+ // 1. 鍒涘缓瀵硅瘽
+ const data: ChatConversationVO = {
+ roleId: role.id
+ } as unknown as ChatConversationVO
+ const conversationId = await ChatConversationApi.createChatConversationMy(data)
+
+ // 2. 璺宠浆椤甸潰
+ delView(unref(currentRoute))
+ await router.replace({
+ name: 'AiChat',
+ query: {
+ conversationId: conversationId
+ }
+ })
+}
+
+/** 鍒濆鍖� **/
+onMounted(async () => {
+ // 鑾峰彇鍒嗙被
+ await getRoleCategoryList()
+ // 鑾峰彇 role 鏁版嵁
+ await getActiveTabsRole()
+})
+</script>
+<!-- 瑕嗙洊 element plus css -->
+<style lang="scss">
+.el-tabs__nav-scroll {
+ margin: 2px 8px !important;
+}
+
+.el-tabs__header {
+ margin: 0 !important;
+ padding: 0 !important;
+}
+
+.el-tabs__nav-wrap {
+ margin-bottom: 0 !important;
+}
+
+.el-tabs__content {
+ padding: 0 !important;
+}
+
+.el-tab-pane {
+ padding: 8px 0 0 0 !important;
+}
+</style>
--
Gitblit v1.8.0