xwl2023/Yi.Framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:聊天新增ai

Browse Source
This commit is contained in:
橙子
2024-07-21 13:37:56 +08:00
parent a0478279df
commit d9e91bcbf5
18 changed files with 240 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
Yi.Abp.Net8/module/chat-hub/Yi.Framework.ChatHub.Application/Dtos/AiChatContextDto.cs
View File

@@ -1,24 +0,0 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
namespace Yi.Framework.ChatHub.Application.Dtos
{
public class AiChatContextDto
{
public AnswererTypeEnum AnswererType { get; set; }
public string Message { get; set; }
public int Number { get; set; }
}
public enum AnswererTypeEnum
{
Ai,
User
}
}

25
Yi.Abp.Net8/module/chat-hub/Yi.Framework.ChatHub.Application/Services/AiChatService.cs
View File

@@ -1,15 +1,10 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Collections.Generic;
using Microsoft.AspNetCore.Authorization;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.SignalR;
using Volo.Abp.Application.Services;
using Yi.Framework.ChatHub.Domain.Managers;
using Yi.Framework.ChatHub.Domain.Shared.Dtos;
using Yi.Framework.ChatHub.Domain.Shared.Model;
using Yi.Framework.ChatHub.Domain.SignalRHubs;
namespace Yi.Framework.ChatHub.Application.Services
{
@@ -19,14 +14,24 @@ namespace Yi.Framework.ChatHub.Application.Services
private readonly UserMessageManager _userMessageManager;
public AiChatService(AiManager aiManager, UserMessageManager userMessageManager) { _aiManager = aiManager; _userMessageManager = userMessageManager; }
/// <summary>
/// ai聊天
/// </summary>
/// <param name="chatContext"></param>
/// <returns></returns>
[Authorize]
[HttpPost]
public async Task ChatAsync()
public async Task ChatAsync([FromBody] List<AiChatContextDto> chatContext)
{
await foreach (var aiResult in _aiManager.ChatAsStreamAsync())
var contextId = Guid.NewGuid();
await foreach (var aiResult in _aiManager.ChatAsStreamAsync(chatContext))
{
await _userMessageManager.SendMessageAsync(MessageContext.CreateAi(aiResult, CurrentUser.Id!.Value));
await _userMessageManager.SendMessageAsync(MessageContext.CreateAi(aiResult, CurrentUser.Id!.Value, contextId));
}
await _userMessageManager.SendMessageAsync(MessageContext.CreateAi(null, CurrentUser.Id!.Value, contextId));
}
}
}

5
Yi.Abp.Net8/module/chat-hub/Yi.Framework.ChatHub.Domain.Shared/Enums/MessageTypeEnum.cs
View File

@@ -9,10 +9,11 @@ namespace Yi.Framework.ChatHub.Domain.Shared.Enums
public enum MessageTypeEnum
{
Ai,
Personal,
Group,
All
All,
Ai
}
}

13
Yi.Abp.Net8/module/chat-hub/Yi.Framework.ChatHub.Domain.Shared/Model/MessageContext.cs
View File

@@ -16,9 +16,9 @@ namespace Yi.Framework.ChatHub.Domain.Shared.Model
{
return context.Where(x => x.ReceiveId is not null).Select(x => x.ReceiveId!.Value).Union(context.Select(x => x.SendUserId)).ToList();
}
public static List<MessageContext> MapperUserInfo(this List<MessageContext> messageContexts,List<UserRoleMenuDto> userRoleMenuDtos)
public static List<MessageContext> MapperUserInfo(this List<MessageContext> messageContexts, List<UserRoleMenuDto> userRoleMenuDtos)
{
var userInfoDic = userRoleMenuDtos.ToDictionary(x => x.User.Id);
var userInfoDic = userRoleMenuDtos.Select(x => new UserRoleMenuDto { User = x.User }).ToDictionary(x => x.User.Id);
foreach (var context in messageContexts)
{
if (context.ReceiveId is not null)
@@ -42,9 +42,9 @@ namespace Yi.Framework.ChatHub.Domain.Shared.Model
}
public static MessageContext CreateAi(string content, Guid receiveId)
public static MessageContext CreateAi(string? content, Guid receiveId, Guid id )
{
return new MessageContext() { MessageType = MessageTypeEnum.Ai, Content = content, ReceiveId = receiveId };
return new MessageContext() { MessageType = MessageTypeEnum.Ai, Content = content??string.Empty, ReceiveId = receiveId, Id = id };
}
public static MessageContext CreateAll(string content, Guid sendUserId)
@@ -86,6 +86,11 @@ namespace Yi.Framework.ChatHub.Domain.Shared.Model
/// 消息内容
/// </summary>
public string Content { get; set; }
/// <summary>
/// 上下文Id，主要用于ai流式传输
/// </summary>
public Guid Id { get; set; }
public DateTime CreationTime { get; protected set; } = DateTime.Now;
}

62
Yi.Abp.Net8/module/chat-hub/Yi.Framework.ChatHub.Domain/Managers/AiManager.cs
View File

@@ -1,8 +1,4 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Collections.Generic;
using Microsoft.Extensions.Options;
using OpenAI;
using OpenAI.Managers;
@@ -10,11 +6,11 @@ using OpenAI.ObjectModels;
using OpenAI.ObjectModels.RequestModels;
using Volo.Abp.DependencyInjection;
using Volo.Abp.Domain.Services;
using Yi.Framework.ChatHub.Domain.Shared.Dtos;
using Yi.Framework.ChatHub.Domain.Shared.Options;
namespace Yi.Framework.ChatHub.Domain.Managers
{
public class AiManager : DomainService, ISingletonDependency
public class AiManager : ISingletonDependency
{
public AiManager(IOptions<AiOptions> options)
{
@@ -26,25 +22,49 @@ namespace Yi.Framework.ChatHub.Domain.Managers
}
private OpenAIService OpenAIService { get; }
public async IAsyncEnumerable<string> ChatAsStreamAsync()
public async IAsyncEnumerable<string> ChatAsStreamAsync(List<AiChatContextDto> aiChatContextDtos)
{
var completionResult = OpenAIService.ChatCompletion.CreateCompletionAsStream(new ChatCompletionCreateRequest
{
Messages = new List<ChatMessage>
{
ChatMessage.FromUser("特朗普是谁？"),
},
Model = Models.Gpt_4,
});
var temp = "站长正在接入ChatGpt,敬请期待~";
await foreach (var result in completionResult)
for (var i = 0; i < temp.Length; i++)
{
if (result.Successful)
{
yield return result.Choices.FirstOrDefault()?.Message.Content??string.Empty;
}
await Task.Delay(200);
yield return temp[i].ToString();
}
//if (aiChatContextDtos.Count == 0)
//{
// yield return null;
//}
//List<ChatMessage> messages= aiChatContextDtos.Select(x =>
//{
// if (x.AnswererType == AnswererTypeEnum.Ai)
// {
// return ChatMessage.FromSystem(x.Message);
// }
// else
// {
// return ChatMessage.FromUser(x.Message);
// }
//}).ToList();
//var completionResult = OpenAIService.ChatCompletion.CreateCompletionAsStream(new ChatCompletionCreateRequest
//{
// Messages = messages,
// Model = Models.Gpt_3_5_Turbo
//});
//await foreach (var result in completionResult)
//{
// if (result.Successful)
// {
// yield return result.Choices.FirstOrDefault()?.Message.Content ?? string.Empty;
// }
//}
}
}
}

3
Yi.Abp.Net8/src/Yi.Abp.Web/Yi.Abp.Web.csproj
View File

@@ -31,6 +31,9 @@
<Content Update="appsettings.json">
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
</Content>
<Content Update="wwwroot\File\c4e579ee-9e5d-8a60-5540-3a138a0fb467">
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
</Content>
<Content Update="wwwroot\icon\**">
<CopyToOutputDirectory>Always</CopyToOutputDirectory>
</Content>

8
Yi.Bbs.Vue3/src/apis/chatMessageApi.js
View File

@@ -22,3 +22,11 @@ export function sendGroupMessage(data) {
});
}
export function sendAiChat(data) {
return request({
url: "/ai-chat/chat",
method: "post",
data
});
}

2
Yi.Bbs.Vue3/src/components/ArticleContentInfo.vue
View File

@@ -117,7 +117,7 @@ const codeHandler = (code, language) => {
// 将代码包裹在 textarea 中，由于防止textarea渲染出现问题，这里将 "<" 用 "&lt;" 代替，不影响复制功能
let html = `<pre class='hljs pre'><div class="header"><span class="language">${language}</span><span class="copy" id="${codeIndex}">复制代码</span></div><div class="code-con"><div class="nav">${navCode}</div><code class="code">${preCode}</code></div></pre>`;
codeCopyDic.push({id: codeIndex,code:code});
console.log(codeCopyDic.length);
// console.log(codeCopyDic.length);
return html;
//<textarea style="position: absolute;top: -9999px;left: -9999px;z-index: -9999;" id="copy${codeIndex}">${code.replace(/<\/textarea>/g, "&lt;/textarea>")}</textarea>
} catch (error) {

4
Yi.Bbs.Vue3/src/components/MavonEdit.vue
View File

@@ -118,14 +118,14 @@ const imgAdd = async (pos, $file) => {
formdata.append('file', $file);
const response = await upload(formdata)
const url = `${import.meta.env.VITE_APP_BASEAPI}/file/${response.data[0].id}/true`;
console.log(url)
//console.log(url)
md.value.$img2Url(pos, url);
}
//选择表情包
const onSelectEmoji=(emoji)=>{
console.log(emoji.i,"emoji");
//console.log(emoji.i,"emoji");
text.value+=emoji.i
}

16
Yi.Bbs.Vue3/src/hubs/chatHub.js
View File

@@ -13,17 +13,27 @@ const receiveMsg = (connection) => {
});
//接受其他用户消息
connection.on("receiveMsg", (type, content) => {
chatStore.addMsg(content);
const letChatStore = useChatStore();
//如果是ai消息，还要进行流式显示
// alert(type)
if (type == 3) {
letChatStore.addOrUpdateMsg(content);
}
else {
letChatStore.addMsg(content);
}
});
//用户状态-正在输入中，无
connection.on("userStatus", (type) => {
});
};
export function start(){
export function start() {
signalR.start(`chat`, receiveMsg);
}
export function close(){
export function close() {
signalR.SR.stop();
}

2
Yi.Bbs.Vue3/src/layout/AppHeader.vue
View File

@@ -155,7 +155,7 @@ const fetchNoticeData = async () => {
const handleSelect = (key, keyPath) => {
console.log(key, keyPath);
//console.log(key, keyPath);
};
const logout = async () => {
ElMessageBox.confirm(`确定登出系统吗?`, "警告", {

14
Yi.Bbs.Vue3/src/stores/chat.js
View File

@@ -7,9 +7,23 @@ const chatStore = defineStore("chat", {
getters: {
allMsgContext: (state) => state.msgList.filter(x=>x.messageType=="All"),
personalMsgContext: (state) => state.msgList.filter(x=>x.messageType=="Personal"),
aiMsgContext: (state) => state.msgList.filter(x=>x.messageType=="Ai")
},
actions:
{
addOrUpdateMsg(msg){
var currentMsg= this.msgList.filter(x => x.id == msg.id)[0];
//当前没有包含,如果有相同的上下文id，只需要改变content即可
if(currentMsg==undefined)
{
this.addMsg(msg);
}
else
{
currentMsg.content+=msg.content;
}
},
setMsgList(value) {
this.msgList = value;
},

8
Yi.Bbs.Vue3/src/utils/icon.js
View File

@@ -2,10 +2,14 @@ export const getUrl = (fileId) => {
if (fileId == null || fileId == undefined) {
return "/acquiesce.png"
}
else {
return getEnvUrl(fileId)
if (fileId.startsWith(`${import.meta.env.VITE_APP_BASEAPI}`)) {
return fileId;
}
return getEnvUrl(fileId)
};
const getEnvUrl = (str) => {

147
Yi.Bbs.Vue3/src/views/chathub/Index.vue
View File

@@ -3,7 +3,7 @@ import { onMounted, ref, computed, onUnmounted } from 'vue';
import { storeToRefs } from 'pinia'
import useAuths from '@/hooks/useAuths.js';
import { getList as getChatUserList } from '@/apis/chatUserApi'
import { sendPersonalMessage, sendGroupMessage, getAccountList as getChatAccountMessageList } from '@/apis/chatMessageApi'
import { sendPersonalMessage, sendGroupMessage, getAccountList as getChatAccountMessageList, sendAiChat } from '@/apis/chatMessageApi'
import useChatStore from "@/stores/chat";
import useUserStore from "@/stores/user";
const { isLogin } = useAuths();
@@ -19,17 +19,22 @@ const userStore = useUserStore();
//发送消息是否为空
const msgIsNullShow = ref(false)
//当前选择用户
const currentSelectUser = ref(null);
const currentSelectUser = ref('all');
//当前输入框的值
const currentInputValue = ref("");
//临时存储的输入框，根据用户id及组name、all组为key，data为value
const inputListDataStore = ref([{ key: "all", value: "" }]);
const inputListDataStore = ref([{ key: "all", value: "" }, { key: "ai", value: "" }]);
//AI聊天临时存储
const sendAiChatContext = ref([]);
//当前聊天框显示的消息
const currentMsgContext = computed(() => {
if (selectIsAll()) {
return chatStore.allMsgContext;
}
else if (selectIsAi) {
return chatStore.aiMsgContext;
}
else {
return chatStore.personalMsgContext.filter(x => {
//两个条件
@@ -40,11 +45,31 @@ const currentMsgContext = computed(() => {
});
}
});
const getChatUrl=(url,position)=>
{
if(position=="left" && selectIsAi())
{
return "/openAi.png"
}
return getUrl(url);
}
//当前聊天框显示的名称
const currentHeaderName = computed(() => {
return currentSelectUser.value == null ? "官方学习交流群" : currentSelectUser.value.userName;
if (selectIsAll()) {
return "官方学习交流群";
}
else if
(selectIsAi()) {
return "Ai-ChatGpt(你的私人ai小助手)"
}
else {
currentSelectUser.value.userName;
}
});
const currentUserItem = computed(() => {
return userList.value.filter(x => x.userId != useUserStore().id)
@@ -76,8 +101,13 @@ onUnmounted(() => {
/*-----方法-----*/
//当前选择的是否为全部
const selectIsAll = () => {
return currentSelectUser.value == null;
return currentSelectUser.value == 'all';
};
//当前选择的是否为Ai
const selectIsAi = () => {
return currentSelectUser.value == 'ai';
};
//输入框的值被更改
const changeInputValue = (inputValue) => {
@@ -85,7 +115,10 @@ const changeInputValue = (inputValue) => {
let index = -1;
let findKey = currentSelectUser.value?.userId
if (selectIsAll()) {
findKey = 'all'
findKey = 'all';
}
else if (selectIsAi()) {
findKey = 'ai';
}
index = inputListDataStore.value.findIndex(obj => obj.key == findKey);
inputListDataStore.value[index].value = currentInputValue.value;
@@ -99,7 +132,12 @@ const getCurrentInputValue = () => {
if (selectIsAll()) {
return inputListDataStore.value.filter(x => x.key == "all")[0].value;
} else {
}
else if (selectIsAi()) {
return inputListDataStore.value.filter(x => x.key == "ai")[0].value;
}
else {
//如果不存在初始存储值
if (!inputListDataStore.value.some(x => x.key == currentSelectUser.value.userId)) {
inputListDataStore.value.push({ key: currentSelectUser.value.userId, value: "" });
@@ -110,9 +148,12 @@ const getCurrentInputValue = () => {
};
//点击用户列表,
const onclickUserItem = (userInfo, isAllItem) => {
if (isAllItem) {
currentSelectUser.value = null;
const onclickUserItem = (userInfo, itemType) => {
if (itemType == "all") {
currentSelectUser.value = 'all';
}
else if (itemType == "ai") {
currentSelectUser.value = 'ai';
}
else {
currentSelectUser.value = userInfo;
@@ -136,6 +177,17 @@ const onclickSendMsg = () => {
if (selectIsAll()) {
onclickSendGroupMsg("all", currentInputValue.value);
}
else if (selectIsAi()) {
//ai消息需要将上下文存储
sendAiChatContext.value.push({ answererType: 'User', message: currentInputValue.value, number: sendAiChatContext.value.length })
//离线前端存储
chatStore.addMsg({messageType:"Ai",content:currentInputValue.value,sendUserId:userStore.id,sendUserInfo:{user:{icon:userStore.icon}}})
//发送ai消息
sendAiChat(sendAiChatContext.value);
}
else {
onclickSendPersonalMsg(currentSelectUser.value.userId, currentInputValue.value);
@@ -184,10 +236,15 @@ const onclickSendGroupMsg = (groupName, msg) => {
//获取当前最后一条信息
const getLastMessage = ((receiveId, isAll) => {
if (isAll) {
return chatStore.allMsgContext[chatStore.allMsgContext.length - 1]?.content;
} else {
const getLastMessage = ((receiveId, itemType) => {
if (itemType == "all") {
return chatStore.allMsgContext[chatStore.allMsgContext.length - 1]?.content.substring(0, 15);
}
else if (itemType == "ai") {
return chatStore.aiMsgContext[chatStore.aiMsgContext.length - 1]?.content.substring(0, 15);
}
else {
const messageContext = chatStore.personalMsgContext.filter(x => {
//两个条件
//接收用户者id为对面id（我发给他）
@@ -195,7 +252,7 @@ const getLastMessage = ((receiveId, isAll) => {
return (x.receiveId == receiveId && x.sendUserId == userStore.id) ||
(x.sendUserId == receiveId && x.receiveId == userStore.id);
});
return messageContext[messageContext.length - 1]?.content;
return messageContext[messageContext.length - 1]?.content.substring(0, 15);
}
})
@@ -203,16 +260,17 @@ const getLastMessage = ((receiveId, isAll) => {
<template>
<div style="position: absolute; top: 0;left: 0;">
<p>当前版本：1.2.0</p>
<p>当前版本：1.3.0</p>
<p>tip:官方学习交流群每次发送消息消耗 1 钱钱</p>
<p>tip:点击聊天窗口右上角“X”可退出</p>
<p>tip:多人同时在聊天室时，左侧可显示其他成员</p>
<p>tip:即将接入OpenAi ChatGpt Ai聊天</p>
</div>
<div class="body">
<div class="left">
<div class="icon">
<img src="@/assets/chat_images/icon.jpg">
<img :src="userStore.icon">
</div>
<ul class="top-icon">
<li><img src="@/assets/chat_images/wechat.png" /></li>
@@ -243,13 +301,28 @@ const getLastMessage = ((receiveId, isAll) => {
</div>
</div>
<div class="user-list">
<div class="user-div" @click="onclickUserItem(null, true)"
:class="{ 'select-user-item': currentSelectUser == null }">
<div class="user-div" @click="onclickUserItem(null, 'all')"
:class="{ 'select-user-item': currentSelectUser == 'all' }">
<div class="user-div-left">
<img src="@/assets/chat_images/yilogo.png" />
<div class="user-name-msg">
<p class="font-name">官方学习交流群</p>
<p class="font-msg">{{ getLastMessage(null, true) }}</p>
<p class="font-msg">{{ getLastMessage(null, 'all') }}</p>
</div>
</div>
<div class=" user-div-right">
10:28
</div>
</div>
<div class="user-div" @click="onclickUserItem(null, 'ai')"
:class="{ 'select-user-item': currentSelectUser == 'ai' }">
<div class="user-div-left">
<img src="/openAi.png" />
<div class="user-name-msg">
<p class="font-name">Ai-ChatGpt</p>
<p class="font-msg">{{ getLastMessage(null, 'ai') }}</p>
</div>
</div>
<div class=" user-div-right">
@@ -259,14 +332,16 @@ const getLastMessage = ((receiveId, isAll) => {
</div>
<div v-for="(item, i) in currentUserItem" :key="i" @click="onclickUserItem(item, false)" class="user-div"
<div v-for="(item, i) in currentUserItem" :key="i" @click="onclickUserItem(item, 'user')" class="user-div"
:class="{ 'select-user-item': currentSelectUser?.userId == item.userId }">
<div class="user-div-left">
<img :src="getUrl(item.userIcon)" />
<img :src="getChatUrl(item.userIcon)" />
<div class="user-name-msg">
<p class="font-name">{{ item.userName }}</p>
<p class="font-msg">{{ getLastMessage(item.userId, false) }}</p>
<p class="font-msg">{{ getLastMessage(item.userId, 'user') }}</p>
</div>
</div>
<div class=" user-div-right">
@@ -296,18 +371,23 @@ const getLastMessage = ((receiveId, isAll) => {
</div>
<div class="content">
<div v-for="(item, i) in currentMsgContext" :key="i">
<!-- 对话框右侧 -->
<div class="content-myself content-common" v-if="item.sendUserId == userStore.id">
<div class="content-myself-msg content-msg-common ">{{ item.content }}</div>
<img :src="getUrl(item.sendUserInfo?.user.icon)" />
<img :src="getChatUrl(item.sendUserInfo?.user.icon,'right')" />
</div>
<!-- 对话框左侧 -->
<div class="content-others content-common" v-else>
<img :src="getUrl(item.sendUserInfo?.user.icon)" />
<img :src="getChatUrl(item.sendUserInfo?.user.icon,'left')" />
<div>
<p v-if="selectIsAll()" class="content-others-username">{{item.sendUserInfo?.user.userName}}</p>
<div class="content-others-msg content-msg-common " :class="{'content-others-msg-group':selectIsAll()}">
<p v-if="selectIsAll()" class="content-others-username">{{ item.sendUserInfo?.user.userName }}</p>
<div class="content-others-msg content-msg-common "
:class="{ 'content-others-msg-group': selectIsAll() }">
{{ item.content }}
</div>
</div>
@@ -712,16 +792,19 @@ const getLastMessage = ((receiveId, isAll) => {
justify-content: flex-start;
}
.content-others-username{
.content-others-username {
margin-left: 15px;
color: #B2B2B2;
position: relative;
top: -15px;
}
.content-others-msg-group{
}
.content-others-msg-group {
position: relative;
top: -10px;
}
.content-others-msg {
background-color: #FFFFFF;
padding: 10px 15px;

1
Yi.Bbs.Vue3/src/views/lucky/Index.vue
View File

@@ -83,7 +83,6 @@ const startCallback = () => {
try
{
const ddd=(await luckyWheel()).data;
console.log(ddd,"dd");
index= (await luckyWheel()).data;
}
catch

2
Yi.Bbs.Vue3/src/views/profile/UserAvatar.vue
View File

@@ -247,7 +247,7 @@ watch(
() => props,
(val,oldValue) => {
const userIcon=props.user.icon;
console.log(userIcon,"userIcon")
//console.log(userIcon,"userIcon")
options.img=userIcon == "" || userIcon == null
? "/acquiesce.png"
: import.meta.env.VITE_APP_BASEAPI + "/file/" + userIcon;

2
Yi.Bbs.Vue3/src/views/start/Index.vue
View File

@@ -61,7 +61,7 @@ onMounted(async() => {
const {data}= await GetResult();
nugetData.downloadNumber=data.downloadNumber;
nugetData.versions=data.versions[0];
console.log(data,"data");
//console.log(data,"data");
// 监听页面滚动事件
window.addEventListener("scroll", scrolling, true);

2
Yi.Bbs.Vue3/vite.config.js
View File

@@ -54,7 +54,7 @@ export default defineConfig(({ command, mode }) => {
bypass(req, res, options) {
const proxyUrl = options.target + options.rewrite(req.url);
console.log(proxyUrl);
// console.log(proxyUrl);
req.headers['X-req-proxyURL'] = proxyUrl;
res.setHeader('X-req-proxyURL', proxyUrl);