s
This commit is contained in:
Phoenix
parent
849c9b33f2
commit
6c2975fbbd
12
src/App.vue
12
src/App.vue
@ -7,7 +7,7 @@ import zhCN from 'ant-design-vue/es/locale/zh_CN';
|
||||
|
||||
const { theme, themeOverrides } = useTheme()
|
||||
const { language } = useLanguage()
|
||||
localStorage.setItem('token','46d71a72d8d845ad7ed23eba9bdde260e635407190c2ce1bf7fd22088e41682ea07773ec65cae8946d2003f264d55961f96e0fc5da10eb96d3a348c1664e9644e756eda7154e1af9e70d1c9d2f100823a26885ea6df3249fe619995cb79dc5dbd5ead32d43b955d6b3ce83129097bb21bb8169898f48692de4f966db140c71b85a2065acfc948561c465279fc05194a79a1115f3b00170944b6c4bd6c52ada909a075c55d18d76c2ed2175602421b34b27362a05c350733ed73382471df0a08950f7f1e812a610c17bdac82d82d54be38969f6b41201af79b8d36ef177c5b94bdd0b97501291f5dc1988d078f75b7de7fde85696e7a51443d1971ab54a97988fb4ced751732ef87ea638352124e2645128eb8977fcc63e3316cf2c94f10a9ff967353f430059dcda7b3d4f48288fb374d56461b354dab136b5b28029f29cfe5d')
|
||||
localStorage.setItem('token','46d71a72d8d845ad7ed23eba9bdde260e635407190c2ce1bf7fd22088e41682ea07773ec65cae8946d2003f264d55961f96e0fc5da10eb96d3a348c1664e9644e756eda7154e1af9e70d1c9d2f100823a26885ea6df3249fe619995cb79dc5dbd5ead32d43b955d6b3ce83129097bb21bb8169898f48692de4f966db140c71b85a2065acfc948561c465279fc05194a79a1115f3b00170944b6c4bd6c52ada909a075c55d18d76c2ed2175602421b34b27362a05c350733ed73382471df0a08950f7f1e812a610c17bdac82d82d54be38969f6b41201af79b8d36ef177c5b94bdd0b97501291f5dc1988d078f75b7de7bb902b70b460d03b130ea3172fffe37f766c751a46787bd5efff3becf755b544182ed4aa5d1622ca5093decade739e05bb85c590ef6a06c9bcb5c02e54a2b7b1a555d5e4a931de36687d42d6ab1b09b6')
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -29,5 +29,15 @@ localStorage.setItem('token','46d71a72d8d845ad7ed23eba9bdde260e635407190c2ce1bf7
|
||||
--el-color-primary:#764CF6!important;
|
||||
--n-loading-color:#764CF6!important;
|
||||
--n-caret-color:#764CF6!important;
|
||||
|
||||
}
|
||||
:where(.css-dev-only-do-not-override-19yxfbp).ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled){
|
||||
background-color: #dfd7f4;
|
||||
}
|
||||
:where(.css-dev-only-do-not-override-19yxfbp).ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer):hover .ant-select-selector{
|
||||
border-color: #764CF6!important;;
|
||||
}
|
||||
.ant-select-focused:where(.css-dev-only-do-not-override-19yxfbp).ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer) .ant-select-selector{
|
||||
border-color: #764CF6!important;;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -38,3 +38,13 @@ export const uploadImg = (data) => {
|
||||
data
|
||||
})
|
||||
}
|
||||
export const uploadFormData = (data) => {
|
||||
return request({
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
},
|
||||
url:'/chat/get-file-text',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
@ -31,7 +31,7 @@ export default {
|
||||
chat: {
|
||||
newChatButton: '新建聊天',
|
||||
newChatTitle: '新建聊天',
|
||||
placeholder: '来说点什么吧...（Shift + Enter = 换行，"/" 触发提示词）',
|
||||
placeholder: '来说点什么吧...（Shift + Enter = 换行）',
|
||||
placeholderMobile: '来说点什么...',
|
||||
copy: '复制',
|
||||
copied: '复制成功',
|
||||
|
||||
@ -12,7 +12,7 @@ const routes: RouteRecordRaw[] = [
|
||||
redirect: '/chat',
|
||||
children: [
|
||||
{
|
||||
path: '/chat/:uuid?',
|
||||
path: '/chat',
|
||||
name: 'Chat',
|
||||
component: () => import('@/views/chat/index.vue'),
|
||||
},
|
||||
|
||||
@ -8,6 +8,7 @@ export const sessionDetailForSetup = defineStore('session', () => {
|
||||
const currentListUuid=ref('')
|
||||
const gptMode=ref('gpt-3.5-turbo')
|
||||
const dataList = ref([]);
|
||||
const isStop = ref(false);
|
||||
const getDataList = async () => {
|
||||
const data = {
|
||||
page: 1,
|
||||
@ -42,7 +43,6 @@ const currentListUuid=ref('')
|
||||
conversationOpt:null,
|
||||
}
|
||||
})
|
||||
console.log(sessionDetail.value,'sessionDetail.value')
|
||||
detailData.value=res.data
|
||||
}
|
||||
}
|
||||
@ -53,6 +53,7 @@ const currentListUuid=ref('')
|
||||
const res=await createSession(data)
|
||||
if (res.code===0){
|
||||
getDataList()
|
||||
currentListUuid.value=res.data.listUuid
|
||||
}
|
||||
}
|
||||
const deleteSession =async () => {
|
||||
@ -61,5 +62,5 @@ const currentListUuid=ref('')
|
||||
getDataList()
|
||||
}
|
||||
}
|
||||
return { sessionDetail,currentListUuid ,gptMode,getDataList,dataList,getSessionDetail,createSessionStore,deleteSession};
|
||||
return { sessionDetail,currentListUuid ,gptMode,getDataList,dataList,getSessionDetail,createSessionStore,deleteSession,isStop};
|
||||
});
|
||||
|
||||
@ -825,7 +825,7 @@ html {
|
||||
.markdown-body pre {
|
||||
padding: 16px;
|
||||
overflow: auto;
|
||||
font-size: 85%;
|
||||
font-size: 100%;
|
||||
line-height: 1.45;
|
||||
background-color: var(--color-canvas-subtle);
|
||||
border-radius: 6px;
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
import axios from "axios";
|
||||
import { ElLoading } from 'element-plus'
|
||||
const request = axios.create({
|
||||
baseURL:'http://114.218.158.24:9020',
|
||||
baseURL:import.meta.env.VITE_APP_API_BASE_URL,
|
||||
timeout:5000
|
||||
});
|
||||
let loading
|
||||
@ -18,5 +18,7 @@ loading=ElLoading.service({
|
||||
request.interceptors.response.use((res)=>{
|
||||
loading.close()
|
||||
return res.data;
|
||||
},()=>{
|
||||
loading.close()
|
||||
});
|
||||
export default request;
|
||||
|
||||
@ -108,7 +108,7 @@ onUnmounted(() => {
|
||||
<div class="text-black" :class="wrapClass">
|
||||
<div ref="textRef" class="leading-relaxed break-words">
|
||||
<div v-if="!inversion">
|
||||
<div v-if="!asRawText" class="markdown-body" :class="{ 'markdown-body-generate': loading }" v-html="text" />
|
||||
<div v-if="!asRawText" class="markdown-body" style="font-size: 14px" :class="{ 'markdown-body-generate': loading }" v-html="text" />
|
||||
<div v-else class="whitespace-pre-wrap" v-text="text" />
|
||||
</div>
|
||||
<div v-else class="whitespace-pre-wrap" >
|
||||
|
||||
@ -45,12 +45,12 @@ const options = computed(() => {
|
||||
label: t('chat.copy'),
|
||||
key: 'copyText',
|
||||
icon: iconRender({ icon: 'ri:file-copy-2-line' }),
|
||||
},
|
||||
}/* ,
|
||||
{
|
||||
label: t('common.delete'),
|
||||
key: 'delete',
|
||||
icon: iconRender({ icon: 'ri:delete-bin-line' }),
|
||||
},
|
||||
}, */
|
||||
]
|
||||
|
||||
if (!props.inversion) {
|
||||
@ -122,14 +122,15 @@ async function handleCopy() {
|
||||
:loading="loading"
|
||||
:as-raw-text="asRawText"
|
||||
/>
|
||||
<div class="flex flex-col">
|
||||
<button
|
||||
|
||||
<div v-if="!loading" class="flex flex-col">
|
||||
<!-- <button
|
||||
v-if="!inversion"
|
||||
class="mb-2 transition text-neutral-300 hover:text-neutral-800 dark:hover:text-neutral-300"
|
||||
@click="handleRegenerate"
|
||||
>
|
||||
<SvgIcon icon="ri:restart-line" />
|
||||
</button>
|
||||
</button>-->
|
||||
<NDropdown
|
||||
:trigger="isMobile ? 'click' : 'hover'"
|
||||
:placement="!inversion ? 'right' : 'left'"
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<script setup >
|
||||
import {uploadImg} from "@/api/api";
|
||||
import {uploadFormData, uploadImg} from "@/api/api";
|
||||
import dayjs from "dayjs";
|
||||
import { computed, onMounted, onUnmounted, ref,watch } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
@ -16,30 +16,21 @@ import { useBasicLayout } from '@/hooks/useBasicLayout'
|
||||
import { useChatStore, usePromptStore } from '@/store'
|
||||
import { fetchChatAPIProcess } from '@/api'
|
||||
import { t } from '@/locales'
|
||||
import { UploadOutlined } from '@ant-design/icons-vue';
|
||||
import {storeToRefs} from 'pinia'
|
||||
import { sessionDetailForSetup } from '@/store'
|
||||
const sessionDetailData=sessionDetailForSetup()
|
||||
let controller = new AbortController()
|
||||
const { sessionDetail:dataSources ,currentListUuid,gptMode} = storeToRefs(sessionDetailData)
|
||||
const openLongReply = import.meta.env.VITE_GLOB_OPEN_LONG_REPLY === 'true'
|
||||
const route = useRoute()
|
||||
const { sessionDetail:dataSources ,currentListUuid,gptMode,isStop} = storeToRefs(sessionDetailData)
|
||||
|
||||
const dialog = useDialog()
|
||||
const ms = useMessage()
|
||||
|
||||
const chatStore = useChatStore()
|
||||
|
||||
const { isMobile } = useBasicLayout()
|
||||
const { addChat, updateChat, updateChatSome, getChatByUuidAndIndex } = useChat()
|
||||
const { scrollRef, scrollToBottom, scrollToBottomIfAtBottom } = useScroll()
|
||||
const { usingContext, toggleUsingContext } = useUsingContext()
|
||||
|
||||
const { uuid } = route.params
|
||||
if (uuid){
|
||||
currentListUuid.value=uuid
|
||||
sessionDetailData.getSessionDetail()
|
||||
}
|
||||
const conversationList = computed(() => dataSources.value.filter(item => (!item.inversion && !!item.conversationOptions)))
|
||||
const dataSessionDetail=ref([])
|
||||
const prompt = ref('')
|
||||
const loading = ref(false)
|
||||
const inputRef = ref(null)
|
||||
@ -59,15 +50,15 @@ dataSources.value.forEach((item, index) => {
|
||||
function handleSubmit() {
|
||||
dataSources.value.push({
|
||||
dateTime: dayjs().format('YYYY/MM/DD HH:mm:ss'),
|
||||
text: prompt.value,
|
||||
text: prompt.value,
|
||||
inversion: true,
|
||||
error: false,
|
||||
fileList:fileList.value.map(x=>x.url)
|
||||
fileList:fileList.value.map(x=>x.url),
|
||||
loading:false
|
||||
})
|
||||
sendDataStream()
|
||||
/* onConversation() */
|
||||
}
|
||||
const API_URL = 'http://114.218.158.24:9020/chat/completion';
|
||||
const API_URL = `${import.meta.env.VITE_APP_API_BASE_URL}/chat/completion`;
|
||||
|
||||
const createParams = () => {
|
||||
const messages = dataSources.value.map((x) => {
|
||||
@ -85,6 +76,7 @@ const createParams = () => {
|
||||
}
|
||||
});
|
||||
return {
|
||||
type:isFile.value?'custom':'',
|
||||
listUuid: currentListUuid.value,
|
||||
messages,
|
||||
frequency_penalty: 0,
|
||||
@ -96,7 +88,6 @@ const createParams = () => {
|
||||
top_p: 1
|
||||
};
|
||||
};
|
||||
|
||||
const handleResponseStream = async (reader) => {
|
||||
const { done, value } = await reader.read();
|
||||
if (!done) {
|
||||
@ -105,10 +96,16 @@ const handleResponseStream = async (reader) => {
|
||||
decodedArray.forEach((decoded) => {
|
||||
if (decoded !== "") {
|
||||
if (decoded.trim() === "[DONE]") {
|
||||
|
||||
dataSources.value[dataSources.value.length - 1].loading=false
|
||||
loading.value=false
|
||||
return;
|
||||
} else {
|
||||
console.log(decoded,'decoded')
|
||||
if (isStop.value){
|
||||
loading.value=false
|
||||
return;
|
||||
}
|
||||
loading.value=true
|
||||
dataSources.value[dataSources.value.length - 1].loading=true
|
||||
const response = JSON.parse(decoded).choices[0].delta.content
|
||||
? JSON.parse(decoded).choices[0].delta.content
|
||||
: "";
|
||||
@ -120,18 +117,21 @@ const handleResponseStream = async (reader) => {
|
||||
await handleResponseStream(reader);
|
||||
}
|
||||
};
|
||||
|
||||
const sendDataStream = async () => {
|
||||
const params = createParams();
|
||||
fileList.value=[]
|
||||
prompt.value=''
|
||||
isStop.value=false
|
||||
dataSources.value.push({
|
||||
dateTime: dayjs().format('YYYY/MM/DD HH:mm:ss'),
|
||||
text: '',
|
||||
text: '思考中..',
|
||||
inversion: false,
|
||||
error: false,
|
||||
loading:true
|
||||
});
|
||||
visible.value=false
|
||||
try {
|
||||
loading.value=true
|
||||
const response = await fetch(API_URL, {
|
||||
method: "POST",
|
||||
timeout: 10000,
|
||||
@ -143,273 +143,16 @@ const sendDataStream = async () => {
|
||||
},
|
||||
});
|
||||
|
||||
console.log(dataSources.value,'dataSources.value')
|
||||
const contentType = response.headers.get('Content-Type');
|
||||
if (!contentType || !contentType.includes('application/json')) {
|
||||
const reader = response.body.getReader();
|
||||
dataSources.value[dataSources.value.length-1].text=''
|
||||
await handleResponseStream(reader);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('发生错误:', error);
|
||||
}
|
||||
};
|
||||
|
||||
async function onConversation() {
|
||||
let message = prompt.value
|
||||
|
||||
if (loading.value)
|
||||
return
|
||||
|
||||
if (!message || message.trim() === '')
|
||||
return
|
||||
|
||||
controller = new AbortController()
|
||||
|
||||
addChat(
|
||||
+uuid,
|
||||
{
|
||||
dateTime: new Date().toLocaleString(),
|
||||
text: message,
|
||||
inversion: true,
|
||||
error: false,
|
||||
conversationOptions: null,
|
||||
requestOptions: { prompt: message, options: null },
|
||||
},
|
||||
)
|
||||
scrollToBottom()
|
||||
|
||||
loading.value = true
|
||||
prompt.value = ''
|
||||
|
||||
let options= {}
|
||||
const lastContext = conversationList.value[conversationList.value.length - 1]?.conversationOptions
|
||||
|
||||
if (lastContext && usingContext.value)
|
||||
options = { ...lastContext }
|
||||
|
||||
addChat(
|
||||
+uuid,
|
||||
{
|
||||
dateTime: new Date().toLocaleString(),
|
||||
text: t('chat.thinking'),
|
||||
loading: true,
|
||||
inversion: false,
|
||||
error: false,
|
||||
conversationOptions: null,
|
||||
requestOptions: { prompt: message, options: { ...options } },
|
||||
},
|
||||
)
|
||||
scrollToBottom()
|
||||
|
||||
try {
|
||||
let lastText = ''
|
||||
const fetchChatAPIOnce = async () => {
|
||||
await fetchChatAPIProcess<Chat.ConversationResponse>({
|
||||
prompt: message,
|
||||
options,
|
||||
signal: controller.signal,
|
||||
onDownloadProgress: ({ event }) => {
|
||||
const xhr = event.target
|
||||
const { responseText } = xhr
|
||||
// Always process the final line
|
||||
const lastIndex = responseText.lastIndexOf('\n', responseText.length - 2)
|
||||
let chunk = responseText
|
||||
if (lastIndex !== -1)
|
||||
chunk = responseText.substring(lastIndex)
|
||||
try {
|
||||
const data = JSON.parse(chunk)
|
||||
updateChat(
|
||||
+uuid,
|
||||
dataSources.value.length - 1,
|
||||
{
|
||||
dateTime: new Date().toLocaleString(),
|
||||
text: lastText + (data.text ?? ''),
|
||||
inversion: false,
|
||||
error: false,
|
||||
loading: true,
|
||||
conversationOptions: { conversationId: data.conversationId, parentMessageId: data.id },
|
||||
requestOptions: { prompt: message, options: { ...options } },
|
||||
},
|
||||
)
|
||||
if (openLongReply && data.detail.choices[0].finish_reason === 'length') {
|
||||
options.parentMessageId = data.id
|
||||
lastText = data.text
|
||||
message = ''
|
||||
return fetchChatAPIOnce()
|
||||
}
|
||||
|
||||
scrollToBottomIfAtBottom()
|
||||
}
|
||||
catch (error) {
|
||||
//
|
||||
}
|
||||
},
|
||||
})
|
||||
updateChatSome(+uuid, dataSources.value.length - 1, { loading: false })
|
||||
}
|
||||
|
||||
await fetchChatAPIOnce()
|
||||
}
|
||||
catch (error) {
|
||||
const errorMessage = error?.message ?? t('common.wrong')
|
||||
|
||||
if (error.message === 'canceled') {
|
||||
updateChatSome(
|
||||
+uuid,
|
||||
dataSources.value.length - 1,
|
||||
{
|
||||
loading: false,
|
||||
},
|
||||
)
|
||||
scrollToBottomIfAtBottom()
|
||||
return
|
||||
}
|
||||
|
||||
const currentChat = getChatByUuidAndIndex(+uuid, dataSources.value.length - 1)
|
||||
|
||||
if (currentChat?.text && currentChat.text !== '') {
|
||||
updateChatSome(
|
||||
+uuid,
|
||||
dataSources.value.length - 1,
|
||||
{
|
||||
text: `${currentChat.text}\n[${errorMessage}]`,
|
||||
error: false,
|
||||
loading: false,
|
||||
},
|
||||
)
|
||||
return
|
||||
}
|
||||
updateChat(
|
||||
+uuid,
|
||||
dataSources.value.length - 1,
|
||||
{
|
||||
dateTime: new Date().toLocaleString(),
|
||||
text: errorMessage,
|
||||
inversion: false,
|
||||
error: true,
|
||||
loading: false,
|
||||
conversationOptions: null,
|
||||
requestOptions: { prompt: message, options: { ...options } },
|
||||
},
|
||||
)
|
||||
scrollToBottomIfAtBottom()
|
||||
}
|
||||
finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/* async function onRegenerate(index) {
|
||||
if (loading.value)
|
||||
return
|
||||
|
||||
controller = new AbortController()
|
||||
|
||||
const { requestOptions } = dataSources.value[index]
|
||||
|
||||
let message = requestOptions?.prompt ?? ''
|
||||
|
||||
let options = {}
|
||||
|
||||
if (requestOptions.options)
|
||||
options = { ...requestOptions.options }
|
||||
|
||||
loading.value = true
|
||||
|
||||
updateChat(
|
||||
+uuid,
|
||||
index,
|
||||
{
|
||||
dateTime: new Date().toLocaleString(),
|
||||
text: '',
|
||||
inversion: false,
|
||||
error: false,
|
||||
loading: true,
|
||||
conversationOptions: null,
|
||||
requestOptions: { prompt: message, options: { ...options } },
|
||||
},
|
||||
)
|
||||
|
||||
try {
|
||||
let lastText = ''
|
||||
const fetchChatAPIOnce = async () => {
|
||||
await fetchChatAPIProcess<Chat.ConversationResponse>({
|
||||
prompt: message,
|
||||
options,
|
||||
signal: controller.signal,
|
||||
onDownloadProgress: ({ event }) => {
|
||||
const xhr = event.target
|
||||
const { responseText } = xhr
|
||||
// Always process the final line
|
||||
const lastIndex = responseText.lastIndexOf('\n', responseText.length - 2)
|
||||
let chunk = responseText
|
||||
if (lastIndex !== -1)
|
||||
chunk = responseText.substring(lastIndex)
|
||||
try {
|
||||
const data = JSON.parse(chunk)
|
||||
updateChat(
|
||||
+uuid,
|
||||
index,
|
||||
{
|
||||
dateTime: new Date().toLocaleString(),
|
||||
text: lastText + (data.text ?? ''),
|
||||
inversion: false,
|
||||
error: false,
|
||||
loading: true,
|
||||
conversationOptions: { conversationId: data.conversationId, parentMessageId: data.id },
|
||||
requestOptions: { prompt: message, options: { ...options } },
|
||||
},
|
||||
)
|
||||
|
||||
if (openLongReply && data.detail.choices[0].finish_reason === 'length') {
|
||||
options.parentMessageId = data.id
|
||||
lastText = data.text
|
||||
message = ''
|
||||
return fetchChatAPIOnce()
|
||||
}
|
||||
}
|
||||
catch (error) {
|
||||
//
|
||||
}
|
||||
},
|
||||
})
|
||||
updateChatSome(+uuid, index, { loading: false })
|
||||
}
|
||||
await fetchChatAPIOnce()
|
||||
}
|
||||
catch (error) {
|
||||
if (error.message === 'canceled') {
|
||||
updateChatSome(
|
||||
+uuid,
|
||||
index,
|
||||
{
|
||||
loading: false,
|
||||
},
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
const errorMessage = error?.message ?? t('common.wrong')
|
||||
|
||||
updateChat(
|
||||
+uuid,
|
||||
index,
|
||||
{
|
||||
dateTime: new Date().toLocaleString(),
|
||||
text: errorMessage,
|
||||
inversion: false,
|
||||
error: true,
|
||||
loading: false,
|
||||
conversationOptions: null,
|
||||
requestOptions: { prompt: message, options: { ...options } },
|
||||
},
|
||||
)
|
||||
}
|
||||
finally {
|
||||
loading.value = false
|
||||
}
|
||||
} */
|
||||
|
||||
function handleExport() {
|
||||
if (loading.value)
|
||||
return
|
||||
@ -496,11 +239,10 @@ function handleEnter(event) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function handleStop() {
|
||||
if (loading.value) {
|
||||
controller.abort()
|
||||
loading.value = false
|
||||
isStop.value=true
|
||||
}
|
||||
}
|
||||
|
||||
@ -583,15 +325,38 @@ const handlePreview = async (file) => {
|
||||
};
|
||||
const value = ref('gpt-3.5-turbo');
|
||||
const visible=ref(false)
|
||||
const options=ref([{ label: 'GPT-3.5', value: 'gpt-3.5-turbo' },
|
||||
{ label: 'GPT-4.0', value: 'gpt-4-1106-preview' },
|
||||
{ label: 'GPT-V', value: 'gpt-4-vision-preview' }])
|
||||
const removeImg=(data)=>{
|
||||
fileList.value.splice(fileList.value.findIndex(x=>x.url===data.url),1)
|
||||
}
|
||||
watch(gptMode,()=>{
|
||||
currentListUuid.value=''
|
||||
dataSources.value=[]
|
||||
})
|
||||
const visible1=ref(false)
|
||||
const fileList1=ref([])
|
||||
const isFile=ref(false)
|
||||
const upItemImage1= async (file)=>{
|
||||
const data = {
|
||||
file: file.file,
|
||||
}
|
||||
const res=await uploadFormData(data)
|
||||
if (res.code===0){
|
||||
file.onSuccess()
|
||||
dataSources.value=[...dataSources.value,...res.data.paragraph.flatMap(n=>[n,'']).map((x)=>{
|
||||
return {
|
||||
dateTime: dayjs().format('YYYY/MM/DD HH:mm:ss'),
|
||||
text: x,
|
||||
inversion: Boolean(x),
|
||||
error: false,
|
||||
}
|
||||
})]
|
||||
isFile.value=true
|
||||
fileList1.value=[]
|
||||
visible1.value=false
|
||||
sendDataStream()
|
||||
}
|
||||
|
||||
}
|
||||
const customRequest=async (file)=>{
|
||||
const res=await uploadImg({file:file.file,source:'approval'})
|
||||
if (res.code===0){
|
||||
@ -600,21 +365,10 @@ const customRequest=async (file)=>{
|
||||
url:res.data.ori_url
|
||||
})
|
||||
}
|
||||
console.log(res,'res')
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div class="flex flex-col w-full h-full">
|
||||
<div style="margin-top: 15px;margin-left: 15px">
|
||||
<a-select
|
||||
align="center"
|
||||
v-model:value="gptMode"
|
||||
style="width: 120px"
|
||||
:dropdown-match-select-width="false"
|
||||
>
|
||||
<a-select-option align="center" v-for="(item,index) in options" :key="index" :value="item.value">{{item.label}}</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
<HeaderComponent
|
||||
v-if="isMobile"
|
||||
:using-context="usingContext"
|
||||
@ -631,13 +385,13 @@ const customRequest=async (file)=>{
|
||||
<template v-if="!dataSources.length">
|
||||
<div class="flex items-center justify-center mt-4 text-center text-neutral-300">
|
||||
<SvgIcon icon="ri:bubble-chart-fill" class="mr-2 text-3xl" />
|
||||
<span>{{ t('chat.newChatTitle') }}</span>
|
||||
<span>当前没有会话哦</span>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div>
|
||||
<Message
|
||||
v-for="(item, index) of dataSources"
|
||||
v-for="(item, index) of dataSources.filter(x=>x.text||x.fileList?.length>0)"
|
||||
:key="index"
|
||||
:date-time="item.dateTime"
|
||||
:text="item.text"
|
||||
@ -645,7 +399,6 @@ const customRequest=async (file)=>{
|
||||
:inversion="item.inversion"
|
||||
:error="item.error"
|
||||
:loading="item.loading"
|
||||
@regenerate="onRegenerate(index)"
|
||||
@delete="handleDelete(index)"
|
||||
/>
|
||||
<div class="sticky bottom-0 left-0 flex justify-center">
|
||||
@ -653,7 +406,7 @@ const customRequest=async (file)=>{
|
||||
<template #icon>
|
||||
<SvgIcon icon="ri:stop-circle-line" />
|
||||
</template>
|
||||
{{ t('common.stopResponding') }}
|
||||
停止响应
|
||||
</NButton>
|
||||
</div>
|
||||
</div>
|
||||
@ -664,6 +417,28 @@ const customRequest=async (file)=>{
|
||||
<footer :class="footerClass">
|
||||
<div class="w-full max-w-screen-xl m-auto">
|
||||
<div class="flex items-center justify-between space-x-2" style="flex-wrap: initial">
|
||||
<a-popover :open="visible1" trigger="click">
|
||||
<template #content>
|
||||
<div class="clearfix">
|
||||
<a-upload
|
||||
:max-count="1"
|
||||
v-model:file-list="fileList1"
|
||||
name="file"
|
||||
:customRequest="upItemImage1"
|
||||
>
|
||||
<a-button>
|
||||
<upload-outlined></upload-outlined>
|
||||
上传文件
|
||||
</a-button>
|
||||
</a-upload>
|
||||
</div>
|
||||
</template>
|
||||
<HoverButton @click="visible1=!visible1">
|
||||
<span class="text-xl text-[#4f555e] dark:text-white" style="display: flex;justify-content: center;align-items: center">
|
||||
<SvgIcon icon="ri:upload-2-line" />
|
||||
</span>
|
||||
</HoverButton>
|
||||
</a-popover>
|
||||
<a-popover v-if="gptMode==='gpt-4-vision-preview'" :open="visible" trigger="click">
|
||||
<template #content>
|
||||
<div class="clearfix">
|
||||
@ -720,7 +495,7 @@ const customRequest=async (file)=>{
|
||||
/>
|
||||
</template>
|
||||
</NAutoComplete>
|
||||
<NButton type="primary" :disabled="buttonDisabled" @click="handleSubmit">
|
||||
<NButton color="#8a2be2" type="primary" :disabled="buttonDisabled" @click="handleSubmit">
|
||||
<template #icon>
|
||||
<span class="dark:text-black">
|
||||
<SvgIcon icon="ri:send-plane-fill" />
|
||||
|
||||
@ -35,7 +35,7 @@ const getContainerClass = computed(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="h-full dark:bg-[#24272e] transition-all" :class="[isMobile ? 'p-0' : 'p-4']">
|
||||
<div class="h-full dark:bg-[#24272e] transition-all" :class="[isMobile ? 'p-0' : 'p-0']">
|
||||
<div class="h-full overflow-hidden" :class="getMobileClass">
|
||||
<NLayout class="z-40 transition" :class="getContainerClass" has-sider>
|
||||
<Sider />
|
||||
|
||||
@ -8,44 +8,27 @@ import { useAppStore, useChatStore } from '@/store'
|
||||
import { useBasicLayout } from '@/hooks/useBasicLayout'
|
||||
import { sessionDetailForSetup } from '@/store'
|
||||
const sessionDetailData=sessionDetailForSetup()
|
||||
const { dataList,gptMode,currentListUuid } = storeToRefs(sessionDetailData)
|
||||
|
||||
const { isMobile } = useBasicLayout()
|
||||
const appStore = useAppStore()
|
||||
const { dataList,gptMode,currentListUuid,sessionDetail,isStop } = storeToRefs(sessionDetailData)
|
||||
const chatStore = useChatStore()
|
||||
async function handleSelect({ listUuid }) {
|
||||
if (isActive(listUuid)){
|
||||
return
|
||||
}
|
||||
isStop.value=true
|
||||
sessionDetail.value=[]
|
||||
currentListUuid.value=listUuid
|
||||
sessionDetailData.getSessionDetail()
|
||||
if (isActive(listUuid)){
|
||||
return
|
||||
}
|
||||
|
||||
if (chatStore.active)
|
||||
chatStore.updateHistory(chatStore.active, { isEdit: false })
|
||||
await chatStore.setActive(listUuid)
|
||||
|
||||
if (isMobile.value)
|
||||
appStore.setSiderCollapsed(true)
|
||||
}
|
||||
sessionDetailData.getDataList()
|
||||
|
||||
function handleEdit({ listUuid }, isEdit, event) {
|
||||
event?.stopPropagation()
|
||||
chatStore.updateHistory(listUuid, { isEdit })
|
||||
function handleEdit({ listUuid }) {
|
||||
const item= dataList.value?.find((x)=>{
|
||||
return x.listUuid===listUuid
|
||||
})
|
||||
item.isEdit=true
|
||||
}
|
||||
|
||||
/* function handleDelete(index, event) {
|
||||
event?.stopPropagation()
|
||||
chatStore.deleteHistory(index)
|
||||
if (isMobile.value)
|
||||
appStore.setSiderCollapsed(true)
|
||||
} */
|
||||
|
||||
//const handleDeleteDebounce = debounce(handleDelete, 600)
|
||||
const handleDeleteDebounce = ()=>{
|
||||
sessionDetailData.deleteSession()
|
||||
}
|
||||
|
||||
function handleEnter({ listUuid }, isEdit, event) {
|
||||
event?.stopPropagation()
|
||||
if (event.key === 'Enter')
|
||||
@ -53,8 +36,9 @@ function handleEnter({ listUuid }, isEdit, event) {
|
||||
}
|
||||
|
||||
function isActive(listUuid) {
|
||||
return chatStore.active === listUuid
|
||||
return currentListUuid.value === listUuid
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -91,9 +75,9 @@ function isActive(listUuid) {
|
||||
</button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<button class="p-1">
|
||||
<!-- <button class="p-1">
|
||||
<SvgIcon icon="ri:edit-line" @click.stop="handleEdit(item, true, $event)" />
|
||||
</button>
|
||||
</button>-->
|
||||
|
||||
<NPopconfirm placement="bottom" @positive-click.stop="handleDeleteDebounce(index, $event)">
|
||||
<template #trigger>
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<script setup>
|
||||
import {createSession} from "@/api/api";
|
||||
import {storeToRefs} from "pinia";
|
||||
import { computed, ref, watch } from 'vue'
|
||||
import { NButton, NLayoutSider, useDialog } from 'naive-ui'
|
||||
import List from './List.vue'
|
||||
@ -9,7 +10,8 @@ import { useBasicLayout } from '@/hooks/useBasicLayout'
|
||||
import { PromptStore, SvgIcon } from '@/components/common'
|
||||
import { t } from '@/locales'
|
||||
import {sessionDetailForSetup} from "@/store";
|
||||
|
||||
const sessionDetailData=sessionDetailForSetup()
|
||||
const {sessionDetail, dataList,gptMode,currentListUuid } = storeToRefs(sessionDetailData)
|
||||
const appStore = useAppStore()
|
||||
const chatStore = useChatStore()
|
||||
|
||||
@ -22,6 +24,7 @@ const collapsed = computed(() => appStore.siderCollapsed)
|
||||
|
||||
async function handleAdd() {
|
||||
await sessionDetailForSetup().createSessionStore()
|
||||
await chatStore.setActive(currentListUuid.value)
|
||||
/* chatStore.addHistory({ title: t('chat.newChatTitle'), uuid: Date.now(), isEdit: false })
|
||||
if (isMobile.value)
|
||||
appStore.setSiderCollapsed(true) */
|
||||
@ -63,7 +66,9 @@ const mobileSafeArea = computed(() => {
|
||||
}
|
||||
return {}
|
||||
})
|
||||
|
||||
const options=ref([{ label: 'GPT-3.5', value: 'gpt-3.5-turbo' },
|
||||
{ label: 'GPT-4.0', value: 'gpt-4-1106-preview' },
|
||||
{ label: 'GPT-V', value: 'gpt-4-vision-preview' }])
|
||||
watch(
|
||||
isMobile,
|
||||
(val) => {
|
||||
@ -79,8 +84,8 @@ watch(
|
||||
<template>
|
||||
<NLayoutSider
|
||||
:collapsed="collapsed"
|
||||
:collapsed-width="0"
|
||||
:width="260"
|
||||
:collapsed-width="15"
|
||||
:width="270"
|
||||
:show-trigger="isMobile ? false : 'arrow-circle'"
|
||||
collapse-mode="transform"
|
||||
position="absolute"
|
||||
@ -90,10 +95,20 @@ watch(
|
||||
>
|
||||
<div class="flex flex-col h-full" :style="mobileSafeArea">
|
||||
<main class="flex flex-col flex-1 min-h-0">
|
||||
<div class="p-4">
|
||||
<NButton dashed block @click="handleAdd">
|
||||
{{ $t('chat.newChatButton') }}
|
||||
<div class="p-4" style="display: flex">
|
||||
<NButton color="#764CF6" style="flex:0.9;display: flex;justify-content: center;align-items: center;margin-right: auto" dashed block @click="handleAdd">
|
||||
新建会话
|
||||
</NButton>
|
||||
<div >
|
||||
<a-select
|
||||
align="center"
|
||||
v-model:value="gptMode"
|
||||
style="width: 110px"
|
||||
:dropdown-match-select-width="false"
|
||||
>
|
||||
<a-select-option align="center" v-for="(item,index) in options" :key="index" :value="item.value">{{item.label}}</a-select-option>
|
||||
</a-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-1 min-h-0 pb-4 overflow-hidden">
|
||||
<List />
|
||||
|
||||
Loading…
Reference in New Issue
Block a user