From 3daff3b8fcbda8f9aedb8e4c20de6c451caeb0cd Mon Sep 17 00:00:00 2001 From: chuzhongzai Date: Thu, 20 Oct 2022 10:06:51 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=8C=89=E7=85=A7=E4=BB=BB?= =?UTF-8?q?=E5=8A=A1=E5=88=9B=E5=BB=BA=E6=97=B6=E9=97=B4/=E5=90=8D?= =?UTF-8?q?=E7=A7=B0=E6=8E=92=E5=BA=8F=EF=BC=8C=20=E9=BB=98=E8=AE=A4?= =?UTF-8?q?=E5=8F=AA=E5=8A=A0=E8=BD=BD40=E4=B8=AA=E4=BB=BB=E5=8A=A1?= =?UTF-8?q?=EF=BC=8C=E5=89=A9=E4=B8=8B=E7=9A=84=E9=9C=80=E8=A6=81=E6=89=8B?= =?UTF-8?q?=E5=8A=A8=E6=9F=A5=E8=AF=A2=EF=BC=8C=E7=A7=BB=E9=99=A4=E6=9C=AC?= =?UTF-8?q?=E5=9C=B0=E6=90=9C=E7=B4=A2=E7=9A=84=E5=AE=9A=E6=97=B6=E5=99=A8?= =?UTF-8?q?=EF=BC=8C=E6=96=B0=E5=A2=9E=E6=96=B0=E7=89=B9=E6=80=A7=E6=8F=90?= =?UTF-8?q?=E7=A4=BA(=E5=90=8C=E6=AD=A5=E6=9B=B4=E6=96=B0)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/DashBoard.vue | 117 ++++++++++++++++------------- src/components/Side.vue | 58 +++++++-------- src/store/index.js | 138 ++++++++++++++++++++++++++--------- 3 files changed, 195 insertions(+), 118 deletions(-) diff --git a/src/components/DashBoard.vue b/src/components/DashBoard.vue index ddcd3f2..880c78d 100644 --- a/src/components/DashBoard.vue +++ b/src/components/DashBoard.vue @@ -5,47 +5,65 @@

- 查询任务 - 查找任务 + 查询远程任务 + 查找当前页任务


- +
- 确定 + 查找所有任务 + 查找当前页任务 +
+
+ 新增特性 - + - 本子名字:{{preDownloadGallery.name}} - 本子页数:{{preDownloadGallery.pages}} - 本子语言:{{preDownloadGallery.language}} - 本子大小:{{preDownloadGallery.fileSize}} - 本子状态:{{preDownloadGallery.status}} - + 本子名字:{{chosenGallery.name}} + 本子页数:{{chosenGallery.pages}} + 本子语言:{{chosenGallery.language}} + 本子大小:{{chosenGallery.fileSize}} + 本子状态:{{chosenGallery.status}} + 目标分辨率: -
- 下载 + 下载 + + 在线看 + 删除 +
- + - 视频名字:{{preDownloadVideo.name}} - 视频网站: {{preDownloadVideo.website}} - 视频链接: {{preDownloadVideo.link}} - 视频状态:{{preDownloadVideo.status}} - + 视频名字:{{chosenVideo.name}} + 视频网站: {{chosenVideo.website}} + 视频链接: {{chosenVideo.link}} + 视频状态:{{chosenVideo.status}} + 目标分辨率: - +
- 下载 + 下载 + 删除 +
+ + + + 1.查询远程任务的意思是前端直接提交链接给服务器,查询这个链接所对应的任务状态,平常创建任务点这个。而查找当前页任务是指将右边的页面跳转到包含这个任务的页面里
+ 2.查找所有任务跟查询远程任务类似,把关键字提交给服务器查询,但是只会对应一个任务。(对应多个没写,一定不是因为我懒)。第二个查找当前页任务则是在前端查询到的任务里筛选包含这个关键字的任务
+ 3.左下新增切换排列顺序的功能,可以选择按名称/任务创建时间排序(只有正序,倒序懒得写了)

+ 本来可以不用这么麻烦的,但是之前一直都是把所有任务加载到前端,浪费带宽,所以现在选择部分加载了,按照任务创建时间排序选择最新的40条任务,在这之前的任务可以通过查询远程任务/查找所有任务来访问到,或者直接去zfile页面找 +
@@ -67,14 +85,14 @@ export default { const keyword = ref("") const isRemember = ref(false) const targetResolution = ref("") - let timer + const showTips = ref(false) - let preDownloadGallery = computed(() => { - return store.state.preDownloadGallery + let chosenGallery = computed(() => { + return store.state.chosenGallery }) - let preDownloadVideo = computed(() => { - return store.state.preDownloadVideo + let chosenVideo = computed(() => { + return store.state.chosenVideo }) let maskDomain = computed(() => { @@ -133,6 +151,14 @@ export default { } } + function deleteVideo(){ + store.dispatch("deleteVideo", chosenVideo.value.id) + } + + function deleteGallery(){ + store.dispatch("deleteGallery", chosenGallery.value.gid) + } + function validate(){ if(AuthCode.value.trim() === ""){ ElMessage("请输入授权码后再验证") @@ -153,12 +179,13 @@ export default { } } - function searchByKeyword(){ - if(timer) - clearTimeout(timer) - timer = setTimeout(() => { - store.dispatch("searchByKeyword", keyword.value) - }, 500) + function searchLocalByKeyword(){ + console.log(keyword.value) + store.dispatch("searchLocalByKeyword",keyword.value) + } + + function searchRemoteByKeyword(){ + store.dispatch("searchRemoteByKeyword", keyword.value) } function coverLink(rawLink){ @@ -184,6 +211,10 @@ export default { } } + function onlineGalleryReader(name){ + window.open("http://zfile.lionwebsite.xyz/1/gallery/" + encodeURI(name)) + } + onMounted(() => { const auth = localStorage.getItem("auth") if(auth !== null){ @@ -191,23 +222,11 @@ export default { } }) - return {postTask, - queryTask, - validate, - searchByLink, - searchByKeyword, - modify, - queryWeekUsedAmount, - link, - loadComplete, - AuthCode, - keyword, - isRemember, - preDownloadGallery, - preDownloadVideo, - targetResolution, - weekUsed, - store + return {postTask, queryTask, validate, searchByLink, searchLocalByKeyword, searchRemoteByKeyword, modify, + queryWeekUsedAmount, deleteVideo, deleteGallery, onlineGalleryReader, + link, loadComplete, AuthCode, keyword, isRemember, chosenGallery, chosenVideo, targetResolution, weekUsed, + showTips, + store } } } diff --git a/src/components/Side.vue b/src/components/Side.vue index 4da4c35..ccd32e1 100644 --- a/src/components/Side.vue +++ b/src/components/Side.vue @@ -1,8 +1,8 @@ @@ -73,6 +75,12 @@ + + 排列顺序: + + + + {{min}} - @@ -106,7 +114,8 @@ export default { const isEditing = ref(false) let inputNode = ref(null) - let showType = ref("本子") + let showType = ref("gallery") + let sortType = ref("name") let galleryTasks = computed(() => { if(store.getters.galleryTasks) @@ -210,44 +219,27 @@ export default { function changeShowType(){ if(isShowVideoHistory.value){ store.commit("_setShowType", "gallery") - showType.value = "本子" + showType.value = "gallery" } else{ store.commit("_setShowType", "video") - showType.value = "视频" + showType.value = "video" } } + function changeSortType(sortType){ + store.commit("_setSortType", sortType) + } + function operational(download){ return download === undefined } - return {galleryTasks, - videoTasks, - min, - max, - targetPage, - loadComplete, - page, - isEditing, - inputNode, - isShowVideoHistory, - isShowGalleryHistory, - showType, - reverse, - changePage, - changeShowType, - toMax, - toMin, - previous, - next, - downloadTask, - deleteGallery, - deleteVideo, - onlineGalleryReader, - onlineVideoViewer, - operational, + return {galleryTasks, videoTasks, min, max, targetPage, loadComplete, page, isEditing, inputNode, isShowVideoHistory, + isShowGalleryHistory, showType, sortType, + reverse, changePage, changeShowType, changeSortType, toMax, toMin, previous, next, downloadTask, deleteGallery, + deleteVideo, onlineGalleryReader, onlineVideoViewer, operational, store } } @@ -264,8 +256,8 @@ export default { } .pageChanger{ position: absolute; - top:90vh; - left: 150px; + top: 85vh; + left: 75px; } .page{ display: inline-block; diff --git a/src/store/index.js b/src/store/index.js index 459081d..7024990 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -2,14 +2,15 @@ import vuex from "vuex" import axios from "axios" import {ElMessage} from "element-plus" import qs from "qs" +import moment from 'moment' const BaseUrl = "http://downloader.lionwebsite.xyz/" -const GalleryTaskHandlerUrl = BaseUrl + "GalleryManage/" -const VideoTaskHandlerUrl = BaseUrl + "VideoManage/" +const GalleryManageUrl = BaseUrl + "GalleryManage/" +const VideoManageUrl = BaseUrl + "VideoManage/" const actions = { updateGalleryTasks(context){ const AuthCode = context.state.AuthCode - axios.get(GalleryTaskHandlerUrl, { + axios.get(GalleryManageUrl, { params:{ param:"", type:"all", @@ -27,7 +28,7 @@ const actions = { }, updateVideoTasks(context){ const AuthCode = context.state.AuthCode - axios.get(VideoTaskHandlerUrl, { + axios.get(VideoManageUrl, { params:{ param:"123", type:"all", @@ -43,14 +44,14 @@ const actions = { }) }, postGalleryTask(context, data){ - axios.post(GalleryTaskHandlerUrl, qs.stringify({ + axios.post(GalleryManageUrl, qs.stringify({ AuthCode:context.state.AuthCode, link:data.link, targetResolution:data.targetResolution })).then((res) => { if(res.data.result === "success") { ElMessage("提交成功") - context.commit("_setPreDownloadGallery", {gallery:false, resolution:data.targetResolution}) + context.commit("_setChosenGallery", {gallery:false, resolution:data.targetResolution}) } else{ if(res.data.data) @@ -62,14 +63,14 @@ const actions = { }) }, postVideoTask(context, data){ - axios.post(VideoTaskHandlerUrl, qs.stringify({ + axios.post(VideoManageUrl, qs.stringify({ AuthCode:context.state.AuthCode, link: data.link, targetResolution: data.targetResolution })).then((res) => { if(res.data.result === "success") { ElMessage("提交成功") - context.commit("_setPreDownloadVideo", {video:false, resolution:data.targetResolution}) + context.commit("_setChosenVideo", {video:false, resolution:data.targetResolution}) } else{ if(res.data.data) @@ -82,7 +83,7 @@ const actions = { }, queryGalleryTask(context, link){ const AuthCode = context.state.AuthCode - axios.get(GalleryTaskHandlerUrl, { + axios.get(GalleryManageUrl, { params:{ param:link, type:'link', @@ -91,7 +92,7 @@ const actions = { }).then((res) => { if(res.data.result === 'success'){ const gallery = JSON.parse(res.data.data) - context.commit("_setPreDownloadGallery", {gallery}) + context.commit("_setChosenGallery", {gallery}) } else ElMessage("查询失败") @@ -99,7 +100,7 @@ const actions = { }, queryVideoTask(context, link){ const AuthCode = context.state.AuthCode - axios.get(VideoTaskHandlerUrl, { + axios.get(VideoManageUrl, { params:{ param: link, type:"link", @@ -108,7 +109,7 @@ const actions = { }).then((res) => { if(res.data.result === 'success'){ const video = JSON.parse(res.data.data) - context.commit("_setPreDownloadVideo", {video}) + context.commit("_setChosenVideo", {video}) } else ElMessage("查询失败") @@ -145,13 +146,14 @@ const actions = { }) }, loadWeekUsedAmount(context){ - axios.get(GalleryTaskHandlerUrl + "weekUsedAmount", { + axios.get(GalleryManageUrl + "weekUsedAmount", { params: { AuthCode: context.state.AuthCode } }).then((res) => { if(res.data.result === "success"){ context.state.weekUsed = JSON.parse(res.data.data) + ElMessage("查询用量成功") }else{ ElMessage("查询用量失败") } @@ -160,11 +162,43 @@ const actions = { searchByLink(context, link){ context.commit("_searchByLink", link) }, - searchByKeyword(context, keyword){ - context.commit("_searchByKeyword", keyword) + searchLocalByKeyword(context, keyword){ + context.commit("_searchLocalByKeyword", keyword) + }, + searchRemoteByKeyword(context, keyword){ + if(context.state.showType === "gallery"){ + axios.get(GalleryManageUrl, { + params:{ + type:"name", + param:keyword + } + }).then((res) => { + if(res.data.result === 'success'){ + context.commit("_setChosenGallery", {'gallery':JSON.parse(res.data.data)}) + } + else{ + ElMessage(res.data.data) + } + }) + } + else{ + axios.get(VideoManageUrl, { + params:{ + type:"name", + param:keyword + } + }).then((res) => { + if(res.data.result === 'success'){ + context.commit("_setChosenVideo", {'video': JSON.parse(res.data.data)}) + } + else{ + ElMessage(res.data.data) + } + }) + } }, deleteGallery(context, gid){ - axios.delete(GalleryTaskHandlerUrl, { + axios.delete(GalleryManageUrl, { params:{ AuthCode:state.AuthCode, gid @@ -179,7 +213,7 @@ const actions = { }) }, deleteVideo(context, id){ - axios.delete(VideoTaskHandlerUrl, { + axios.delete(VideoManageUrl, { params:{ AuthCode:state.AuthCode, id @@ -220,10 +254,17 @@ const mutations = { if(url.host === mask['raw']) tempLink = task.link.replace(mask['raw'], mask['mask']) }) - task.download = GalleryTaskHandlerUrl + "file/" + encodeURI(task.name) + "?link=" + tempLink + "&AuthCode=" + state.AuthCode + task.download = GalleryManageUrl + "file/" + encodeURI(task.name) + "?link=" + tempLink + "&AuthCode=" + state.AuthCode } + task.createTimeDisplay = moment(task.createTime * 1000).format("YYYY-MM-DD HH:mm:ss") state.totalGalleryTask.push(task) }) + state.totalGalleryTask = state.totalGalleryTask.sort((before, after) => { + if(state.sortType === 'name') + return before.name > after.name ? 1: -1 + else + return before.createTime - after.createTime + }) if(state.isAuth && !state.loadComplete){ state.loadComplete = true ElMessage("加载完成") @@ -240,10 +281,17 @@ const mutations = { if(url.host === mask['raw']) tempLink = task.link.replace(mask['raw'], mask['mask']) }) - task.download = VideoTaskHandlerUrl + "file/" + encodeURI(task.name) + "?link=" + tempLink + "&AuthCode=" + state.AuthCode + task.download = VideoManageUrl + "file/" + encodeURI(task.name) + "?link=" + tempLink + "&AuthCode=" + state.AuthCode + task.createTimeDisplay = moment(task.createTime * 1000).format("YYYY-MM-DD HH:mm:ss") } state.totalVideoTask.push(task) }) + state.totalVideoTask = state.totalVideoTask.sort((before, after) => { + if(state.sortType === 'name') + return before.name > after.name ? 1: -1 + else + return before.createTime - after.createTime + }) }, _changePage(state, targetPage){ state.page = targetPage @@ -282,7 +330,7 @@ const mutations = { ElMessage("已跳转到该任务所在页数") } }, - _searchByKeyword(state, keyword){ + _searchLocalByKeyword(state, keyword){ state.searchTask.splice(0) state.page = 1 let tasks @@ -311,28 +359,45 @@ const mutations = { arr.splice(index, 1) }) }, - _setPreDownloadGallery(state,data){ + _setChosenGallery(state,data){ if(data.gallery === false) { - state.preDownloadGallery.resolution = data.resolution - state.preDownloadGallery.fileSize = "等待下载完成后再查看" - state.preDownloadGallery.progress = "已提交" - state.totalGalleryTask.push(state.preDownloadGallery) + state.chosenGallery.resolution = data.resolution + state.chosenGallery.fileSize = "等待下载完成后再查看" + state.chosenGallery.createTimeDisplay = "等待下载完成后再查看" + state.chosenGallery.progress = "已提交" + state.totalGalleryTask.push(state.chosenGallery) } - state.preDownloadGallery = data.gallery + state.chosenGallery = data.gallery }, - _setPreDownloadVideo(state,data){ + _setChosenVideo(state,data){ if(data.video === false) { - state.preDownloadVideo.resolution = data.resolution - state.preDownloadVideo.fileSize = "下载完成后再查看" - state.preDownloadVideo.duration = "下载完成后再查看" - state.preDownloadVideo.progress = "已提交" - state.totalVideoTask.push(state.preDownloadVideo) + state.chosenVideo.resolution = data.resolution + state.chosenVideo.fileSize = "下载完成后再查看" + state.chosenVideo.duration = "下载完成后再查看" + state.chosenVideo.createTimeDisplay = "下载完成后再查看" + state.chosenVideo.progress = "已提交" + state.totalVideoTask.push(state.chosenVideo) } - state.preDownloadVideo = data.video + state.chosenVideo = data.video }, _setShowType(state, showType){ state.showType = showType }, + _setSortType(state, sortType){ + state.sortType = sortType + state.totalGalleryTask = state.totalGalleryTask.sort((before, after) => { + if(sortType === 'name') + return before.name > after.name ? 1: -1 + else + return before.createTime - after.createTime + }) + state.totalVideoTask = state.totalVideoTask.sort((before, after) => { + if(sortType === 'name') + return before.name > after.name ? 1: -1 + else + return before.createTime - after.createTime + }) + }, _setMaskDomain(state, maskDomain){ state.maskDomain = maskDomain } @@ -340,10 +405,10 @@ const mutations = { const state = { totalGalleryTask:[], //存放本子数据的数组 - preDownloadGallery:false, //准备下载的本子 + chosenGallery:false, //准备下载的本子 totalVideoTask:[], //存放视频数据的数组 - preDownloadVideo:false, //准备下载的视频 + chosenVideo:false, //准备下载的视频 page:1, //当前页数 length:8, //每页能有多少个链接 @@ -355,7 +420,8 @@ const state = { isInclude:false, //是否搜索到任务 searchTask:[], //搜索到的任务 showHistory:'', //是否打开面板 - showType:"gallery", //展示类型 + showType:'gallery', //展示类型 + sortType:'name', //排序类型 weekUsed:{}, maskDomain:[]