抛弃轮询，使用websocket获取任务进度;部分优化;去除残留的条件判断;修复去除临时本子时加载不存在的预览图(同步更新)写死图片宽度;
This commit is contained in:
chuzhongzai
parent
e0ec08c874
commit
5cf7549b35
@ -45,7 +45,7 @@
|
||||
<el-dialog title="查询本子" v-model="chosenGallery" style="height: 350px">
|
||||
<el-image v-show='chosenGallery.thumb_link !== undefined'
|
||||
style="float: right; width: 250px; height: 250px;" fit="contain"
|
||||
:src="'https://downloader.lionwebsite.xyz/GalleryManage/ehThumbnail?path=' + chosenGallery.thumb_link"/>
|
||||
:src="chosenGallery.thumb_link !== undefined ? 'https://downloader.lionwebsite.xyz/GalleryManage/ehThumbnail?path=' + chosenGallery.thumb_link: ''"/>
|
||||
<table>
|
||||
<tr>本子名字:{{chosenGallery.name}}</tr>
|
||||
<tr>本子页数:{{chosenGallery.pages}}</tr>
|
||||
@ -62,10 +62,9 @@
|
||||
</table>
|
||||
<template #footer>
|
||||
<el-button @click="postTask" v-if="chosenGallery.availableResolution">下载</el-button>
|
||||
<el-button @click="window.open(chosenGallery.download)" v-else>下载文件</el-button>
|
||||
<el-button @click="readOnlineGallery(chosenGallery)">在线预览</el-button>
|
||||
<tr v-if="chosenGallery.status === '下载完成'">
|
||||
<el-button @click="deleteGallery">删除</el-button>
|
||||
</tr>
|
||||
<el-button v-if="chosenGallery.status === '下载完成'" @click="deleteGallery">删除</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
@ -111,7 +110,6 @@
|
||||
在线预览<hr>
|
||||
<span style="display: inline-block">在线预览分页页数:</span>
|
||||
<input v-model="lengthPerPage">
|
||||
(建议为3的倍数，因为固定了一行三张)
|
||||
</div>
|
||||
<template #footer>
|
||||
<el-button type="primary" @click="saveConfig">保存</el-button>
|
||||
@ -157,6 +155,7 @@ let realAuthCode = computed(() => {
|
||||
|
||||
let chosenGallery = computed(() => {
|
||||
param.value = ''
|
||||
targetResolution.value = ''
|
||||
return store.state.chosenGallery
|
||||
})
|
||||
|
||||
@ -203,7 +202,6 @@ function postTask(){
|
||||
store.dispatch("postGalleryTask",
|
||||
{link: chosenGallery.value.link,
|
||||
targetResolution: targetResolution.value})
|
||||
targetResolution.value = ""
|
||||
}
|
||||
|
||||
//查询任务
|
||||
|
||||
@ -86,13 +86,11 @@ function set_current_page(page){
|
||||
</div>
|
||||
</template>
|
||||
<el-scrollbar height="75vh" ref="onlineReadingScrollbar">
|
||||
<div v-for="(link, i) in links" style="display: inline-block; text-align: center">
|
||||
<el-image :src="link" :style="{'width': store.state.imageWidth, 'padding-right': store.state.imagePadding, 'background-color': 'gary'}"
|
||||
<div v-for="(link, i) in links" style="display: inline-block; text-align: center; min-height: 300px">
|
||||
<el-image :src="link" :style="{'width': '66vw', 'background-color': 'gary'}"
|
||||
:preview-src-list="links" :initial-index="i" @switch="switch_page" @show="set_current_page(i)" loading="lazy"/><br>
|
||||
{{lengthPerPage * index + i + 1}}
|
||||
</div>
|
||||
|
||||
|
||||
</el-scrollbar>
|
||||
|
||||
<!-- 十页以下-->
|
||||
|
||||
@ -35,9 +35,9 @@
|
||||
<el-table-column label="操作" width="300vw">
|
||||
<template #default="scoped">
|
||||
<span>
|
||||
<el-button @click="downloadTask(scoped.row.download)" :disabled="scoped.row.status !== '下载完成' || scoped.row.mode === 2">下载</el-button>
|
||||
<el-button @click="downloadTask(scoped.row.download)" :disabled="scoped.row.status !== '下载完成'">下载</el-button>
|
||||
<el-button @click="changeGalleryCollect(scoped.row.gid, scoped.row.isCollect)">{{scoped.row.isCollect ? '取消收藏' : '收藏'}}</el-button>
|
||||
<el-button @click="readOnlineGallery(scoped.row)" :disabled="scoped.row.status !== '下载完成' || scoped.row.mode === 1">在线看</el-button>
|
||||
<el-button @click="readOnlineGallery(scoped.row)">在线看</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
@ -102,8 +102,6 @@ import axios from "axios";
|
||||
import {ElMessage} from "element-plus";
|
||||
import OnlineReader from "./OnlineReader.vue";
|
||||
|
||||
let GalleryManagePrefix = "https://downloader.lionwebsite.xyz/GalleryManage/"
|
||||
|
||||
//输入
|
||||
let inputNode = ref(null)
|
||||
//是否正在编辑页数
|
||||
|
||||
@ -6,32 +6,15 @@ const BaseUrl = "https://downloader.lionwebsite.xyz/"
|
||||
const GalleryManageUrl = BaseUrl + "GalleryManage"
|
||||
|
||||
const actions = {
|
||||
updateGalleryTasks(context, type){
|
||||
updateGalleryTasks(context){
|
||||
axios.get(GalleryManageUrl, {
|
||||
params:{
|
||||
type,
|
||||
AuthCode: state.AuthCode
|
||||
AuthCode: state.AuthCode,
|
||||
type: 'all'
|
||||
}
|
||||
}).then((res) => {
|
||||
if(res.data.result === "success") {
|
||||
let tasks = JSON.parse(res.data.data)
|
||||
if (type === "all" && state.galleryRefreshTimer === 0) { //判断是否有未下载完成的本子以及定时更新是否开启
|
||||
for (let i = tasks.length - 1; i > tasks.length - 11; i--) //从后往前遍历十个本子,查看是否有未下载完成的本子
|
||||
if (tasks[i].status !== "下载完成") {
|
||||
state.galleryRefreshTimer = setInterval(() => {
|
||||
context.dispatch("updateGalleryTasks", "undone").then()
|
||||
}, 20000)
|
||||
break
|
||||
}
|
||||
}
|
||||
context.commit("_updateGalleryTasks", {tasks, type})
|
||||
}
|
||||
|
||||
else if(type === 'undone') {
|
||||
context.dispatch("updateGalleryTasks", "all").then()
|
||||
clearInterval(state.galleryRefreshTimer)
|
||||
state.galleryRefreshTimer = 0
|
||||
}
|
||||
if(res.data.result === "success")
|
||||
context.commit("_updateGalleryTasks", JSON.parse(res.data.data))
|
||||
})
|
||||
},
|
||||
postGalleryTask(context, data){
|
||||
@ -43,17 +26,12 @@ const actions = {
|
||||
ElMessage("提交成功")
|
||||
context.commit("_setChosenGallery", {gallery: false,
|
||||
resolution:data.targetResolution})
|
||||
if(state.galleryRefreshTimer === 0)
|
||||
state.galleryRefreshTimer = setInterval(() => {
|
||||
context.dispatch("updateGalleryTasks", "undone").then()
|
||||
}, 20000)
|
||||
}
|
||||
else{
|
||||
else
|
||||
if(res.data.data)
|
||||
ElMessage(res.data.data)
|
||||
else
|
||||
ElMessage("提交失败")
|
||||
}
|
||||
})
|
||||
},
|
||||
queryGalleryTask(context, link){
|
||||
@ -79,16 +57,31 @@ const actions = {
|
||||
context.commit("_authed", {AuthCode, ...data})
|
||||
//初始化
|
||||
context.dispatch("loadWeekUsedAmount").then()
|
||||
context.dispatch("updateGalleryTasks", "all").then(() => confirmCurrentTask(context.state))
|
||||
|
||||
//写死图片合适宽度
|
||||
state.imageWidth = 27 + 'vw'
|
||||
state.imagePadding = 1 + 'vw'
|
||||
context.dispatch("updateGalleryTasks").then(() => confirmCurrentTask(context.state))
|
||||
context.dispatch("initWebsocket").then()
|
||||
}
|
||||
else
|
||||
context.commit("_unAuthed")
|
||||
})
|
||||
},
|
||||
initWebsocket(context){
|
||||
state.websocket = new WebSocket("wss://downloader.lionwebsite.xyz/ws/")
|
||||
state.websocket.onopen = () => {
|
||||
state.websocket.send("DownloaderWebsocket")
|
||||
}
|
||||
|
||||
state.websocket.onmessage = (event) => {
|
||||
let message = JSON.parse(event.data)
|
||||
|
||||
switch (message.type){
|
||||
case "updateTasks":
|
||||
context.commit("_updateGalleryTaskProceeding", message.data)
|
||||
break
|
||||
case "fullUpdate":
|
||||
context.dispatch("updateGalleryTasks").then()
|
||||
}
|
||||
}
|
||||
},
|
||||
loadWeekUsedAmount(context){
|
||||
axios.get(GalleryManageUrl + "/weekUsedAmount", {
|
||||
params: {
|
||||
@ -184,95 +177,71 @@ const mutations = {
|
||||
state.collectGallery[index].isCollect = false
|
||||
state.collectGallery.splice(index, 1)
|
||||
},
|
||||
_updateGalleryTasks(state, data){
|
||||
let {tasks, type} = data
|
||||
if(type === 'all') {
|
||||
state.totalGalleryTask.splice(0)
|
||||
state.collectGallery.slice(0)
|
||||
state.downloadGallery.splice(0)
|
||||
_updateGalleryTasks(state, tasks){
|
||||
state.totalGalleryTask.splice(0)
|
||||
state.collectGallery.slice(0)
|
||||
state.downloadGallery.splice(0)
|
||||
|
||||
tasks.forEach((task) => {
|
||||
//处理名字
|
||||
task.shortName = getShortname(task.name)
|
||||
task.thumb_link = GalleryManageUrl + "/ehThumbnail?path=" + task.thumb_link
|
||||
tasks.forEach((task) => {
|
||||
//处理名字
|
||||
task.shortName = getShortname(task.name)
|
||||
task.thumb_link = GalleryManageUrl + "/ehThumbnail?path=" + task.thumb_link
|
||||
|
||||
//处理进度相关
|
||||
switch (task.status) {
|
||||
case "已提交":
|
||||
task.progress = "已提交"
|
||||
break;
|
||||
case "下载中":
|
||||
task.progress = (Math.round((task.proceeding / task.pages) * 100)).toString() + "%"
|
||||
break;
|
||||
case "下载完成":
|
||||
task.progress = "下载完成"
|
||||
task.download = GalleryManageUrl + "/file/" + encodeURI(task.name) + ".zip?AuthCode=" + state.AuthCode + "&gid=" + task.gid
|
||||
break;
|
||||
case "压缩中":
|
||||
task.progress = "压缩中"
|
||||
break
|
||||
}
|
||||
//处理进度相关
|
||||
switch (task.status) {
|
||||
case "已提交":
|
||||
case "压缩中":
|
||||
task.progress = task.status
|
||||
break;
|
||||
case "下载中":
|
||||
task.progress = (Math.round((task.proceeding / task.pages) * 100)).toString() + "%"
|
||||
break;
|
||||
case "下载完成":
|
||||
task.progress = task.status
|
||||
task.download = GalleryManageUrl + "/file/" + encodeURI(task.name) + ".zip?AuthCode=" + state.AuthCode + "&gid=" + task.gid
|
||||
break;
|
||||
}
|
||||
|
||||
//处理时间戳
|
||||
task.createTimeDisplay = new Date(task.createTime * 1000).toLocaleString("zh")
|
||||
//处理时间戳
|
||||
task.createTimeDisplay = new Date(task.createTime * 1000).toLocaleString("zh")
|
||||
|
||||
//处理是否收藏
|
||||
if('isCollect' in task)
|
||||
state.collectGallery.push(task)
|
||||
else
|
||||
task.isCollect = false
|
||||
//处理是否收藏
|
||||
if('isCollect' in task)
|
||||
state.collectGallery.push(task)
|
||||
else
|
||||
task.isCollect = false
|
||||
|
||||
//处理是否下载
|
||||
if(task.downloader === state.userId)
|
||||
state.downloadGallery.push(task)
|
||||
//处理是否下载
|
||||
if(task.downloader === state.userId)
|
||||
state.downloadGallery.push(task)
|
||||
|
||||
state.totalGalleryTask.push(task)
|
||||
})
|
||||
} else {
|
||||
let tempArray = Array.from(state.totalGalleryTask)
|
||||
state.totalGalleryTask.splice(0)
|
||||
let preDeleteIndex
|
||||
tempArray.forEach((task) => {
|
||||
preDeleteIndex = -1
|
||||
if(task.status !== "下载完成")
|
||||
for(let i=0; i < tasks.length; i++)
|
||||
if (tasks[i] !== undefined && tasks[i].name === task.name) {
|
||||
preDeleteIndex = i
|
||||
task.status = tasks[i].status
|
||||
task.proceeding = tasks[i].proceeding
|
||||
if (task.proceeding === 0)
|
||||
task.progress = task.status
|
||||
else
|
||||
task.progress = (Math.round((task.proceeding / task.pages) * 100)).toString() + "%"
|
||||
}
|
||||
state.totalGalleryTask.push(task)
|
||||
})
|
||||
|
||||
if(preDeleteIndex !== -1)
|
||||
delete tasks[preDeleteIndex]
|
||||
state.totalGalleryTask.push(task)
|
||||
})
|
||||
}
|
||||
|
||||
switch (state.sortType) {
|
||||
case "name":
|
||||
state.totalGalleryTask = state.totalGalleryTask.sort((before, after) => {
|
||||
return before.name > after.name ? 1: -1
|
||||
})
|
||||
break
|
||||
case "shortName":
|
||||
state.totalGalleryTask = state.totalGalleryTask.sort((before, after) => {
|
||||
return before.shortName > after.shortName ? 1: -1
|
||||
})
|
||||
break
|
||||
case "createTime":
|
||||
state.totalGalleryTask = state.totalGalleryTask.sort((before, after) => {
|
||||
return before.createTime - after.createTime
|
||||
})
|
||||
}
|
||||
sortTasks(state)
|
||||
if(state.isAuth && !state.loadComplete){
|
||||
state.loadComplete = true
|
||||
ElMessage("加载完成")
|
||||
}
|
||||
},
|
||||
_updateGalleryTaskProceeding(state, tasks){
|
||||
let galleries = Array.from(state.totalGalleryTask)
|
||||
state.totalGalleryTask.splice(0)
|
||||
galleries.forEach((gallery) => {
|
||||
if(gallery.status !== '下载完成')
|
||||
tasks.forEach((task) => {
|
||||
if(task.gid === gallery.gid){
|
||||
gallery.status = status[task.status]
|
||||
gallery.proceeding = task.proceeding
|
||||
if(gallery.status === '下载中')
|
||||
gallery.progress = (Math.round((gallery.proceeding / gallery.pages) * 100)).toString() + "%"
|
||||
else
|
||||
gallery.progress = gallery.status
|
||||
}
|
||||
})
|
||||
state.totalGalleryTask.push(gallery)
|
||||
})
|
||||
},
|
||||
_changePage(state, targetPage){
|
||||
state.page = targetPage
|
||||
},
|
||||
@ -352,6 +321,7 @@ const mutations = {
|
||||
state.chosenGallery.createTimeDisplay = "等待下载完成后再查看"
|
||||
state.chosenGallery.progress = "已提交"
|
||||
state.chosenGallery.downloader = state.userId
|
||||
state.chosenGallery.thumb_link = GalleryManageUrl + "/ehThumbnail?path=" + state.chosenGallery.thumb_link
|
||||
state.totalGalleryTask.push(state.chosenGallery)
|
||||
state.downloadGallery.push(state.chosenGallery)
|
||||
}
|
||||
@ -390,6 +360,8 @@ const mutations = {
|
||||
}
|
||||
|
||||
const state = {
|
||||
websocket: {}, //websocket
|
||||
|
||||
totalGalleryTask: [], //存放本子数据的数组
|
||||
chosenGallery: false, //准备下载的本子
|
||||
thumbnailGallery: {}, //缩略图本子
|
||||
@ -401,8 +373,6 @@ const state = {
|
||||
isReading: false, //是否正在看
|
||||
|
||||
currentGid: "", //当前GID
|
||||
imageWidth: "", //图片宽度
|
||||
imagePadding: "", //图片padding
|
||||
lengthPerPage: 0, //在线预览每页图片数量
|
||||
|
||||
page: 1, //当前页数
|
||||
@ -526,7 +496,7 @@ function sortTasks(state){
|
||||
})
|
||||
break
|
||||
case "createTime":
|
||||
state.currentTasks = state.currentTasks.sort((before, after) => {
|
||||
state.currentTasks = state.currentTasks.sort((before, after) => {
|
||||
return before.createTime - after.createTime
|
||||
})
|
||||
}
|
||||
@ -540,3 +510,5 @@ function deleteTask(tasks, key, value){
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
let status = ['已提交', '下载中', '等待压缩', '压缩中', '下载完成']
|
||||
Loading…
Reference in New Issue
Block a user