xinyin025/geekai
1
0
Fork 0
mirror of https://github.com/yangjian102621/geekai.git synced 2026-02-19 04:44:27 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

merge v4.1.3

Browse Source
This commit is contained in:
RockYang
2024-12-16 10:07:52 +08:00
parent e04a48623d 6d8901fa21
commit 5b7f2603ae
134 changed files with 4804 additions and 1583 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
web/src/views/ChatApps.vue
View File

@@ -89,7 +89,8 @@ onMounted(() => {
const getRoles = () => {
checkSession().then(user => {
roles.value = user.chat_roles
}).catch(() => {
}).catch(e => {
console.log(e.message)
})
}

271
web/src/views/ChatPlus.vue
View File

@@ -3,7 +3,7 @@
<el-container>
<el-aside>
<div class="chat-list">
<el-button @click="newChat" color="#21aa93">
<el-button @click="_newChat" color="#21aa93">
<el-icon style="margin-right: 5px">
<Plus/>
</el-icon>
@@ -23,7 +23,7 @@
<div class="content" :style="{height: leftBoxHeight+'px'}">
<el-row v-for="chat in chatList" :key="chat.chat_id">
<div :class="chat.chat_id === activeChat.chat_id?'chat-list-item active':'chat-list-item'"
<div :class="chat.chat_id === chatId?'chat-list-item active':'chat-list-item'"
@click="loadChat(chat)">
<el-image :src="chat.icon" class="avatar"/>
<span class="chat-title-input" v-if="chat.edit">
@@ -100,11 +100,25 @@
</el-option>
</el-select>
<el-dropdown :hide-on-click="false" trigger="click">
<span class="setting"><i class="iconfont icon-plugin"></i></span>
<template #dropdown>
<el-dropdown-menu class="tools-dropdown">
<el-checkbox-group v-model="toolSelected">
<el-dropdown-item v-for="item in tools" :key="item.id">
<el-checkbox :value="item.id" :label="item.label" @change="changeTool" />
<el-tooltip :content="item.description" placement="right">
<el-icon><InfoFilled /></el-icon>
</el-tooltip>
</el-dropdown-item>
</el-checkbox-group>
</el-dropdown-menu>
</template>
</el-dropdown>
<span class="setting" @click="showChatSetting = true">
<el-tooltip class="box-item" effect="dark" content="对话设置">
<i class="iconfont icon-config"></i>
</el-tooltip>
</span>
<i class="iconfont icon-config"></i>
</span>
</div>
<div>
@@ -184,11 +198,13 @@
>
<div class="notice">
<div v-html="notice"></div>
<p style="text-align: right">
<el-button @click="notShow" type="success" plain>我知道了，不再显示</el-button>
</p>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="notShow" type="success" plain>我知道了，不再显示</el-button>
</span>
</template>
</el-dialog>
<ChatSetting :show="showChatSetting" @hide="showChatSetting = false"/>
@@ -200,7 +216,7 @@
import {nextTick, onMounted, onUnmounted, ref, watch} from 'vue'
import ChatPrompt from "@/components/ChatPrompt.vue";
import ChatReply from "@/components/ChatReply.vue";
import {Delete, Edit, More, Plus, Promotion, Search, Share, VideoPause} from '@element-plus/icons-vue'
import {Delete, Edit, InfoFilled, More, Plus, Promotion, Search, Share, VideoPause} from '@element-plus/icons-vue'
import 'highlight.js/styles/a11y-dark.css'
import {
isMobile,
@@ -209,7 +225,7 @@ import {
UUID
} from "@/utils/libs";
import {ElMessage, ElMessageBox} from "element-plus";
import {getSessionId, getUserToken, removeUserToken} from "@/store/session";
import {getSessionId, getUserToken} from "@/store/session";
import {httpGet, httpPost} from "@/utils/http";
import {useRouter} from "vue-router";
import Clipboard from "clipboard";
@@ -221,23 +237,22 @@ import FileList from "@/components/FileList.vue";
import ChatSetting from "@/components/ChatSetting.vue";
import BackTop from "@/components/BackTop.vue";
import {showMessageError} from "@/utils/dialog";
import hl from "highlight.js";
const title = ref('ChatGPT-智能助手');
const title = ref('GeekAI-智能助手');
const models = ref([])
const modelID = ref(0)
const chatData = ref([]);
const allChats = ref([]); // 会话列表
const chatList = ref(allChats.value);
const activeChat = ref({});
const mainWinHeight = ref(0); // 主窗口高度
const chatBoxHeight = ref(0); // 聊天内容框高度
const leftBoxHeight = ref(0);
const loading = ref(true);
const loading = ref(false);
const loginUser = ref(null);
const roles = ref([]);
const router = useRouter();
const roleId = ref(0)
const chatId = ref();
const newChatItem = ref(null);
const isLogin = ref(false)
const showHello = ref(true)
@@ -253,7 +268,27 @@ const listStyle = ref(store.chatListStyle)
watch(() => store.chatListStyle, (newValue) => {
listStyle.value = newValue
});
const tools = ref([])
const toolSelected = ref([])
const loadHistory = ref(false)
// 初始化角色ID参数
if (router.currentRoute.value.query.role_id) {
roleId.value = parseInt(router.currentRoute.value.query.role_id)
}
// 初始化 ChatID
chatId.value = router.currentRoute.value.params.id
if (!chatId.value) {
chatId.value = UUID()
}else { // 查询对话信息
httpGet("/api/chat/detail", {chat_id: chatId.value}).then(res => {
roleId.value = res.data.role_id
modelID.value = res.data.model_id
}).catch(e => {
console.error("获取对话信息失败："+e.message)
})
}
if (isMobile()) {
router.replace("/mobile/chat")
@@ -289,6 +324,13 @@ httpGet("/api/config/get?key=notice").then(res => {
ElMessage.error("获取系统配置失败：" + e.message)
})
// 获取工具函数
httpGet("/api/function/list").then(res => {
tools.value = res.data
}).catch(e => {
showMessageError("获取工具函数失败：" + e.message)
})
onMounted(() => {
resizeElement();
initData()
@@ -314,60 +356,46 @@ onUnmounted(() => {
// 初始化数据
const initData = () => {
// 检查会话
checkSession().then((user) => {
loginUser.value = user
isLogin.value = true
// 获取会话列表
httpGet("/api/chat/list").then((res) => {
if (res.data) {
chatList.value = res.data;
allChats.value = res.data;
}
if (router.currentRoute.value.query.role_id) {
roleId.value = parseInt(router.currentRoute.value.query.role_id)
}
// 加载模型
httpGet('/api/model/list').then(res => {
models.value = res.data
modelID.value = models.value[0].id
// 加载角色列表
httpGet(`/api/role/list`,{id:roleId.value}).then((res) => {
roles.value = res.data;
if (!roleId.value) {
roleId.value = roles.value[0]['id']
}
newChat();
}).catch((e) => {
ElMessage.error('获取聊天角色失败: ' + e.messages)
})
}).catch(e => {
ElMessage.error("加载模型失败: " + e.message)
})
}).catch(() => {
ElMessage.error("加载会话列表失败！")
})
}).catch(() => {
loading.value = false
// 加载模型
httpGet('/api/model/list',{id:roleId.value}).then(res => {
models.value = res.data
// 加载模型
httpGet('/api/model/list').then(res => {
models.value = res.data
if (!modelID.value) {
modelID.value = models.value[0].id
}).catch(e => {
ElMessage.error("加载模型失败: " + e.message)
})
}
// 加载角色列表
httpGet(`/api/role/list`).then((res) => {
httpGet(`/api/role/list`,{id:roleId.value}).then((res) => {
roles.value = res.data;
roleId.value = roles.value[0]['id'];
if (!roleId.value) {
roleId.value = roles.value[0]['id']
}
// 如果登录状态就创建对话连接
checkSession().then((user) => {
loginUser.value = user
isLogin.value = true
newChat();
}).catch(e => {})
}).catch((e) => {
ElMessage.error('获取聊天角色失败: ' + e.messages)
})
}).catch(e => {
ElMessage.error("加载模型失败: " + e.message)
})
// 获取会话列表
httpGet("/api/chat/list").then((res) => {
if (res.data) {
chatList.value = res.data;
allChats.value = res.data;
}
}).catch(() => {
ElMessage.error("加载会话列表失败！")
})
// 允许在输入框粘贴文件
inputRef.value.addEventListener('paste', (event) => {
const items = (event.clipboardData || window.clipboardData).items;
let fileFound = false;
@@ -417,6 +445,7 @@ const resizeElement = function () {
const _newChat = () => {
if (isLogin.value) {
chatId.value = UUID()
newChat()
}
}
@@ -427,6 +456,7 @@ const newChat = () => {
store.setShowLoginDialog(true)
return;
}
const role = getRoleById(roleId.value)
showHello.value = role.key === 'gpt';
// if the role bind a model, disable model change
@@ -456,9 +486,19 @@ const newChat = () => {
edit: false,
removing: false,
};
activeChat.value = {} //取消激活的会话高亮
showStopGenerate.value = false;
connect(null, roleId.value)
router.push(`/chat/${chatId.value}`)
loadHistory.value = true
connect()
}
// 切换工具
const changeTool = () => {
if (!isLogin.value) {
return;
}
loadHistory.value = false
socket.value.close()
}
@@ -469,16 +509,18 @@ const loadChat = function (chat) {
return;
}
if (activeChat.value['chat_id'] === chat.chat_id) {
if (chatId.value === chat.chat_id) {
return;
}
activeChat.value = chat
newChatItem.value = null;
roleId.value = chat.role_id;
modelID.value = chat.model_id;
chatId.value = chat.chat_id;
showStopGenerate.value = false;
connect(chat.chat_id, chat.role_id)
router.push(`/chat/${chatId.value}`)
loadHistory.value = true
socket.value.close()
}
// 编辑会话标题
@@ -486,7 +528,6 @@ const tmpChatTitle = ref('');
const editChatTitle = (chat) => {
chat.edit = true;
tmpChatTitle.value = chat.title;
console.log(chat.chat_id)
nextTick(() => {
document.getElementById('chat-' + chat.chat_id).focus()
})
@@ -541,7 +582,7 @@ const removeChat = function (chat) {
return e1.id === e2.id
})
// 重置会话
newChat();
_newChat();
}).catch(e => {
ElMessage.error("操作失败：" + e.message);
})
@@ -556,23 +597,10 @@ const prompt = ref('');
const showStopGenerate = ref(false); // 停止生成
const lineBuffer = ref(''); // 输出缓冲行
const socket = ref(null);
const activelyClose = ref(false); // 主动关闭
const canSend = ref(true);
const heartbeatHandle = ref(null)
const sessionId = ref("")
const connect = function (chat_id, role_id) {
let isNewChat = false;
if (!chat_id) {
isNewChat = true;
chat_id = UUID();
}
// 先关闭已有连接
if (socket.value !== null) {
activelyClose.value = true;
socket.value.close();
}
const _role = getRoleById(role_id);
const connect = function () {
const chatRole = getRoleById(roleId.value);
// 初始化 WebSocket 对象
sessionId.value = getSessionId();
let host = process.env.VUE_APP_WS_HOST
@@ -584,26 +612,15 @@ const connect = function (chat_id, role_id) {
}
}
const _socket = new WebSocket(host + `/api/chat/new?session_id=${sessionId.value}&role_id=${role_id}&chat_id=${chat_id}&model_id=${modelID.value}&token=${getUserToken()}`);
loading.value = true
const toolIds = toolSelected.value.join(',')
const _socket = new WebSocket(host + `/api/chat/new?session_id=${sessionId.value}&role_id=${roleId.value}&chat_id=${chatId.value}&model_id=${modelID.value}&token=${getUserToken()}&tools=${toolIds}`);
_socket.addEventListener('open', () => {
chatData.value = []; // 初始化聊天数据
enableInput()
activelyClose.value = false;
if (isNewChat) { // 加载打招呼信息
loading.value = false;
chatData.value.push({
chat_id: chat_id,
role_id: role_id,
type: "reply",
id: randString(32),
icon: _role['icon'],
content: _role['hello_msg'],
})
ElMessage.success({message: "对话连接成功！", duration: 1000})
} else { // 加载聊天记录
loadChatHistory(chat_id);
if (loadHistory.value) {
loadChatHistory(chatId.value)
}
loading.value = false
});
_socket.addEventListener('message', event => {
@@ -618,17 +635,16 @@ const connect = function (chat_id, role_id) {
chatData.value.push({
type: "reply",
id: randString(32),
icon: _role['icon'],
icon: chatRole['icon'],
prompt:prePrompt,
content: "",
});
} else if (data.type === 'end') { // 消息接收完毕
// 追加当前会话到会话列表
if (isNewChat && newChatItem.value !== null) {
if (newChatItem.value !== null) {
newChatItem.value['title'] = tmpChatTitle.value;
newChatItem.value['chat_id'] = chat_id;
newChatItem.value['chat_id'] = chatId.value;
chatList.value.unshift(newChatItem.value);
activeChat.value = newChatItem.value;
newChatItem.value = null; // 只追加一次
}
@@ -640,7 +656,7 @@ const connect = function (chat_id, role_id) {
httpPost("/api/chat/tokens", {
text: "",
model: getModelValue(modelID.value),
chat_id: chat_id
chat_id: chatId.value,
}).then(res => {
reply['created_at'] = new Date().getTime();
reply['tokens'] = res.data;
@@ -661,7 +677,7 @@ const connect = function (chat_id, role_id) {
// 将聊天框的滚动条滑动到最底部
nextTick(() => {
document.getElementById('chat-box').scrollTo(0, document.getElementById('chat-box').scrollHeight)
localStorage.setItem("chat_id", chat_id)
localStorage.setItem("chat_id", chatId.value)
})
};
}
@@ -672,18 +688,8 @@ const connect = function (chat_id, role_id) {
});
_socket.addEventListener('close', () => {
if (activelyClose.value || socket.value === null) { // 忽略主动关闭
return;
}
// 停止发送消息
disableInput(true)
loading.value = true;
checkSession().then(() => {
connect(chat_id, role_id)
}).catch(() => {
loading.value = true
showMessageError("会话已断开，刷新页面...")
});
connect()
});
socket.value = _socket;
@@ -743,12 +749,16 @@ const sendMessage = function () {
}
if (prompt.value.trim().length === 0 || canSend.value === false) {
showMessageError("请输入要发送的消息！")
return false;
}
// 如果携带了文件，则串上文件地址
let content = prompt.value
if (files.value.length > 0) {
if (files.value.length === 1) {
content += files.value.map(file => file.url).join(" ")
} else if (files.value.length > 1) {
showMessageError("当前只支持一个文件！")
return false
}
// 追加消息
chatData.value.push({
@@ -800,21 +810,20 @@ const clearAllChats = function () {
})
}
const logout = function () {
activelyClose.value = true;
httpGet('/api/user/logout').then(() => {
removeUserToken()
router.push("/login")
}).catch(() => {
ElMessage.error('注销失败！');
})
}
const loadChatHistory = function (chatId) {
chatData.value = []
httpGet('/api/chat/history?chat_id=' + chatId).then(res => {
const data = res.data
if (!data) {
loading.value = false
if (!data || data.length === 0) { // 加载打招呼信息
const _role = getRoleById(roleId.value)
chatData.value.push({
chat_id: chatId,
role_id: roleId.value,
type: "reply",
id: randString(32),
icon: _role['icon'],
content: _role['hello_msg'],
})
return
}
showHello.value = false
@@ -828,7 +837,6 @@ const loadChatHistory = function (chatId) {
nextTick(() => {
document.getElementById('chat-box').scrollTo(0, document.getElementById('chat-box').scrollHeight)
})
loading.value = false
}).catch(e => {
// TODO: 显示重新加载按钮
ElMessage.error('加载聊天记录失败：' + e.message);
@@ -881,7 +889,6 @@ const shareChat = (chat) => {
}
const url = location.protocol + '//' + location.host + '/chat/export?chat_id=' + chat.chat_id
// console.log(url)
window.open(url, '_blank');
}

8
web/src/views/Dalle.vue
View File

@@ -206,7 +206,7 @@
import {nextTick, onMounted, onUnmounted, ref} from "vue"
import {Delete, InfoFilled, Picture} from "@element-plus/icons-vue";
import {httpGet, httpPost} from "@/utils/http";
import {ElMessage, ElMessageBox, ElNotification} from "element-plus";
import {ElMessage, ElMessageBox} from "element-plus";
import Clipboard from "clipboard";
import {checkSession, getSystemInfo} from "@/store/cache";
import {useSharedStore} from "@/store/sharedata";
@@ -338,7 +338,7 @@ const fetchRunningJobs = () => {
}
// 获取运行中的任务
httpGet(`/api/dall/jobs?finish=false`).then(res => {
runningJobs.value = res.data
runningJobs.value = res.data.items
}).catch(e => {
ElMessage.error("获取任务失败：" + e.message)
})
@@ -356,10 +356,10 @@ const fetchFinishJobs = () => {
page.value = page.value + 1
httpGet(`/api/dall/jobs?finish=true&page=${page.value}&page_size=${pageSize.value}`).then(res => {
if (res.data.length < pageSize.value) {
if (res.data.items.length < pageSize.value) {
isOver.value = true
}
const imageList = res.data
const imageList = res.data.items
for (let i = 0; i < imageList.length; i++) {
imageList[i]["img_thumb"] = imageList[i]["img_url"] + "?imageView2/4/w/300/h/0/q/75"
}

10
web/src/views/Home.vue
View File

@@ -72,7 +72,6 @@
<div v-else>
<el-button size="small" color="#21aa93" @click="store.setShowLoginDialog(true)" round>登录</el-button>
<el-button size="small" @click="router.push('/register')" round>注册</el-button>
</div>
</div>
</div>
@@ -224,11 +223,10 @@ const init = () => {
const logout = function () {
httpGet('/api/user/logout').then(() => {
removeUserToken()
router.push("/login")
// store.setShowLoginDialog(true)
// loginUser.value = {}
// // 刷新组件
// routerViewKey.value += 1
store.setShowLoginDialog(true)
loginUser.value = {}
// 刷新组件
routerViewKey.value += 1
}).catch(() => {
ElMessage.error('注销失败！');
})

4
web/src/views/ImageMj.vue
View File

@@ -816,7 +816,7 @@ const fetchRunningJobs = () => {
}
httpGet(`/api/mj/jobs?finish=false`).then(res => {
const jobs = res.data
const jobs = res.data.items
const _jobs = []
for (let i = 0; i < jobs.length; i++) {
if (jobs[i].progress === 101) {
@@ -853,7 +853,7 @@ const fetchFinishJobs = () => {
page.value = page.value + 1
// 获取已完成的任务
httpGet(`/api/mj/jobs?finish=true&page=${page.value}&page_size=${pageSize.value}`).then(res => {
const jobs = res.data
const jobs = res.data.items
for (let i = 0; i < jobs.length; i++) {
if (jobs[i]['img_url'] !== "") {
if (jobs[i].type === 'upscale' || jobs[i].type === 'swapFace') {

7
web/src/views/ImageSd.vue
View File

@@ -549,7 +549,6 @@ const sdPower = ref(0) // 画一张 SD 图片消耗算力
const socket = ref(null)
const userId = ref(0)
const heartbeatHandle = ref(null)
const connect = () => {
let host = process.env.VUE_APP_WS_HOST
if (host === '') {
@@ -637,7 +636,7 @@ const fetchRunningJobs = () => {
// 获取运行中的任务
httpGet(`/api/sd/jobs?finish=0`).then(res => {
runningJobs.value = res.data
runningJobs.value = res.data.items
}).catch(e => {
ElMessage.error("获取任务失败：" + e.message)
})
@@ -655,10 +654,10 @@ const fetchFinishJobs = () => {
page.value = page.value + 1
httpGet(`/api/sd/jobs?finish=1&page=${page.value}&page_size=${pageSize.value}`).then(res => {
if (res.data.length < pageSize.value) {
if (res.data.items.length < pageSize.value) {
isOver.value = true
}
const imageList = res.data
const imageList = res.data.items
for (let i = 0; i < imageList.length; i++) {
imageList[i]["img_thumb"] = imageList[i]["img_url"] + "?imageView2/4/w/300/h/0/q/75"
}

4
web/src/views/ImagesWall.vue
View File

@@ -355,13 +355,13 @@ const getNext = () => {
}
httpGet(`${url}?page=${page.value}&page_size=${pageSize.value}`).then(res => {
loading.value = false
if (!res.data || res.data.length === 0) {
if (!res.data.items || res.data.items.length === 0) {
isOver.value = true
return
}
// 生成缩略图
const imageList = res.data
const imageList = res.data.items
for (let i = 0; i < imageList.length; i++) {
imageList[i]["img_thumb"] = imageList[i]["img_url"] + "?imageView2/4/w/300/h/0/q/75"
}

5
web/src/views/Index.vue
View File

@@ -7,7 +7,7 @@
:ellipsis="false"
>
<div class="menu-item">
<el-image :src="logo" alt="Geek-AI"/>
<el-image :src="logo" class="logo" alt="Geek-AI"/>
<div class="title" :style="{color:theme.textColor}">{{ title }}</div>
</div>
<div class="menu-item">
@@ -40,7 +40,7 @@
<div class="navs">
<el-space wrap>
<div v-for="item in navs" class="nav-item">
<div v-for="item in navs" :key="item.url" class="nav-item">
<el-button @click="router.push(item.url)" :color="theme.btnBgColor" :style="{color: theme.btnTextColor}" class="shadow" :dark="false">
<i :class="'iconfont '+iconMap[item.url]"></i>
<span>{{item.name}}</span>
@@ -124,6 +124,7 @@ const iconMap =ref(
"/apps": "icon-app",
"/member": "icon-vip-user",
"/invite": "icon-share",
"/luma": "icon-luma",
}
)
const bgStyle = {}

29
web/src/views/Login.vue
View File

@@ -48,13 +48,15 @@
<el-divider class="divider">其他登录方式</el-divider>
<div class="clogin">
<a class="wechat-login" :href="wechatLoginURL"><i class="iconfont icon-wechat"></i></a>
<a :href="wechatLoginURL" @click="setRoute(router.currentRoute.value.path)"><i class="iconfont icon-wechat"></i></a>
</div>
</div>
</div>
</div>
<reset-pass @hide="showResetPass = false" :show="showResetPass"/>
<captcha v-if="enableVerify" @success="doLogin" ref="captchaRef"/>
<footer-bar/>
</div>
@@ -73,6 +75,9 @@ import {checkSession, getLicenseInfo, getSystemInfo} from "@/store/cache";
import {setUserToken} from "@/store/session";
import ResetPass from "@/components/ResetPass.vue";
import {showMessageError} from "@/utils/dialog";
import Captcha from "@/components/Captcha.vue";
import QRCode from "qrcode";
import {setRoute} from "@/store/system";
const router = useRouter();
const title = ref('Geek-AI');
@@ -82,12 +87,15 @@ const showResetPass = ref(false)
const logo = ref("")
const licenseConfig = ref({})
const wechatLoginURL = ref('')
const enableVerify = ref(false)
const captchaRef = ref(null)
onMounted(() => {
// 获取系统配置
getSystemInfo().then(res => {
logo.value = res.data.logo
title.value = res.data.title
enableVerify.value = res.data['enabled_verify']
}).catch(e => {
showMessageError("获取系统配置失败：" + e.message)
})
@@ -107,7 +115,7 @@ onMounted(() => {
}).catch(() => {
})
const returnURL = `${location.protocol}//${location.host}/login/callback`
const returnURL = `${location.protocol}//${location.host}/login/callback?action=login`
httpGet("/api/user/clogin?return_url="+returnURL).then(res => {
wechatLoginURL.value = res.data.url
}).catch(e => {
@@ -129,7 +137,21 @@ const login = function () {
return showMessageError('请输入密码');
}
httpPost('/api/user/login', {username: username.value.trim(), password: password.value.trim()}).then((res) => {
if (enableVerify.value) {
captchaRef.value.loadCaptcha()
} else {
doLogin({})
}
}
const doLogin = (verifyData) => {
httpPost('/api/user/login', {
username: username.value.trim(),
password: password.value.trim(),
key: verifyData.key,
dots: verifyData.dots,
x: verifyData.x
}).then((res) => {
setUserToken(res.data.token)
if (isMobile()) {
router.push('/mobile')
@@ -141,7 +163,6 @@ const login = function () {
showMessageError('登录失败，' + e.message)
})
}
</script>
<style lang="stylus" scoped>

50
web/src/views/LoginCallback.vue
View File

@@ -24,7 +24,8 @@
</div>
</template>
<template #extra>
<el-button type="primary" @click="finishLogin">我知道了</el-button>
<el-button type="primary" class="copy-user-info" :data-clipboard-text="'用户名：'+username+' 密码：'+password">复制</el-button>
<el-button type="danger" @click="finishLogin">关闭</el-button>
</template>
</el-result>
</el-dialog>
@@ -33,12 +34,15 @@
</template>
<script setup>
import {ref} from "vue"
import {onMounted, onUnmounted, ref} from "vue"
import {useRouter} from "vue-router"
import {ElMessage, ElMessageBox} from "element-plus";
import {httpGet} from "@/utils/http";
import {setUserToken} from "@/store/session";
import {isMobile} from "@/utils/libs";
import Clipboard from "clipboard";
import {showMessageError, showMessageOK} from "@/utils/dialog";
import {getRoute} from "@/store/system";
import {checkSession} from "@/store/cache";
const winHeight = ref(window.innerHeight)
const loading = ref(true)
@@ -49,12 +53,24 @@ const password = ref('')
const code = router.currentRoute.value.query.code
const action = router.currentRoute.value.query.action
if (code === "") {
ElMessage.error({message: "登录失败：code 参数不能为空",duration: 2000, onClose: () => router.push("/")})
} else {
checkSession().then(user => {
// bind user
doLogin(user.id)
}).catch(() => {
doLogin(0)
})
}
const doLogin = (userId) => {
// 发送请求获取用户信息
httpGet("/api/user/clogin/callback",{login_type: "wx",code: code}).then(res => {
setUserToken(res.data.token)
httpGet("/api/user/clogin/callback",{login_type: "wx",code: code, action:action, user_id: userId}).then(res => {
if (res.data.token) {
setUserToken(res.data.token)
}
if (res.data.username) {
username.value = res.data.username
password.value = res.data.password
@@ -74,12 +90,26 @@ if (code === "") {
})
})
}
const clipboard = ref(null)
onMounted(() => {
clipboard.value = new Clipboard('.copy-user-info');
clipboard.value.on('success', () => {
showMessageOK('复制成功！');
})
clipboard.value.on('error', () => {
showMessageError('复制失败！');
})
})
onUnmounted(() => {
clipboard.value.destroy();
})
const finishLogin = () => {
if (isMobile()) {
router.push('/mobile')
} else {
router.push('/chat')
}
show.value = false
router.push(getRoute())
}
</script>

342
web/src/views/Luma.vue Normal file
View File

@@ -0,0 +1,342 @@
<template>
<div class="page-luma">
<div class="prompt-box">
<div class="images">
<template v-for="(img, index) in images" :key="img">
<div class="item">
<el-image :src="replaceImg(img)" fit="cover"/>
<el-icon @click="remove(img)"><CircleCloseFilled /></el-icon>
</div>
<div class="btn-swap" v-if="images.length === 2 && index === 0">
<i class="iconfont icon-exchange" @click="switchReverse"></i>
</div>
</template>
</div>
<div class="prompt-container">
<div class="input-container">
<div class="upload-icon" v-if="images.length < 2">
<el-upload
class="avatar-uploader"
:auto-upload="true"
:show-file-list="false"
:http-request="upload"
accept=".jpg,.png,.jpeg"
>
<i class="iconfont icon-image"></i>
</el-upload>
</div>
<textarea
class="prompt-input"
:rows="row"
v-model="formData.prompt"
placeholder="请输入提示词或者上传图片"
autofocus>
</textarea>
<div class="send-icon" @click="create">
<i class="iconfont icon-send"></i>
</div>
</div>
<div class="params">
<div class="item-group">
<span class="label">循环参考图</span>
<el-switch v-model="formData.loop" size="small" style="--el-switch-on-color:#BF78BF;" />
</div>
<div class="item-group">
<span class="label">提示词优化</span>
<el-switch v-model="formData.expand_prompt" size="small" style="--el-switch-on-color:#BF78BF;" />
</div>
</div>
</div>
</div>
<el-container class="video-container" v-loading="loading" element-loading-background="rgba(100,100,100,0.3)">
<h2 class="h-title">你的作品</h2>
<!-- <el-row :gutter="20" class="videos" v-if="!noData">-->
<!-- <el-col :span="8" class="item" :key="item.id" v-for="item in videos">-->
<!-- <div class="video-box" @mouseover="item.playing = true" @mouseout="item.playing = false">-->
<!-- <img :src="item.cover" :alt="item.name" v-show="!item.playing"/>-->
<!-- <video :src="item.url" preload="auto" :autoplay="true" loop="loop" muted="muted" v-show="item.playing">-->
<!-- 您的浏览器不支持视频播放-->
<!-- </video>-->
<!-- </div>-->
<!-- <div class="video-name">{{item.name}}</div>-->
<!-- <div class="opts">-->
<!-- <button class="btn" @click="download(item)" :disabled="item.downloading">-->
<!-- <i class="iconfont icon-download" v-if="!item.downloading"></i>-->
<!-- <el-image src="/images/loading.gif" fit="cover" v-else />-->
<!-- <span>下载</span>-->
<!-- </button>-->
<!-- </div>-->
<!-- </el-col>-->
<!-- </el-row>-->
<div class="list-box" v-if="!noData">
<div v-for="item in list" :key="item.id">
<div class="item">
<div class="left">
<div class="container">
<div v-if="item.progress === 100">
<video class="video" :src="replaceImg(item.video_url)" preload="auto" loop="loop" muted="muted">
您的浏览器不支持视频播放
</video>
<button class="play" @click="play(item)">
<img src="/images/play.svg" alt=""/>
</button>
</div>
<el-image :src="item.cover_url" fit="cover" v-else-if="item.progress > 100" />
<generating message="正在生成视频" v-else />
</div>
</div>
<div class="center">
<div class="failed" v-if="item.progress === 101">任务执行失败：{{item.err_msg}}，任务提示词：{{item.prompt}}</div>
<div class="prompt" v-else>{{item.prompt}}</div>
</div>
<div class="right" v-if="item.progress === 100">
<div class="tools">
<button class="btn btn-publish">
<span class="text">发布</span>
<black-switch v-model:value="item.publish" @change="publishJob(item)" size="small" />
</button>
<el-tooltip effect="light" content="下载视频" placement="top">
<button class="btn btn-icon" @click="download(item)" :disabled="item.downloading">
<i class="iconfont icon-download" v-if="!item.downloading"></i>
<el-image src="/images/loading.gif" fit="cover" v-else />
</button>
</el-tooltip>
<el-tooltip effect="light" content="删除" placement="top">
<button class="btn btn-icon" @click="removeJob(item)">
<i class="iconfont icon-remove"></i>
</button>
</el-tooltip>
</div>
</div>
<div class="right-error" v-else>
<el-button type="danger" @click="removeJob(item)" circle>
<i class="iconfont icon-remove"></i>
</el-button>
</div>
</div>
</div>
</div>
<el-empty :image-size="100" description="没有任何作品，赶紧去创作吧！" v-else />
<div class="pagination">
<el-pagination v-if="total > pageSize" background
style="--el-pagination-button-bg-color:#414141;
--el-pagination-button-color:#d1d1d1;
--el-disabled-bg-color:#414141;
--el-color-primary:#666666;
--el-pagination-hover-color:#e1e1e1"
layout="total,prev, pager, next"
:hide-on-single-page="true"
v-model:current-page="page"
v-model:page-size="pageSize"
@current-change="fetchData(page)"
:total="total"/>
</div>
</el-container>
<black-dialog v-model:show="showDialog" title="预览视频" hide-footer @cancal="showDialog = false" :width="1000">
<video style="width: 100%;" :src="currentVideoUrl" preload="auto" :autoplay="true" loop="loop" muted="muted" v-show="showDialog">
您的浏览器不支持视频播放
</video>
</black-dialog>
</div>
</template>
<script setup>
import {onMounted, reactive, ref} from "vue";
import {CircleCloseFilled} from "@element-plus/icons-vue";
import {httpDownload, httpPost, httpGet} from "@/utils/http";
import {checkSession} from "@/store/cache";
import {showMessageError, showMessageOK} from "@/utils/dialog";
import { replaceImg } from "@/utils/libs"
import {ElMessage, ElMessageBox} from "element-plus";
import BlackSwitch from "@/components/ui/BlackSwitch.vue";
import Generating from "@/components/ui/Generating.vue";
import BlackDialog from "@/components/ui/BlackDialog.vue";
const showDialog = ref(false)
const currentVideoUrl = ref('')
const row = ref(1)
const images = ref([])
const formData = reactive({
prompt: '',
expand_prompt: false,
loop: false,
first_frame_img: '',
end_frame_img: ''
})
const socket = ref(null)
const userId = ref(0)
const connect = () => {
let host = process.env.VUE_APP_WS_HOST
if (host === '') {
if (location.protocol === 'https:') {
host = 'wss://' + location.host;
} else {
host = 'ws://' + location.host;
}
}
const _socket = new WebSocket(host + `/api/video/client?user_id=${userId.value}`);
_socket.addEventListener('open', () => {
socket.value = _socket;
});
_socket.addEventListener('message', event => {
if (event.data instanceof Blob) {
const reader = new FileReader();
reader.readAsText(event.data, "UTF-8")
reader.onload = () => {
const message = String(reader.result)
if (message === "FINISH" || message === "FAIL") {
fetchData()
}
}
}
});
_socket.addEventListener('close', () => {
if (socket.value !== null) {
connect()
}
});
}
onMounted(()=>{
checkSession().then(user => {
userId.value = user.id
connect()
})
fetchData(1)
})
const download = (item) => {
const url = replaceImg(item.video_url)
const downloadURL = `${process.env.VUE_APP_API_HOST}/api/download?url=${url}`
// parse filename
const urlObj = new URL(url);
const fileName = urlObj.pathname.split('/').pop();
item.downloading = true
httpDownload(downloadURL).then(response => {
const blob = new Blob([response.data]);
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = fileName;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(link.href);
item.downloading = false
}).catch(() => {
showMessageError("下载失败")
item.downloading = false
})
}
const play = (item) => {
currentVideoUrl.value = replaceImg(item.video_url)
showDialog.value = true
}
const removeJob = (item) => {
ElMessageBox.confirm(
'此操作将会删除任务相关文件，继续操作码?',
'删除提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
httpGet("/api/video/remove", {id: item.id}).then(() => {
ElMessage.success("任务删除成功")
fetchData()
}).catch(e => {
ElMessage.error("任务删除失败：" + e.message)
})
}).catch(() => {
})
}
const publishJob = (item) => {
httpGet("/api/video/publish", {id: item.id, publish:item.publish}).then(() => {
ElMessage.success("操作成功")
}).catch(e => {
ElMessage.error("操作失败：" + e.message)
})
}
const upload = (file) => {
const formData = new FormData();
formData.append('file', file.file, file.name);
// 执行上传操作
httpPost('/api/upload', formData).then((res) => {
images.value.push(res.data.url)
ElMessage.success({message: "上传成功", duration: 500})
}).catch((e) => {
ElMessage.error('图片上传失败:' + e.message)
})
};
const remove = (img) => {
images.value = images.value.filter(item => item !== img)
}
const switchReverse = () => {
images.value = images.value.reverse()
}
const loading = ref(false)
const list = ref([])
const noData = ref(true)
const page = ref(1)
const pageSize = ref(10)
const total = ref(0)
const fetchData = (_page) => {
if (_page) {
page.value = _page
}
httpGet("/api/video/list",{page:page.value, page_size:pageSize.value, type: 'luma'}).then(res => {
total.value = res.data.total
loading.value = false
list.value = res.data.items
noData.value = list.value.length === 0
}).catch(() => {
loading.value = false
noData.value = true
})
}
// 创建视频
const create = () => {
const len = images.value.length;
if(len){
formData.first_frame_img = images.value[0]
if(len === 2){
formData.end_frame_img = images.value[1]
}
}
httpPost("/api/video/luma/create", formData).then(() => {
fetchData(1)
showMessageOK("创建任务成功")
}).catch(e => {
showMessageError("创建任务失败："+e.message)
})
}
</script>
<style lang="stylus" scoped>
@import "@/assets/css/luma.styl"
</style>

16
web/src/views/MarkMap.vue
View File

@@ -201,7 +201,6 @@ window.onresize = () => {
}
const socket = ref(null)
const heartbeatHandle = ref(0)
const connect = (userId) => {
if (socket.value !== null) {
socket.value.close()
@@ -216,24 +215,9 @@ const connect = (userId) => {
}
}
// 心跳函数
const sendHeartbeat = () => {
clearTimeout(heartbeatHandle.value)
new Promise((resolve, reject) => {
if (socket.value !== null) {
socket.value.send(JSON.stringify({type: "heartbeat", content: "ping"}))
}
resolve("success")
}).then(() => {
heartbeatHandle.value = setTimeout(() => sendHeartbeat(), 5000)
});
}
const _socket = new WebSocket(host + `/api/markMap/client?user_id=${userId}&model_id=${modelID.value}`);
_socket.addEventListener('open', () => {
socket.value = _socket;
// 发送心跳消息
sendHeartbeat()
});
_socket.addEventListener('message', event => {

30
web/src/views/Member.vue
View File

@@ -7,13 +7,19 @@
<el-row class="user-opt" :gutter="20">
<el-col :span="12">
<el-button type="primary" @click="showPasswordDialog = true">修改密码</el-button>
<el-button type="primary" @click="showBindEmailDialog = true">绑定邮箱</el-button>
</el-col>
<el-col :span="12">
<el-button type="primary" @click="showBindMobileDialog = true">更改账号</el-button>
<el-button type="primary" @click="showBindMobileDialog = true">绑定手机</el-button>
</el-col>
<el-col :span="12">
<el-button type="primary" @click="showThirdLoginDialog = true">第三方登录</el-button>
</el-col>
<el-col :span="12">
<el-button type="primary" @click="showPasswordDialog = true">修改密码</el-button>
</el-col>
<el-col :span="24">
<el-button type="success" @click="showRedeemVerifyDialog = true">兑换码核销
<el-button type="primary" @click="showRedeemVerifyDialog = true">卡密兑换
</el-button>
</el-col>
@@ -93,8 +99,10 @@
<password-dialog v-if="isLogin" :show="showPasswordDialog" @hide="showPasswordDialog = false"
@logout="logout"/>
<bind-mobile v-if="isLogin" :show="showBindMobileDialog" :username="user.username"
@hide="showBindMobileDialog = false"/>
<bind-mobile v-if="isLogin" :show="showBindMobileDialog" @hide="showBindMobileDialog = false"/>
<bind-email v-if="isLogin" :show="showBindEmailDialog" @hide="showBindEmailDialog = false"/>
<third-login v-if="isLogin" :show="showThirdLoginDialog" @hide="showThirdLoginDialog = false"/>
<redeem-verify v-if="isLogin" :show="showRedeemVerifyDialog" @hide="redeemCallback"/>
@@ -143,13 +151,15 @@ import {InfoFilled, SuccessFilled} from "@element-plus/icons-vue";
import {checkSession, getSystemInfo} from "@/store/cache";
import UserProfile from "@/components/UserProfile.vue";
import PasswordDialog from "@/components/PasswordDialog.vue";
import BindMobile from "@/components/ResetAccount.vue";
import BindMobile from "@/components/BindMobile.vue";
import RedeemVerify from "@/components/RedeemVerify.vue";
import {useRouter} from "vue-router";
import {removeUserToken} from "@/store/session";
import UserOrder from "@/components/UserOrder.vue";
import CountDown from "@/components/CountDown.vue";
import {useSharedStore} from "@/store/sharedata";
import BindEmail from "@/components/BindEmail.vue";
import ThirdLogin from "@/components/ThirdLogin.vue";
const list = ref([])
const showPayDialog = ref(false)
@@ -157,9 +167,11 @@ const vipImg = ref("/images/vip.png")
const enableReward = ref(false) // 是否启用众筹功能
const rewardImg = ref('/images/reward.png')
const qrcode = ref("")
const showPasswordDialog = ref(false);
const showBindMobileDialog = ref(false);
const showRedeemVerifyDialog = ref(false);
const showPasswordDialog = ref(false)
const showBindMobileDialog = ref(false)
const showBindEmailDialog = ref(false)
const showRedeemVerifyDialog = ref(false)
const showThirdLoginDialog = ref(false)
const text = ref("")
const user = ref(null)
const isLogin = ref(false)

6
web/src/views/PowerLog.vue
View File

@@ -23,8 +23,8 @@
--el-table-row-hover-bg-color:#373C47;
--el-table-header-bg-color:#474E5C;
--el-table-text-color:#d1d1d1">
<el-table-column prop="username" label="用户"/>
<el-table-column prop="model" label="模型"/>
<el-table-column prop="username" label="用户" width="130px"/>
<el-table-column prop="model" label="模型" width="130px"/>
<el-table-column prop="type" label="类型">
<template #default="scope">
<el-tag size="small" :type="tagColors[scope.row.type]">{{ scope.row.type_str }}</el-tag>
@@ -39,7 +39,7 @@
</template>
</el-table-column>
<el-table-column prop="balance" label="余额"/>
<el-table-column label="发生时间">
<el-table-column label="发生时间" width="160px">
<template #default="scope">
<span>{{ dateFormat(scope.row['created_at']) }}</span>
</template>

48
web/src/views/Register.vue
View File

@@ -41,7 +41,7 @@
</el-input>
</el-col>
<el-col :span="12">
<send-msg size="large" :receiver="data.username"/>
<send-msg size="large" :receiver="data.username" type="mobile"/>
</el-col>
</el-row>
</div>
@@ -50,7 +50,7 @@
<div class="block">
<el-input placeholder="邮箱地址"
size="large"
v-model="data.username"
v-model="data.email"
autocomplete="off">
<template #prefix>
<el-icon>
@@ -74,7 +74,7 @@
</el-input>
</el-col>
<el-col :span="12">
<send-msg size="large" :receiver="data.username"/>
<send-msg size="large" :receiver="data.email" type="email"/>
</el-col>
</el-row>
</div>
@@ -135,13 +135,17 @@
<el-row class="btn-row" :gutter="20">
<el-col :span="24">
<el-button class="login-btn" type="primary" size="large" @click="submitRegister">注册</el-button>
<el-button class="login-btn" type="primary" size="large" @click="submitRegister" >注册</el-button>
</el-col>
</el-row>
<el-row class="text-line">
已经有账号？
<el-link type="primary" @click="router.push('/login')">登录</el-link>
<el-row class="text-line" :gutter="24">
<el-col :span="12">
<el-link type="primary" @click="router.push('/login')">登录</el-link>
</el-col>
<el-col :span="12">
<el-link type="primary" @click="router.push('/')">首页</el-link>
</el-col>
</el-row>
</el-form>
@@ -160,6 +164,8 @@
</el-result>
</div>
<captcha v-if="enableVerify" @success="doSubmitRegister" ref="captchaRef"/>
<footer class="footer" v-if="!licenseConfig.de_copy">
<footer-bar/>
</footer>
@@ -182,6 +188,7 @@ import {setUserToken} from "@/store/session";
import {validateEmail, validateMobile} from "@/utils/validate";
import {showMessageError, showMessageOK} from "@/utils/dialog";
import {getLicenseInfo, getSystemInfo} from "@/store/cache";
import Captcha from "@/components/Captcha.vue";
const router = useRouter();
const title = ref('');
@@ -201,6 +208,13 @@ const enableRegister = ref(true)
const activeName = ref("mobile")
const wxImg = ref("/images/wx.png")
const licenseConfig = ref({})
const enableVerify = ref(false)
const captchaRef = ref(null)
// 记录邀请码点击次数
if (data.value.invite_code) {
httpGet("/api/invite/hits",{code: data.value.invite_code})
}
getSystemInfo().then(res => {
if (res.data) {
@@ -222,6 +236,7 @@ getSystemInfo().then(res => {
if (res.data['wechat_card_url'] !== '') {
wxImg.value = res.data['wechat_card_url']
}
enableVerify.value = res.data['enabled_verify']
}
}).catch(e => {
ElMessage.error("获取系统配置失败：" + e.message)
@@ -257,9 +272,21 @@ const submitRegister = () => {
if ((activeName.value === 'mobile' || activeName.value === 'email') && data.value.code === '') {
return showMessageError('请输入验证码');
}
if (enableVerify.value) {
captchaRef.value.loadCaptcha()
} else {
doSubmitRegister({})
}
}
const doSubmitRegister = (verifyData) => {
data.value.key = verifyData.key
data.value.dots = verifyData.dots
data.value.x = verifyData.x
data.value.reg_way = activeName.value
httpPost('/api/user/register', data.value).then((res) => {
setUserToken(res.data)
setUserToken(res.data.token)
showMessageOK({
"message": "注册成功，即将跳转到对话主界面...",
onClose: () => router.push("/chat"),
@@ -313,6 +340,7 @@ const submitRegister = () => {
.el-image {
width 120px;
cursor pointer
border-radius 50%
}
}
@@ -357,6 +385,10 @@ const submitRegister = () => {
justify-content center
padding-top 10px;
font-size 14px;
.el-col {
text-align center
}
}
}
}

88
web/src/views/Suno.vue
View File

@@ -5,6 +5,20 @@
<el-tooltip effect="light" content="定义模式" placement="top">
<black-switch v-model:value="custom" size="large" />
</el-tooltip>
<el-tooltip effect="light" content="请上传6-60秒的原始音频，检测到人声的音频将仅设为私人音频。" placement="bottom-end">
<el-upload
class="avatar-uploader"
:auto-upload="true"
:show-file-list="false"
:http-request="uploadAudio"
accept=".wav,.mp3"
>
<el-button class="upload-music" color="#363030" round>
<i class="iconfont icon-upload"></i>
<span>上传音乐</span>
</el-button>
</el-upload>
</el-tooltip>
<black-select v-model:value="data.model" :options="models" placeholder="请选择模型" style="width: 100px" />
</div>
@@ -28,10 +42,10 @@
</el-popover>
</div>
<div class="item"
v-loading="generating"
v-loading="isGenerating"
element-loading-text="正在生成歌词..."
element-loading-background="rgba(122, 122, 122, 0.8)">
<black-input v-model:value="data.lyrics" type="textarea" :rows="10" placeholder="请在这里输入你自己写的歌词..."/>
<black-input v-model:value="data.lyrics" type="textarea" :rows="10" :placeholder="promptPlaceholder"/>
<button class="btn btn-lyric" @click="createLyric">生成歌词</button>
</div>
</div>
@@ -137,7 +151,7 @@
</div>
<div class="right-box" v-loading="loading" element-loading-background="rgba(100,100,100,0.3)">
<div class="list-box" v-if="!noData">
<div v-for="item in list">
<div v-for="item in list" :key="item.id">
<div class="item" v-if="item.progress === 100">
<div class="left">
<div class="container">
@@ -151,13 +165,18 @@
<div class="center">
<div class="title">
<a :href="'/song/'+item.song_id" target="_blank">{{item.title}}</a>
<span class="model">{{item.major_model_version}}</span>
<span class="model" v-if="item.major_model_version">{{item.major_model_version}}</span>
<span class="model" v-if="item.type === 4">用户上传</span>
<span class="model" v-if="item.type === 3">
<i class="iconfont icon-mp3"></i>
完整歌曲
</span>
<span class="model" v-if="item.ref_song">
<i class="iconfont icon-link"></i>
{{item.ref_song.title}}
</span>
</div>
<div class="tags">{{item.tags}}</div>
<div class="tags" v-if="item.tags">{{item.tags}}</div>
</div>
<div class="right">
<div class="tools">
@@ -178,6 +197,12 @@
</a>
</el-tooltip>
<el-tooltip effect="light" content="获取完整歌曲" placement="top" v-if="item.ref_song">
<button class="btn btn-icon" @click="merge(item)">
<i class="iconfont icon-concat"></i>
</button>
</el-tooltip>
<el-tooltip effect="light" content="复制歌曲链接" placement="top">
<button class="btn btn-icon copy-link" :data-clipboard-text="getShareURL(item)" >
<i class="iconfont icon-share1"></i>
@@ -209,7 +234,7 @@
<div class="failed" v-if="item.progress === 101">
{{item.err_msg}}
</div>
<generating v-else />
<generating v-else message="正在生成歌曲" />
</div>
<div class="right">
<el-button type="info" @click="removeJob(item)" circle>
@@ -276,13 +301,13 @@ import MusicPlayer from "@/components/MusicPlayer.vue";
import {compact} from "lodash";
import {httpGet, httpPost} from "@/utils/http";
import {showMessageError, showMessageOK} from "@/utils/dialog";
import Generating from "@/components/ui/Generating.vue";
import {checkSession} from "@/store/cache";
import {ElMessage, ElMessageBox} from "element-plus";
import {formatTime} from "@/utils/libs";
import Clipboard from "clipboard";
import BlackDialog from "@/components/ui/BlackDialog.vue";
import Compressor from "compressorjs";
import Generating from "@/components/ui/Generating.vue";
const winHeight = ref(window.innerHeight - 50)
const custom = ref(false)
@@ -329,6 +354,7 @@ const btnText = ref("开始创作")
const refSong = ref(null)
const showDialog = ref(false)
const editData = ref({title:"",cover:"",id:0})
const promptPlaceholder = ref('请在这里输入你自己写的歌词...')
const socket = ref(null)
const userId = ref(0)
@@ -422,7 +448,11 @@ const create = () => {
data.value.ref_task_id = refSong.value ? refSong.value.task_id : ""
data.value.ref_song_id = refSong.value ? refSong.value.song_id : ""
data.value.extend_secs = refSong.value ? refSong.value.extend_secs : 0
if (custom.value) {
if (refSong.value) {
if (data.value.extend_secs > refSong.value.duration) {
return showMessageError("续写开始时间不能超过原歌曲长度")
}
} else if (custom.value) {
if (data.value.lyrics === "") {
return showMessageError("请输入歌词")
}
@@ -434,9 +464,6 @@ const create = () => {
return showMessageError("请输入歌曲描述")
}
}
if (refSong.value && data.value.extend_secs > refSong.value.duration) {
return showMessageError("续写开始时间不能超过原歌曲长度")
}
httpPost("/api/suno/create", data.value).then(() => {
fetchData(1)
@@ -446,6 +473,35 @@ const create = () => {
})
}
// 拼接歌曲
const merge = (item) => {
httpPost("/api/suno/create", {song_id: item.song_id, type:3}).then(() => {
fetchData(1)
showMessageOK("创建任务成功")
}).catch(e => {
showMessageError("合并歌曲失败："+e.message)
})
}
const uploadAudio = (file) => {
const formData = new FormData();
formData.append('file', file.file, file.name);
// 执行上传操作
httpPost('/api/upload', formData).then((res) => {
httpPost("/api/suno/create", {audio_url: res.data.url, title:res.data.name, type:4}).then(() => {
fetchData(1)
showMessageOK("歌曲上传成功")
}).catch(e => {
showMessageError("歌曲上传失败："+e.message)
})
removeRefSong()
ElMessage.success({message: "上传成功", duration: 500})
}).catch((e) => {
ElMessage.error('文件传失败:' + e.message)
})
};
// 续写歌曲
const extend = (item) => {
refSong.value = item
@@ -453,6 +509,7 @@ const extend = (item) => {
data.value.title = item.title
custom.value = true
btnText.value = "续写歌曲"
promptPlaceholder.value = "输入额外的歌词，根据您之前的歌词来扩展歌曲..."
}
// 更细歌曲
@@ -485,6 +542,7 @@ watch(() => custom.value, (newValue) => {
const removeRefSong = () => {
refSong.value = null
btnText.value = "开始创作"
promptPlaceholder.value = "请在这里输入你自己写的歌词..."
}
const play = (item) => {
@@ -553,21 +611,21 @@ const uploadCover = (file) => {
});
}
const generating = ref(false)
const isGenerating = ref(false)
const createLyric = () => {
if (data.value.lyrics === "") {
return showMessageError("请输入歌词描述")
}
generating.value = true
isGenerating.value = true
httpPost("/api/suno/lyric", {prompt: data.value.lyrics}).then(res => {
const lines = res.data.split('\n');
data.value.title = lines.shift().replace(/\*/g,"")
lines.shift()
data.value.lyrics = lines.join('\n');
generating.value = false
isGenerating.value = false
}).catch(e => {
showMessageError("歌词生成失败："+e.message)
generating.value = false
isGenerating.value = false
})
}

13
web/src/views/admin/Apps.vue
View File

@@ -17,7 +17,10 @@
</el-table-column>
<el-table-column label="应用名称" prop="name">
<template #default="scope">
<span class="sort" :data-id="scope.row.id">{{ scope.row.name }}</span>
<span class="sort" :data-id="scope.row.id">
<i class="iconfont icon-drag"></i>
{{ scope.row.name }}
</span>
</template>
</el-table-column>
<el-table-column label="应用标识" prop="key"/>
@@ -373,6 +376,14 @@ const uploadImg = (file) => {
}
}
.sort {
cursor move
.iconfont {
position relative
top 1px
}
}
.pagination {
padding 20px 0
display flex

13
web/src/views/admin/ChatModel.vue
View File

@@ -13,7 +13,10 @@
<el-table-column type="selection" width="38"></el-table-column>
<el-table-column prop="name" label="模型名称">
<template #default="scope">
<span class="sort" :data-id="scope.row.id">{{ scope.row.name }}</span>
<span class="sort" :data-id="scope.row.id">
<i class="iconfont icon-drag"></i>
{{ scope.row.name }}
</span>
</template>
</el-table-column>
<el-table-column prop="value" label="模型值">
@@ -346,6 +349,14 @@ const remove = function (row) {
width: 100%
}
.sort {
cursor move
.iconfont {
position relative
top 1px
}
}
.pagination {
padding 20px 0
display flex

22
web/src/views/admin/Login.vue
View File

@@ -37,6 +37,8 @@
</div>
</div>
<captcha v-if="enableVerify" @success="doLogin" ref="captchaRef"/>
<footer class="footer">
<footer-bar/>
</footer>
@@ -54,12 +56,15 @@ import {useRouter} from "vue-router";
import FooterBar from "@/components/FooterBar.vue";
import {setAdminToken} from "@/store/session";
import {checkAdminSession, getSystemInfo} from "@/store/cache";
import Captcha from "@/components/Captcha.vue";
const router = useRouter();
const title = ref('Geek-AI Console');
const username = ref(process.env.VUE_APP_ADMIN_USER);
const password = ref(process.env.VUE_APP_ADMIN_PASS);
const logo = ref("")
const enableVerify = ref(false)
const captchaRef = ref(null)
checkAdminSession().then(() => {
router.push("/admin")
@@ -70,6 +75,7 @@ checkAdminSession().then(() => {
getSystemInfo().then(res => {
title.value = res.data.admin_title
logo.value = res.data.logo
enableVerify.value = res.data['enabled_verify']
}).catch(e => {
ElMessage.error("加载系统配置失败: " + e.message)
})
@@ -87,8 +93,21 @@ const login = function () {
if (password.value === '') {
return ElMessage.error('请输入密码');
}
if (enableVerify.value) {
captchaRef.value.loadCaptcha()
} else {
doLogin({})
}
}
httpPost('/api/admin/login', {username: username.value.trim(), password: password.value.trim()}).then(res => {
const doLogin = function (verifyData) {
httpPost('/api/admin/login', {
username: username.value.trim(),
password: password.value.trim(),
key: verifyData.key,
dots: verifyData.dots,
x: verifyData.x
}).then(res => {
setAdminToken(res.data.token)
router.push("/admin")
}).catch((e) => {
@@ -126,6 +145,7 @@ const login = function () {
.el-image {
width 120px;
cursor pointer
border-radius 50%
}
}

13
web/src/views/admin/Menu.vue
View File

@@ -9,7 +9,10 @@
<el-table :data="items" :row-key="row => row.id" table-layout="auto">
<el-table-column prop="name" label="菜单名称">
<template #default="scope">
<span class="sort" :data-id="scope.row.id">{{ scope.row.name }}</span>
<span class="sort" :data-id="scope.row.id">
<i class="iconfont icon-drag"></i>
{{ scope.row.name }}
</span>
</template>
</el-table-column>
<el-table-column prop="icon" label="菜单图标">
@@ -240,6 +243,14 @@ const uploadImg = (file) => {
height 36px
}
.sort {
cursor move
.iconfont {
position relative
top 1px
}
}
.el-select {
width: 100%
}

13
web/src/views/admin/Product.vue
View File

@@ -9,7 +9,10 @@
<el-table :data="items" :row-key="row => row.id" table-layout="auto">
<el-table-column prop="name" label="产品名称">
<template #default="scope">
<span class="sort" :data-id="scope.row.id">{{ scope.row.name }}</span>
<span class="sort" :data-id="scope.row.id">
<i class="iconfont icon-drag"></i>
{{ scope.row.name }}
</span>
</template>
</el-table-column>
<el-table-column prop="price" label="产品价格"/>
@@ -227,6 +230,14 @@ const remove = function (row) {
}
}
.sort {
cursor move
.iconfont {
position relative
top 1px
}
}
.el-select {
width: 100%
}

32
web/src/views/admin/SysConfig.vue
View File

@@ -107,6 +107,24 @@
</div>
</el-form-item>
<el-form-item label="启用验证码" prop="enabled_verify">
<div class="tip-input">
<el-switch v-model="system['enabled_verify']"/>
<div class="info">
<el-tooltip
effect="dark"
content="启用验证码之后，注册登录都会加载行为验证码，增加安全性。此功能需要购买验证码服务才会生效。"
raw-content
placement="right"
>
<el-icon>
<InfoFilled/>
</el-icon>
</el-tooltip>
</div>
</div>
</el-form-item>
<el-form-item label="注册方式" prop="register_ways">
<el-checkbox-group v-model="system['register_ways']">
<el-checkbox value="mobile">手机注册</el-checkbox>
@@ -284,6 +302,9 @@
<el-form-item label="Suno 算力" prop="suno_power">
<el-input v-model.number="system['suno_power']" placeholder="使用 Suno 生成一首音乐消耗算力"/>
</el-form-item>
<el-form-item label="Luma 算力" prop="luma_power">
<el-input v-model.number="system['luma_power']" placeholder="使用 Luma 生成一段视频消耗算力"/>
</el-form-item>
</el-tab-pane>
</el-tabs>
@@ -358,6 +379,12 @@
</el-descriptions-item>
</el-descriptions>
<h3>激活后可获得以下权限：</h3>
<ol class="active-info">
<li>1、使用任意第三方中转 API KEY，而不用局限于 GeekAI 推荐的白名单列表</li>
<li>2、可以在相关页面去除 GeekAI 的版权信息，或者修改为自己的版权信息</li>
</ol>
<el-form :model="system" label-width="150px" label-position="right">
<el-form-item label="许可授权码" prop="license">
<el-input v-model="licenseKey"/>
@@ -574,6 +601,11 @@ const onUploadImg = (files, callback) => {
}
}
.active-info {
line-height 1.5
padding 10px 0 30px 0
}
.el-descriptions {
margin-bottom 20px
.el-icon {

45
web/src/views/admin/Users.vue
View File

@@ -3,15 +3,16 @@
<div class="handle-box">
<el-input v-model="query.username" placeholder="账号" class="handle-input mr10"></el-input>
<el-button type="primary" :icon="Search" @click="handleSearch">搜索</el-button>
<el-button type="success" :icon="Plus" @click="addUser">新增用户</el-button>
<el-button type="danger" :icon="Delete" @click="multipleDelete">删除</el-button>
</div>
<el-row>
<el-table :data="users.items" border class="table" :row-key="row => row.id"
@selection-change="handleSelectionChange" table-layout="auto">
<el-table-column type="selection" width="38"></el-table-column>
<el-table-column prop="mobile" label="账号">
<el-table-column prop="id" label="ID"/>
<el-table-column label="账号">
<template #default="scope">
<span>{{ scope.row.username }}</span>
<el-image v-if="scope.row.vip" :src="vipImg" style="height: 20px;position: relative; top:5px; left: 5px"/>
@@ -169,8 +170,8 @@
import {onMounted, reactive, ref} from "vue";
import {httpGet, httpPost} from "@/utils/http";
import {ElMessage, ElMessageBox} from "element-plus";
import {dateFormat, disabledDate, removeArrayItem} from "@/utils/libs";
import {Plus, Search} from "@element-plus/icons-vue";
import {dateFormat, disabledDate} from "@/utils/libs";
import {Delete, Plus, Search} from "@element-plus/icons-vue";
// 变量定义
const users = ref({page: 1, page_size: 15, items: []})
@@ -262,9 +263,7 @@ const removeUser = function (user) {
).then(() => {
httpGet('/api/admin/user/remove', {id: user.id}).then(() => {
ElMessage.success('操作成功！')
users.value.items = removeArrayItem(users.value.items, user, function (v1, v2) {
return v1.id === v2.id
})
fetchUserList(users.value.page, users.value.page_size)
}).catch((e) => {
ElMessage.error('操作失败，' + e.message)
})
@@ -282,7 +281,7 @@ const userEdit = function (row) {
}
const addUser = () => {
user.value = {}
user.value = {chat_id: 0, chat_roles: [], chat_models: []}
title.value = '添加用户'
showUserEditDialog.value = true
add.value = true
@@ -307,8 +306,36 @@ const saveUser = function () {
})
}
const userIds = ref([])
const handleSelectionChange = function (rows) {
// console.log(rows)
userIds.value = []
rows.forEach((row) => {
userIds.value.push(row.id)
})
}
const multipleDelete = function () {
ElMessageBox.confirm(
'此操作将会永久删除用户信息和聊天记录，确认操作吗?',
'警告',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
loading.value = true
httpGet('/api/admin/user/remove', {ids: userIds.value}).then(() => {
ElMessage.success('操作成功！')
fetchUserList(users.value.page, users.value.page_size)
loading.value = false
}).catch((e) => {
ElMessage.error('操作失败，' + e.message)
loading.value = false
})
}).catch(() => {
ElMessage.info('操作被取消')
})
}
const resetPass = (row) => {

5
web/src/views/mobile/ChatList.vue
View File

@@ -225,10 +225,7 @@ const newChat = (item) => {
}
showPicker.value = false
const options = item.selectedOptions
router.push({
name: "mobile-chat-session",
params: {role_id: options[0].value, model_id: options[1].value, title: '新建会话', chat_id: 0}
})
router.push(`/mobile/chat/session?title=新对话&role_id=${options[0].value}&model_id=${options[1].value}&chat_id=0}`)
}
const changeChat = (chat) => {

2
web/src/views/mobile/ChatSession.vue
View File

@@ -102,6 +102,7 @@
<van-popup v-model:show="showPicker" position="bottom" class="popup">
<van-picker
:columns="columns"
v-model="selectedValues"
title="选择模型和角色"
@cancel="showPicker = false"
@confirm="newChat"
@@ -153,6 +154,7 @@ const loginUser = ref(null)
// const showMic = ref(false)
const showPicker = ref(false)
const columns = ref([roles.value, models.value])
const selectedValues = ref([roleId.value, modelId.value])
checkSession().then(user => {
loginUser.value = user

4
web/src/views/mobile/Profile.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="mobile-user-profile container">
<div class="content">
<van-form>
<van-form v-if="isLogin">
<div class="avatar">
<van-image :src="fileList[0].url" size="80" width="80" fit="cover" round />
<!-- <van-uploader v-model="fileList"-->
@@ -160,7 +160,7 @@ import {httpGet, httpPost} from "@/utils/http";
import Compressor from 'compressorjs';
import {dateFormat, isWeChatBrowser, showLoginDialog} from "@/utils/libs";
import {ElMessage} from "element-plus";
import {checkSession} from "@/store/cache";
import {checkSession, getSystemInfo} from "@/store/cache";
import {useRouter} from "vue-router";
import {removeUserToken} from "@/store/session";
import bus from '@/store/eventbus'

12
web/src/views/mobile/pages/ImageDall.vue
View File

@@ -165,7 +165,7 @@ import {onMounted, onUnmounted, ref} from "vue"
import {Delete} from "@element-plus/icons-vue";
import {httpGet, httpPost} from "@/utils/http";
import Clipboard from "clipboard";
import {checkSession} from "@/store/cache";
import {checkSession, getSystemInfo} from "@/store/cache";
import {useRouter} from "vue-router";
import {getSessionId} from "@/store/session";
import {
@@ -183,7 +183,6 @@ const listBoxHeight = ref(window.innerHeight - 40)
const mjBoxHeight = ref(window.innerHeight - 150)
const item = ref({})
const isLogin = ref(false)
const activeColspan = ref([""])
window.onresize = () => {
listBoxHeight.value = window.innerHeight - 40
@@ -318,7 +317,7 @@ const initData = () => {
const fetchRunningJobs = () => {
// 获取运行中的任务
httpGet(`/api/dall/jobs?finish=0`).then(res => {
const jobs = res.data
const jobs = res.data.items
const _jobs = []
for (let i = 0; i < jobs.length; i++) {
if (jobs[i].progress === -1) {
@@ -346,13 +345,14 @@ const pageSize = ref(10)
const fetchFinishJobs = (page) => {
loading.value = true
httpGet(`/api/dall/jobs?finish=1&page=${page}&page_size=${pageSize.value}`).then(res => {
if (res.data.length < pageSize.value) {
const jobs = res.data.items
if (jobs.length < pageSize.value) {
finished.value = true
}
if (page === 1) {
finishedJobs.value = res.data
finishedJobs.value = jobs
} else {
finishedJobs.value = finishedJobs.value.concat(res.data)
finishedJobs.value = finishedJobs.value.concat(jobs)
}
loading.value = false
}).catch(e => {

4
web/src/views/mobile/pages/ImageMj.vue
View File

@@ -430,7 +430,7 @@ const connect = () => {
// 获取运行中的任务
const fetchRunningJobs = (userId) => {
httpGet(`/api/mj/jobs?finish=0&user_id=${userId}`).then(res => {
const jobs = res.data
const jobs = res.data.items
const _jobs = []
for (let i = 0; i < jobs.length; i++) {
if (jobs[i].progress === -1) {
@@ -462,7 +462,7 @@ const fetchFinishJobs = (page) => {
loading.value = true
// 获取已完成的任务
httpGet(`/api/mj/jobs?finish=1&page=${page}&page_size=${pageSize.value}`).then(res => {
const jobs = res.data
const jobs = res.data.items
for (let i = 0; i < jobs.length; i++) {
if (jobs[i].progress === 101) {
showNotify({

9
web/src/views/mobile/pages/ImageSd.vue
View File

@@ -382,7 +382,7 @@ const initData = () => {
const fetchRunningJobs = () => {
// 获取运行中的任务
httpGet(`/api/sd/jobs?finish=0`).then(res => {
const jobs = res.data
const jobs = res.data.items
const _jobs = []
for (let i = 0; i < jobs.length; i++) {
if (jobs[i].progress === -1) {
@@ -410,13 +410,14 @@ const pageSize = ref(10)
const fetchFinishJobs = (page) => {
loading.value = true
httpGet(`/api/sd/jobs?finish=1&page=${page}&page_size=${pageSize.value}`).then(res => {
if (res.data.length < pageSize.value) {
const jobs = res.data.items
if (jobs.length < pageSize.value) {
finished.value = true
}
if (page === 1) {
finishedJobs.value = res.data
finishedJobs.value = jobs
} else {
finishedJobs.value = finishedJobs.value.concat(res.data)
finishedJobs.value = finishedJobs.value.concat(jobs)
}
loading.value = false
}).catch(e => {

4
web/src/views/mobile/pages/ImgWall.vue
View File

@@ -134,13 +134,13 @@ const onLoad = () => {
const d = data.value[activeName.value]
httpGet(`${d.url}?status=1&page=${d.page}&page_size=${d.pageSize}&publish=true`).then(res => {
d.loading = false
if (res.data.length === 0) {
if (res.data.items.length === 0) {
d.finished = true
return
}
// 生成缩略图
const imageList = res.data
const imageList = res.data.items
for (let i = 0; i < imageList.length; i++) {
imageList[i]["img_thumb"] = imageList[i]["img_url"] + "?imageView2/4/w/300/h/0/q/75"
}