mirror of
https://github.com/yangjian102621/geekai.git
synced 2025-09-17 08:46:38 +08:00
opt: adjust styles for ItemList component, cut string for chat role's hello message
This commit is contained in:
RockYang
parent
d2a8d655c8
commit
a80d01209c
@ -51,7 +51,7 @@ ChatGLM,讯飞星火，文心一言等多个平台的大语言模型。集成了
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
### 7. 体验地址
|
||||
|
||||
|
||||
@ -78,8 +78,8 @@ func (h *ChatRoleHandler) List(c *gin.Context) {
|
||||
resp.SUCCESS(c, roleVos)
|
||||
}
|
||||
|
||||
// AddRole 为用户添加角色
|
||||
func (h *ChatRoleHandler) AddRole(c *gin.Context) {
|
||||
// UpdateRole 更新用户聊天角色
|
||||
func (h *ChatRoleHandler) UpdateRole(c *gin.Context) {
|
||||
user, err := utils.GetLoginUser(c, h.db)
|
||||
if err != nil {
|
||||
resp.NotAuth(c)
|
||||
|
||||
@ -8,7 +8,6 @@ import (
|
||||
"chatplus/store/vo"
|
||||
"chatplus/utils"
|
||||
"chatplus/utils/resp"
|
||||
"encoding/base64"
|
||||
"fmt"
|
||||
"github.com/gin-gonic/gin"
|
||||
"github.com/go-redis/redis/v8"
|
||||
@ -160,7 +159,7 @@ func (h *SdJobHandler) Image(c *gin.Context) {
|
||||
resp.SUCCESS(c)
|
||||
}
|
||||
|
||||
// JobList 获取 MJ 任务列表
|
||||
// JobList 获取 stable diffusion 任务列表
|
||||
func (h *SdJobHandler) JobList(c *gin.Context) {
|
||||
status := h.GetInt(c, "status", 0)
|
||||
userId := h.GetInt(c, "user_id", 0)
|
||||
@ -201,12 +200,6 @@ func (h *SdJobHandler) JobList(c *gin.Context) {
|
||||
h.db.Delete(&item)
|
||||
continue
|
||||
}
|
||||
if item.ImgURL != "" { // 正在运行中任务使用代理访问图片
|
||||
image, err := utils.DownloadImage(item.ImgURL, h.App.Config.ProxyURL)
|
||||
if err == nil {
|
||||
job.ImgURL = "data:image/png;base64," + base64.StdEncoding.EncodeToString(image)
|
||||
}
|
||||
}
|
||||
}
|
||||
jobs = append(jobs, job)
|
||||
}
|
||||
|
||||
@ -185,7 +185,7 @@ func main() {
|
||||
fx.Invoke(func(s *core.AppServer, h *handler.ChatRoleHandler) {
|
||||
group := s.Engine.Group("/api/role/")
|
||||
group.GET("list", h.List)
|
||||
group.POST("add", h.AddRole)
|
||||
group.POST("update", h.UpdateRole)
|
||||
}),
|
||||
fx.Invoke(func(s *core.AppServer, h *handler.UserHandler) {
|
||||
group := s.Engine.Group("/api/user/")
|
||||
|
||||
@ -13,8 +13,44 @@
|
||||
.page-apps .inner {
|
||||
display: flex;
|
||||
color: #fff;
|
||||
padding: 20px;
|
||||
padding: 15px;
|
||||
overflow-y: visible;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.page-apps .inner .left-menu {
|
||||
width: 160px;
|
||||
.page-apps .inner .list-box .app-item {
|
||||
border: 1px solid #666;
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
transition: all 0.3s ease; /* 添加过渡效果 */
|
||||
}
|
||||
.page-apps .inner .list-box .app-item .el-image {
|
||||
padding: 6px;
|
||||
}
|
||||
.page-apps .inner .list-box .app-item .el-image .el-image__inner {
|
||||
border-radius: 10px;
|
||||
}
|
||||
.page-apps .inner .list-box .app-item .title {
|
||||
display: flex;
|
||||
padding: 10px;
|
||||
}
|
||||
.page-apps .inner .list-box .app-item .title .name {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #47fff1;
|
||||
}
|
||||
.page-apps .inner .list-box .app-item .title .opt {
|
||||
position: relative;
|
||||
top: -5px;
|
||||
}
|
||||
.page-apps .inner .list-box .app-item .hello-msg {
|
||||
height: 60px;
|
||||
padding: 10px;
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
}
|
||||
.page-apps .inner .list-box .app-item:hover {
|
||||
box-shadow: 0 0 10px rgba(71,255,241,0.6); /* 添加阴影效果 */
|
||||
transform: translateY(-10px); /* 向上移动10像素 */
|
||||
}
|
||||
|
||||
@ -52,9 +52,6 @@
|
||||
}
|
||||
|
||||
.hello-msg {
|
||||
overflow: hidden;
|
||||
white-space normal
|
||||
text-overflow: ellipsis;
|
||||
height 60px
|
||||
padding 10px
|
||||
font-size 14px
|
||||
|
||||
@ -176,6 +176,11 @@
|
||||
.page-mj .inner .task-list-box .finish-job-list .job-item {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid #666;
|
||||
padding: 6px;
|
||||
overflow: hidden;
|
||||
border-radius: 6px;
|
||||
transition: all 0.3s ease; /* 添加过渡效果 */
|
||||
}
|
||||
.page-mj .inner .task-list-box .finish-job-list .job-item .opt .opt-line {
|
||||
margin: 6px 0;
|
||||
@ -185,11 +190,11 @@
|
||||
flex-flow: row;
|
||||
}
|
||||
.page-mj .inner .task-list-box .finish-job-list .job-item .opt .opt-line ul li {
|
||||
margin-right: 10px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
.page-mj .inner .task-list-box .finish-job-list .job-item .opt .opt-line ul li a {
|
||||
padding: 3px 0;
|
||||
width: 44px;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
display: block;
|
||||
@ -204,10 +209,14 @@
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.page-mj .inner .task-list-box .finish-job-list .job-item:hover {
|
||||
box-shadow: 0 0 10px rgba(71,255,241,0.6); /* 添加阴影效果 */
|
||||
transform: translateY(-10px); /* 向上移动10像素 */
|
||||
}
|
||||
.page-mj .inner .task-list-box .el-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-height: 240px;
|
||||
overflow: visible;
|
||||
}
|
||||
.page-mj .inner .task-list-box .el-image img {
|
||||
height: 240px;
|
||||
@ -224,16 +233,17 @@
|
||||
height: 100%;
|
||||
min-height: 200px;
|
||||
color: #fff;
|
||||
height: 240px;
|
||||
}
|
||||
.page-mj .inner .task-list-box .el-image .image-slot .iconfont {
|
||||
font-size: 50px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.page-mj .inner .task-list-box .el-image.upscale {
|
||||
max-height: 304px;
|
||||
max-height: 310px;
|
||||
}
|
||||
.page-mj .inner .task-list-box .el-image.upscale img {
|
||||
height: 304px;
|
||||
height: 310px;
|
||||
}
|
||||
.page-mj .inner .task-list-box .el-image.upscale .el-image-viewer__wrapper img {
|
||||
width: auto;
|
||||
|
||||
@ -99,6 +99,11 @@
|
||||
.page-sd .inner .task-list-box .finish-job-list .job-item {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid #666;
|
||||
padding: 6px;
|
||||
overflow: hidden;
|
||||
border-radius: 6px;
|
||||
transition: all 0.3s ease; /* 添加过渡效果 */
|
||||
}
|
||||
.page-sd .inner .task-list-box .finish-job-list .job-item .opt .opt-line {
|
||||
margin: 6px 0;
|
||||
@ -108,11 +113,11 @@
|
||||
flex-flow: row;
|
||||
}
|
||||
.page-sd .inner .task-list-box .finish-job-list .job-item .opt .opt-line ul li {
|
||||
margin-right: 10px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
.page-sd .inner .task-list-box .finish-job-list .job-item .opt .opt-line ul li a {
|
||||
padding: 3px 0;
|
||||
width: 44px;
|
||||
width: 40px;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
display: block;
|
||||
@ -127,10 +132,14 @@
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.page-sd .inner .task-list-box .finish-job-list .job-item:hover {
|
||||
box-shadow: 0 0 10px rgba(71,255,241,0.6); /* 添加阴影效果 */
|
||||
transform: translateY(-10px); /* 向上移动10像素 */
|
||||
}
|
||||
.page-sd .inner .task-list-box .el-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-height: 240px;
|
||||
overflow: visible;
|
||||
}
|
||||
.page-sd .inner .task-list-box .el-image img {
|
||||
height: 240px;
|
||||
@ -147,16 +156,17 @@
|
||||
height: 100%;
|
||||
min-height: 200px;
|
||||
color: #fff;
|
||||
height: 240px;
|
||||
}
|
||||
.page-sd .inner .task-list-box .el-image .image-slot .iconfont {
|
||||
font-size: 50px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.page-sd .inner .task-list-box .el-image.upscale {
|
||||
max-height: 304px;
|
||||
max-height: 310px;
|
||||
}
|
||||
.page-sd .inner .task-list-box .el-image.upscale img {
|
||||
height: 304px;
|
||||
height: 310px;
|
||||
}
|
||||
.page-sd .inner .task-list-box .el-image.upscale .el-image-viewer__wrapper img {
|
||||
width: auto;
|
||||
@ -180,6 +190,15 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .img-container .image-slot {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .img-container .image-slot .el-icon {
|
||||
font-size: 60px;
|
||||
}
|
||||
.page-sd .el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info {
|
||||
background-color: #25262b;
|
||||
padding: 1rem 1.5rem;
|
||||
|
||||
@ -102,6 +102,15 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.page-images-wall .el-overlay-dialog .el-dialog .el-dialog__body .el-row .img-container .image-slot {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.page-images-wall .el-overlay-dialog .el-dialog .el-dialog__body .el-row .img-container .image-slot .el-icon {
|
||||
font-size: 60px;
|
||||
}
|
||||
.page-images-wall .el-overlay-dialog .el-dialog .el-dialog__body .el-row .task-info {
|
||||
background-color: #25262b;
|
||||
padding: 1rem 1.5rem;
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
padding 6px
|
||||
overflow hidden
|
||||
border-radius 6px
|
||||
transition: all 0.3s ease; /* 添加过渡效果 */
|
||||
|
||||
.opt {
|
||||
.opt-line {
|
||||
@ -54,7 +55,7 @@
|
||||
flex-flow row
|
||||
|
||||
li {
|
||||
margin-right 10px
|
||||
margin-right 6px
|
||||
|
||||
a {
|
||||
padding 3px 0
|
||||
@ -80,6 +81,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0 10px rgba(71, 255, 241, 0.6); /* 添加阴影效果 */
|
||||
transform: translateY(-10px); /* 向上移动10像素 */
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -87,7 +93,7 @@
|
||||
.el-image {
|
||||
width 100%
|
||||
height 100%
|
||||
max-height 240px
|
||||
overflow visible
|
||||
|
||||
img {
|
||||
height 240px
|
||||
@ -108,6 +114,7 @@
|
||||
height 100%
|
||||
min-height 200px
|
||||
color #ffffff
|
||||
height 240px
|
||||
|
||||
.iconfont {
|
||||
font-size 50px
|
||||
|
||||
@ -128,3 +128,32 @@ export function copyObj(origin) {
|
||||
export function disabledDate(time) {
|
||||
return time.getTime() < Date.now()
|
||||
}
|
||||
|
||||
// 字符串截取
|
||||
export function substr(str, length) {
|
||||
let result = ''
|
||||
let count = 0
|
||||
|
||||
for (let i = 0; i < str.length; i++) {
|
||||
const char = str.charAt(i)
|
||||
const charCode = str.charCodeAt(i);
|
||||
|
||||
// 判断字符是否为中文字符
|
||||
if (charCode >= 0x4e00 && charCode <= 0x9fff) {
|
||||
// 中文字符算两个字符
|
||||
count += 2
|
||||
} else {
|
||||
count++
|
||||
}
|
||||
|
||||
if (count <= length) {
|
||||
result += char
|
||||
} else {
|
||||
result += " ..."
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
return result
|
||||
}
|
||||
|
||||
|
||||
@ -12,7 +12,8 @@
|
||||
<span class="name">{{ scope.item.name }}</span>
|
||||
<div class="opt">
|
||||
|
||||
<el-button v-if="hasRole(scope.item.key)" size="small" type="danger">
|
||||
<el-button v-if="hasRole(scope.item.key)" size="small" type="danger"
|
||||
@click="updateRole(scope.item,'remove')">
|
||||
<el-icon>
|
||||
<Delete/>
|
||||
</el-icon>
|
||||
@ -20,7 +21,7 @@
|
||||
</el-button>
|
||||
<el-button v-else size="small"
|
||||
style="--el-color-primary:#009999"
|
||||
@click="addRole(scope.item)">
|
||||
@click="updateRole(scope.item, 'add')">
|
||||
<el-icon>
|
||||
<Plus/>
|
||||
</el-icon>
|
||||
@ -28,7 +29,7 @@
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hello-msg">{{ scope.item['hello_msg'] }}</div>
|
||||
<div class="hello-msg" ref="elements">{{ scope.item.intro }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</ItemList>
|
||||
@ -39,22 +40,28 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {onMounted, ref} from "vue"
|
||||
import {nextTick, onMounted, ref} from "vue"
|
||||
import {ElMessage} from "element-plus";
|
||||
import {httpGet, httpPost} from "@/utils/http";
|
||||
import ItemList from "@/components/ItemList.vue";
|
||||
import {Delete, Plus} from "@element-plus/icons-vue";
|
||||
import LoginDialog from "@/components/LoginDialog.vue";
|
||||
import {checkSession} from "@/action/session";
|
||||
import {arrayContains} from "@/utils/libs";
|
||||
import {arrayContains, removeArrayItem, substr} from "@/utils/libs";
|
||||
|
||||
const listBoxHeight = window.innerHeight - 97
|
||||
const list = ref([])
|
||||
const showLoginDialog = ref(false)
|
||||
const roles = ref([])
|
||||
const elements = ref(null)
|
||||
onMounted(() => {
|
||||
httpGet("/api/role/list?all=true").then((res) => {
|
||||
list.value = res.data
|
||||
const items = res.data
|
||||
// 处理 hello message
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
items[i].intro = substr(items[i].hello_msg, 80)
|
||||
}
|
||||
list.value = items
|
||||
}).catch(e => {
|
||||
ElMessage.error("获取应用失败：" + e.message)
|
||||
})
|
||||
@ -63,19 +70,31 @@ onMounted(() => {
|
||||
roles.value = user.chat_roles
|
||||
}).catch(() => {
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
const addRole = (row) => {
|
||||
const updateRole = (row, opt) => {
|
||||
checkSession().then(() => {
|
||||
const exists = arrayContains(roles.value, row.key, (v1, v2) => v1 === v2)
|
||||
if (exists) {
|
||||
return
|
||||
const title = ref("")
|
||||
if (opt === "add") {
|
||||
title.value = "添加应用"
|
||||
const exists = arrayContains(roles.value, row.key)
|
||||
if (exists) {
|
||||
return
|
||||
}
|
||||
roles.value.push(row.key)
|
||||
} else {
|
||||
title.value = "移除应用"
|
||||
const exists = arrayContains(roles.value, row.key)
|
||||
if (!exists) {
|
||||
return
|
||||
}
|
||||
roles.value = removeArrayItem(roles.value, row.key)
|
||||
}
|
||||
roles.value.push(row.key)
|
||||
httpPost("/api/role/add", {keys: roles.value}).then(() => {
|
||||
ElMessage.success("添加应用成功！")
|
||||
httpPost("/api/role/update", {keys: roles.value}).then(() => {
|
||||
ElMessage.success(title.value + "成功！")
|
||||
}).catch(e => {
|
||||
ElMessage.error("添加应用失败：" + e.message)
|
||||
ElMessage.error(title.value + "失败：" + e.message)
|
||||
})
|
||||
}).catch(() => {
|
||||
showLoginDialog.value = true
|
||||
|
||||
@ -226,58 +226,39 @@
|
||||
<ItemList :items="runningJobs" v-if="runningJobs.length > 0">
|
||||
<template #default="scope">
|
||||
<div class="job-item">
|
||||
<el-popover
|
||||
placement="top-start"
|
||||
:title="getTaskType(scope.item.type)"
|
||||
:width="240"
|
||||
trigger="hover"
|
||||
>
|
||||
<template #reference>
|
||||
<div v-if="scope.item.progress > 0" class="job-item-inner">
|
||||
<el-image :src="scope.item['img_url']"
|
||||
:zoom-rate="1.2"
|
||||
:preview-src-list="[scope.item['img_url']]"
|
||||
fit="cover"
|
||||
:initial-index="0" loading="lazy">
|
||||
<template #placeholder>
|
||||
<div class="image-slot">
|
||||
正在加载图片
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon>
|
||||
<Picture/>
|
||||
</el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
|
||||
<div class="progress">
|
||||
<el-progress type="circle" :percentage="scope.item.progress" :width="100" color="#47fff1"/>
|
||||
<div v-if="scope.item.progress > 0" class="job-item-inner">
|
||||
<el-image :src="scope.item['img_url']"
|
||||
:zoom-rate="1.2"
|
||||
:preview-src-list="[scope.item['img_url']]"
|
||||
fit="cover"
|
||||
:initial-index="0" loading="lazy">
|
||||
<template #placeholder>
|
||||
<div class="image-slot">
|
||||
正在加载图片
|
||||
</div>
|
||||
</div>
|
||||
<el-image fit="cover" v-else>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<i class="iconfont icon-quick-start"></i>
|
||||
<span>任务正在排队中</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<template #default>
|
||||
<div class="mj-list-item-prompt">
|
||||
<span>{{ scope.item.prompt }}</span>
|
||||
<el-icon class="copy-prompt" :data-clipboard-text="scope.item.prompt">
|
||||
<DocumentCopy/>
|
||||
</el-icon>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon>
|
||||
<Picture/>
|
||||
</el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
|
||||
<div class="progress">
|
||||
<el-progress type="circle" :percentage="scope.item.progress" :width="100" color="#47fff1"/>
|
||||
</div>
|
||||
</div>
|
||||
<el-image fit="cover" v-else>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<i class="iconfont icon-quick-start"></i>
|
||||
<span>任务正在排队中</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-popover>
|
||||
|
||||
</el-image>
|
||||
</div>
|
||||
</template>
|
||||
</ItemList>
|
||||
@ -286,7 +267,7 @@
|
||||
|
||||
<h2>创作记录</h2>
|
||||
<div class="finish-job-list">
|
||||
<ItemList :items="finishedJobs" v-if="finishedJobs.length > 0" width="240">
|
||||
<ItemList :items="finishedJobs" v-if="finishedJobs.length > 0" width="240" :gap="16">
|
||||
<template #default="scope">
|
||||
<div class="job-item">
|
||||
<el-image
|
||||
|
||||
@ -292,55 +292,37 @@
|
||||
<ItemList :items="runningJobs" v-if="runningJobs.length > 0" width="240">
|
||||
<template #default="scope">
|
||||
<div class="job-item">
|
||||
<el-popover
|
||||
placement="top-start"
|
||||
title="绘画提示词"
|
||||
:width="240"
|
||||
trigger="hover"
|
||||
>
|
||||
<template #reference>
|
||||
<div v-if="scope.item.progress > 0" class="job-item-inner">
|
||||
<el-image :src="scope.item['img_url']"
|
||||
fit="cover"
|
||||
loading="lazy">
|
||||
<template #placeholder>
|
||||
<div class="image-slot">
|
||||
正在加载图片
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon v-if="scope.item['img_url'] !== ''">
|
||||
<Picture/>
|
||||
</el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
|
||||
<div class="progress">
|
||||
<el-progress type="circle" :percentage="scope.item.progress" :width="100" color="#47fff1"/>
|
||||
<div v-if="scope.item.progress > 0" class="job-item-inner">
|
||||
<el-image :src="scope.item['img_url']"
|
||||
fit="cover"
|
||||
loading="lazy">
|
||||
<template #placeholder>
|
||||
<div class="image-slot">
|
||||
正在加载图片
|
||||
</div>
|
||||
</div>
|
||||
<el-image fit="cover" v-else>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<i class="iconfont icon-quick-start"></i>
|
||||
<span>任务正在排队中</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<template #default>
|
||||
<div class="mj-list-item-prompt">
|
||||
<span>{{ scope.item.prompt }}</span>
|
||||
<el-icon class="copy-prompt" :data-clipboard-text="scope.item.prompt">
|
||||
<DocumentCopy/>
|
||||
</el-icon>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon v-if="scope.item['img_url'] !== ''">
|
||||
<Picture/>
|
||||
</el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
|
||||
<div class="progress">
|
||||
<el-progress type="circle" :percentage="scope.item.progress" :width="100" color="#47fff1"/>
|
||||
</div>
|
||||
</div>
|
||||
<el-image fit="cover" v-else>
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<i class="iconfont icon-quick-start"></i>
|
||||
<span>任务正在排队中</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-popover>
|
||||
</el-image>
|
||||
</div>
|
||||
</template>
|
||||
</ItemList>
|
||||
@ -348,7 +330,7 @@
|
||||
</div>
|
||||
<h2>创作记录</h2>
|
||||
<div class="finish-job-list">
|
||||
<ItemList :items="finishedJobs" v-if="finishedJobs.length > 0">
|
||||
<ItemList :items="finishedJobs" v-if="finishedJobs.length > 0" width="240" :gap="16">
|
||||
<template #default="scope">
|
||||
<div class="job-item" @click="showTask(scope.item)">
|
||||
<el-image
|
||||
|
||||
Loading…
Reference in New Issue
Block a user