<template>
|
<div class="exportTaskBox">
|
<div class="taskList">
|
<p class="blockTitle">任务列表</p>
|
<p @click="newTask">测试创建任务</p>
|
<div
|
:class="'taskItem ' + selectedTaskIndex == index ? 'active' : ''"
|
v-for="(task, index) in tasks"
|
:key="index"
|
>
|
<p class="taskItemTitle">{{ task.bookTplName + '_' + task.id }}</p>
|
<p class="taskItemDesc">
|
<span class="time">{{ task.startDate }}</span>
|
<span class="state">
|
<span style="color: #909399" v-if="task.state == 0">初始化</span>
|
<span style="color: #909399" v-if="task.state == 1">处理中...</span>
|
<span style="color: #e6a23c" v-if="task.state == 2">暂停</span>
|
<span style="color: #67c23a" v-if="task.state == 3">已完成</span>
|
<span style="color: #f56c6c" v-if="task.state == 4">失败</span>
|
</span>
|
</p>
|
</div>
|
</div>
|
<div class="contentBox">
|
<p class="blockTitle">任务详情</p>
|
<div class="taskDetailBox" v-if="selectedTask">
|
<div class="baseInfo">
|
<span>
|
导出模板：<span>{{ selectedTask.bookTplName }}</span>
|
</span>
|
<span>
|
文件模板：<span>{{ selectedTask.fileTplName }}</span>
|
</span>
|
<span>
|
创建时间：<span>{{ selectedTask.startDate }}</span>
|
</span>
|
<span v-if="selectedTask.state == 3">
|
完成时间：<span>{{ selectedTask.endDate }}</span>
|
</span>
|
<span style="width: 100%">
|
文件路径：
|
<span style="width: auto">
|
{{ selectedTask.taskPath }}
|
<el-icon><Search /></el-icon>
|
</span>
|
</span>
|
</div>
|
<div class="progressInfo">
|
<p class="stepItem" v-if="selectedTask.progressInfo.createTask">
|
<span>创建任务...</span>
|
<el-icon v-if="selectedTask.progressInfo.createTask != 3"><Loading /></el-icon>
|
<el-icon v-if="selectedTask.progressInfo.createTask == 3"><CircleCheck /></el-icon>
|
</p>
|
<p class="stepItem" v-if="selectedTask.progressInfo.temporaryFolder">
|
<span>创建临时文件夹</span>
|
<el-icon v-if="selectedTask.progressInfo.temporaryFolder != 3"><Loading /></el-icon>
|
<el-icon v-if="selectedTask.progressInfo.temporaryFolder == 3"><CircleCheck /></el-icon>
|
</p>
|
<div class="bookInfoBox" v-if="selectedTask.progressInfo.handleBook.state">
|
<p class="progressItem">
|
<span>获取图书信息：</span>
|
<span style="display: inline-block; width: 170px">
|
<el-progress
|
:percentage="selectedTask.progressInfo.handleBook.progress"
|
:status="selectedTask.progressInfo.handleBook.progress < 100 ? '' : 'success'"
|
/>
|
</span>
|
<span>
|
{{ selectedTask.progressInfo.handleBook.showProgress }}
|
</span>
|
</p>
|
</div>
|
<p class="stepItem" v-if="selectedTask.progressInfo.handleExcel">
|
<span>生成Excel</span>
|
<el-icon v-if="selectedTask.progressInfo.handleExcel != 3"><Loading /></el-icon>
|
<el-icon v-if="selectedTask.progressInfo.handleExcel == 3"><CircleCheck /></el-icon>
|
</p>
|
<div class="fileInfoBox" v-if="selectedTask.progressInfo.showHandleFile">
|
<p class="stepItem">
|
<span>开始下载文件...</span>
|
</p>
|
<p
|
class="progressItem"
|
v-if="bookKey in Object.keys(selectedTask.progressInfo.handleFile)"
|
:key="bookKey"
|
>
|
<span :title="selectedTask.progressInfo.handleFile[bookKey].bookName">
|
{{
|
selectedTask.progressInfo.handleFile[bookKey].bookName +
|
(selectedTask.progressInfo.handleFile[bookKey].ISBN
|
? '（' + selectedTask.progressInfo.handleFile[bookKey].ISBN + '）'
|
: '')
|
}}
|
：
|
</span>
|
<span style="display: inline-block; width: 170px">
|
<el-progress
|
:percentage="selectedTask.progressInfo.handleFile[bookKey].progress"
|
:status="
|
selectedTask.progressInfo.handleFile[bookKey].progress < 100 ? '' : 'success'
|
"
|
/>
|
</span>
|
<span>
|
{{ selectedTask.progressInfo.handleFile[bookKey].showProgress }}
|
</span>
|
</p>
|
</div>
|
<div class="fileInfoBox" v-if="selectedTask.progressInfo.showHandleFolder">
|
<p class="stepItem">
|
<span>处理文件夹...</span>
|
</p>
|
<p class="stepItem">
|
<span :title="selectedTask.progressInfo.handleFolder[bookKey].bookName">
|
{{
|
selectedTask.progressInfo.handleFolder[bookKey].bookName +
|
(selectedTask.progressInfo.handleFolder[bookKey].ISBN
|
? '（' + selectedTask.progressInfo.handleFolder[bookKey].ISBN + '）'
|
: '')
|
}}
|
</span>
|
<el-icon v-if="selectedTask.progressInfo.handleFolder[bookKey].state != 3"
|
><Loading
|
/></el-icon>
|
<el-icon v-if="selectedTask.progressInfo.handleFolder[bookKey].state == 3"
|
><CircleCheck
|
/></el-icon>
|
</p>
|
</div>
|
<p class="stepItem" v-if="selectedTask.state == 3">
|
<span>导出成功！</span>
|
<el-icon><CircleCheck /></el-icon>
|
</p>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { ref, reactive, inject, onMounted, watch } from 'vue'
|
import { useRouter, RouterView } from 'vue-router'
|
import { ElMessage } from 'element-plus'
|
import { useExportTask } from '@/store'
|
const ExportTask = useExportTask()
|
const router = useRouter()
|
|
const selectedTaskIndex = ref(0)
|
const tasks = ref([])
|
const selectedTask = ref()
|
|
onMounted(() => {
|
updateListData()
|
})
|
|
watch(
|
() => ExportTask.updateList,
|
(newValue, oldValue) => {
|
updateListData()
|
}
|
)
|
|
watch(
|
() => ExportTask.msgData,
|
(newValue, oldValue) => {
|
console.log(newValue)
|
// if (newValue.type == 'showState') {
|
// stateInfo.value = newValue.msg
|
// } else if (newValue.type == 'notDownloadFolder') {
|
// console.log('notDownloadFolder')
|
// // 下载目录检测不存在，设置下载目录
|
// const path = window.electronAPI.openSelectFileOrFolderDialog({
|
// title: '选择下载目录',
|
// properties: ['openDirectory']
|
// })
|
// if (path && path.length > 0) {
|
// const returnData = window.electronAPI.setDownloadPath(path[0], newValue.msg)
|
// }
|
// } else {
|
// ElMessage({
|
// message: newValue.msg,
|
// type: newValue.type
|
// })
|
// }
|
}
|
)
|
|
const newTask = () => {
|
window.electronAPI.newExportTask({
|
bookInfo: [
|
{
|
id: 23627,
|
idPath: '22288\\26631\\23627',
|
storeId: 9,
|
repoId: 16,
|
typeId: 3
|
}
|
],
|
tplInfo: {
|
type: "user", // sys & user
|
key: "9102ABDCE3C5CD294E832EBDA51948FF"
|
}
|
})
|
}
|
|
const updateListData = () => {
|
// 获取导出任务列表
|
const taskListData = window.electronAPI.getExportTasks()
|
console.log(taskListData);
|
}
|
|
const handleData = (data) => {
|
// 文件信息
|
if (Object.keys(data.progressInfo.handleFile).length) {
|
let start = false
|
for (const key in data.progressInfo.handleFile) {
|
let bookFile = data.progressInfo.handleFile[key]
|
let bookInfo = data.bookInfo.filter((item) => {
|
return item.id == key
|
})
|
if (bookInfo.length) {
|
bookFile.bookName = bookInfo[0].name
|
if (bookFile.bookName) bookFile.bookName = bookFile.bookName.replace(/[/|\\]/g, '_')
|
bookFile.ISBN = bookInfo[0].ISBN
|
if (bookFile.ISBN) bookFile.ISBN = bookFile.ISBN.replace(/[/|\\]/g, '_')
|
}
|
if (bookFile.state) {
|
if (bookFile.info.total) {
|
bookFile.progress = parseInt((bookFile.info.success / bookFile.info.total) * 100)
|
} else {
|
bookFile.progress = 100
|
}
|
bookFile.showProgress = '（' + bookFile.info.success + ' / ' + bookFile.info.total + '）'
|
start = true
|
}
|
}
|
|
if (start) {
|
data.progressInfo.showHandleFile = true
|
}
|
}
|
// 处理文件夹
|
if (Object.keys(data.progressInfo.handleFolder).length) {
|
let start = false
|
for (const key in data.progressInfo.handleFolder) {
|
let folderState = data.progressInfo.handleFolder[key]
|
data.progressInfo.handleFolder[key] = {
|
state: folderState
|
}
|
let bookInfo = data.bookInfo.filter((item) => {
|
return item.id == key
|
})
|
if (bookInfo.length) {
|
data.progressInfo.handleFolder[key].bookName = bookInfo[0].name
|
data.progressInfo.handleFolder[key].ISBN = bookInfo[0].ISBN
|
}
|
if (folderState) {
|
start = true
|
}
|
}
|
if (start) {
|
data.progressInfo.showHandleFolder = true
|
}
|
}
|
// 书籍信息
|
data.progressInfo.handleBook.progress = parseInt(
|
(data.progressInfo.handleBook.info.success / data.progressInfo.handleBook.info.total) * 100
|
)
|
data.progressInfo.handleBook.showProgress =
|
'（' +
|
data.progressInfo.handleBook.info.success +
|
' / ' +
|
data.progressInfo.handleBook.info.total +
|
'）'
|
|
return data
|
}
|
</script>
|
|
<style lang="less">
|
.exportTaskBox {
|
width: 100%;
|
height: 100%;
|
display: flex;
|
.taskList {
|
width: 280px;
|
padding: 40px 20px;
|
border-right: 1px solid #e6e7e8;
|
.taskItem {
|
padding: 10px;
|
cursor: pointer;
|
.taskItemTitle {
|
color: #000;
|
font-weight: 500;
|
font-size: 14px;
|
margin-bottom: 6px;
|
}
|
.taskItemDesc {
|
color: #666;
|
font-size: 12px;
|
overflow: hidden;
|
.time {
|
float: left;
|
}
|
.state {
|
float: right;
|
}
|
}
|
&.active {
|
background: #efefef;
|
}
|
}
|
}
|
.contentBox {
|
flex: 1;
|
padding: 50px;
|
.taskDetailBox {
|
width: 100%;
|
height: 100%;
|
overflow: auto;
|
padding: 20px;
|
.baseInfo {
|
margin-bottom: 20px;
|
padding-bottom: 20px;
|
border-bottom: 1px solid #ccc;
|
span {
|
display: inline-block;
|
width: 50%;
|
color: #999;
|
margin-bottom: 5px;
|
span {
|
color: #000;
|
}
|
}
|
}
|
.progressInfo {
|
.stepItem {
|
margin-bottom: 6px;
|
span {
|
margin-right: 8px;
|
}
|
}
|
.fileInfoBox {
|
.progressItem {
|
margin-bottom: 6px;
|
}
|
}
|
.bookInfoBox {
|
.progressItem {
|
margin-bottom: 6px;
|
}
|
}
|
}
|
}
|
}
|
.blockTitle {
|
font-size: 20px;
|
font-weight: bold;
|
line-height: 32px;
|
margin-bottom: 20px;
|
}
|
}
|
</style>
|
