更新任务列表等

This commit is contained in:
24kycj
2024-11-09 14:41:39 +08:00
parent 343822e81e
commit 10ec7b1ba0
9 changed files with 323 additions and 114 deletions
+172 -101
View File
@@ -16,12 +16,7 @@
<div>系统设置</div>
</div>
<div class="top_left_line"></div>
<el-switch
class="top_left_status"
v-model="workStatus"
active-color="#07C160"
inactive-color="#aaa">
</el-switch>
<el-switch class="top_left_status" v-model="workStatus" active-color="#07C160" inactive-color="#aaa"> </el-switch>
<div class="flex_box top_left_option">
<div class="top_left_text">完成拷贝数:</div>
<div class="top_left_num">9</div>
@@ -43,10 +38,10 @@
<!-- 左侧 -->
<div class="device_left">
<div class="flex_box device_left_top">
<img class="flex_shrink device_img" src="@/assets/images/device1.png" />
<img class="flex_shrink device_img" src="@/assets/images/device.png" />
<div class="flex_box flex_row_between device_info">
<div class="device_info_box">
<div class="device_info_main" :class="{'device_info_main1': infoStatus===1}">
<div class="device_info_main" :class="{ device_info_main1: infoStatus === 1 }">
<div class="device_info_item">
<div class="device_info_text">系统序列号4F524201</div>
<div class="device_info_text">主机名DGF031</div>
@@ -61,7 +56,7 @@
<img src="@/assets/images/device4.png" />
</div>
<div class="flex_box flex_row_center device_info_option_b">
<div class="device_info_option_b_text">CD 5</div>
<div class="device_info_option_b_text">CD 5</div>
<i class="el-icon-caret-bottom"></i>
</div>
</div>
@@ -70,7 +65,7 @@
<img src="@/assets/images/device4.png" />
</div>
<div class="flex_box flex_row_center device_info_option_b">
<div class="device_info_option_b_text">DVD 15</div>
<div class="device_info_option_b_text">DVD 15</div>
</div>
</div>
<div class="device_info_option">
@@ -85,30 +80,25 @@
</div>
</div>
<div class="device_info_right">
<div @click="infoStatus=0" class="device_info_right_item">
<img v-if="infoStatus===0" src="@/assets/images/Arrow_right_icon.png" />
<img v-if="infoStatus===1" src="@/assets/images/Arrow_right1_icon.png" />
<div @click="infoStatus = 0" class="device_info_right_item">
<img v-if="infoStatus === 0" src="@/assets/images/Arrow_right_icon.png" />
<img v-if="infoStatus === 1" src="@/assets/images/Arrow_right1_icon.png" />
</div>
<div @click="infoStatus=1" class="device_info_right_item">
<img v-if="infoStatus===1" src="@/assets/images/Arrow_left_icon.png" />
<img v-if="infoStatus===0" src="@/assets/images/Arrow_left1_icon.png" />
<div @click="infoStatus = 1" class="device_info_right_item">
<img v-if="infoStatus === 1" src="@/assets/images/Arrow_left_icon.png" />
<img v-if="infoStatus === 0" src="@/assets/images/Arrow_left1_icon.png" />
</div>
</div>
</div>
</div>
<div class="flex_box device_status">
<div class="device_status_dot"></div>
<div class="device_status_text">{{runText}}</div>
<div class="device_status_text">{{ runText }}</div>
</div>
<div class="flex_box device_run">
<div class="flex_box device_run_input">
<el-select v-model="runVal" placeholder="请选择">
<el-option
v-for="item in runList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
<el-option v-for="item in runList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
</el-select>
</div>
<el-button @click="handleRun" type="primary" class="device_run_btn">执行</el-button>
@@ -132,7 +122,7 @@
<div class="device_right_top_content">
<div class="device_right_top_title">21032200009(H)(底部)</div>
<div class="flex_box device_right_top_progress">
<div class="device_right_top_progress_box" :style="{width: progressW+'%'}"></div>
<div class="device_right_top_progress_box" :style="{ width: progressW + '%' }"></div>
</div>
<div class="device_right_top_text">15GB可用共60GB</div>
<div class="device_right_top_text">状态插入光盘中</div>
@@ -154,7 +144,10 @@
</div>
<div class="notice_list">
<div v-for="(item, index) in noticeList" :key="index" class="flex_box flex_row_between notice_item">
<div class="notice_content"><span>{{ index+1 }}</span>{{ item.message }}</div>
<div class="notice_content">
<span>{{ index + 1 }}</span
>{{ item.message }}
</div>
<div class="notice_time">{{ item.createtime }}</div>
</div>
</div>
@@ -162,38 +155,79 @@
</div>
</div>
<!-- 作业队列 -->
<div class="work_box">
<div class="work_box">
<div class="flex_box work_top">
<div class="work_top_text">作业列表</div>
</div>
<el-table max-height="250" class="work_table" :data="workList" empty-text="暂无作业列表">
<el-table-column type="index" width="50" label="序号"></el-table-column>
<el-table-column prop="task_uuid" label="作业ID"></el-table-column>
<el-table-column prop="username" label="用户"></el-table-column>
<el-table-column prop="DataSource" label="来源"></el-table-column>
<el-table-column prop="PrinterType" label="类型">
<el-table max-height="250" class="work_table" :data="taskList" empty-text="暂无作业列表">
<el-table-column type="expand">
<template slot-scope="scope">
<div class="work_status_box">
<div>{{typeList[scope.row.PrinterType]}}</div>
</div>
<el-table max-height="250" :data="scope.row.ass_task">
<el-table-column width="50" label=""></el-table-column>
<el-table-column type="index" width="80" label="序号">
<template slot-scope="child">
<div>{{ scope.$index+1 }}_{{ child.$index+1 }}</div>
</template>
</el-table-column>
<el-table-column prop="task_label" label="子任务名称"></el-table-column>
<el-table-column prop="task_size" label="大小">
<template slot-scope="child">
<div>{{ filterSize(child.row.task_size) }}</div>
</template>
</el-table-column>
<el-table-column prop="start_time" label="开始时间"></el-table-column>
<el-table-column prop="finish_time" label="结束时间"></el-table-column>
<el-table-column label="进度">
<template slot-scope="child">
<div class="work_progress">
<el-progress :text-inside="true" :percentage="child.row.copy_scheduler" status="success"></el-progress>
</div>
</template>
</el-table-column>
<el-table-column prop="task_status" label="状态">
<template slot-scope="child">
<div class="flex_box work_status_box">
<div>{{ statusList[child.row.task_status] }}</div>
<!-- <i class="el-icon-caret-bottom"></i> -->
</div>
</template>
</el-table-column>
</el-table>
</template>
</el-table-column>
<el-table-column type="index" width="80" label="序号"></el-table-column>
<el-table-column prop="task_uuid" label="作业ID"></el-table-column>
<el-table-column prop="task_name" label="任务名称"></el-table-column>
<!-- <el-table-column prop="DataSource" label="来源"></el-table-column> -->
<el-table-column label="类型">
<template slot-scope="scope">
<div>{{ typeList[scope.row.ass_task[0].cd_type] }}</div>
</template>
</el-table-column>
<el-table-column prop="task_size" label="大小">
<template slot-scope="scope">
<div>{{ filterSize(scope.row.task_size) }}</div>
</template>
</el-table-column>
<el-table-column prop="TaskCapacity" label="大小"></el-table-column>
<!-- <el-table-column prop="CreateTime" label="开始时间"></el-table-column> -->
<!-- <el-table-column prop="FinishTime" label="结束时间"></el-table-column> -->
<el-table-column prop="JobCompletion" label="完成"></el-table-column>
<el-table-column label="完成">
<template slot-scope="scope">
<div>{{ scope.row.finish_freq }}/{{ scope.row.total_freq }}</div>
</template>
</el-table-column>
<el-table-column prop="task_status" label="状态">
<template slot-scope="scope">
<div class="flex_box work_status_box">
<div>{{statusList[scope.row.task_status]}}</div>
<div>{{ statusList[scope.row.task_status] }}</div>
<!-- <i class="el-icon-caret-bottom"></i> -->
</div>
</template>
</el-table-column>
</el-table>
</div>
<!-- 底部 -->
<div class="flex_box flex_row_center footer_box">
</div>
<!-- 底部 -->
<div class="flex_box flex_row_center footer_box">
<div>Copyright @ 2023 CARDSOON Corporation</div>
<div class="footer_line"></div>
<div class="footer_text">帮助</div>
@@ -209,8 +243,9 @@
<script>
let that
import { mapGetters } from 'vuex'
import UserInfo from '@/components/userInfo/userInfo.vue';
import WorkAdd from '@/components/workAdd/workAdd.vue';
import { accAdd, filterSize } from '@/utils'
import UserInfo from '@/components/userInfo/userInfo.vue'
import WorkAdd from '@/components/workAdd/workAdd.vue'
export default {
name: 'dashboard',
@@ -226,28 +261,28 @@ export default {
runList: [
{
value: 1,
label: '重启设备',
label: '重启设备'
},
{
value: 2,
label: '清除错误',
label: '清除错误'
},
{
value: 3,
label: '校准光盘桶',
label: '校准光盘桶'
},
{
value: 4,
label: '校准打印机',
label: '校准打印机'
},
{
value: 5,
label: '自动设置刻录机',
label: '自动设置刻录机'
},
{
value: 6,
label: '设置左右盘仓',
},
label: '设置左右盘仓'
}
],
// 剩余容量
progressW: 75,
@@ -262,7 +297,7 @@ export default {
id: 2,
message: '[2024-11-07 17:53:13][文件刻录 20241107175313][开始执行文件刻录任务]',
createtime: '2024 10-13'
},
}
// {
// id: 3,
// message: '[2024-11-07 17:52:28][文件刻录 20241107175228][接收到任务]',
@@ -270,19 +305,39 @@ export default {
// },
],
// 作业列表
workList: [],
typeList: ['', '文件刻录', '光盘拷贝', '定期归档', '光盘读取'],
statusList: ['', '新建', '等待中', '文件准备中', '正在刻录', '正在打印', '已失败', '已取消', '已完成'],
taskList: [],
typeList: ['', 'CD', 'DVD', 'DVD_DL', 'BD', 'BD_DL', 'BD_TL', 'BD_QL'],
statusList: {
'0': '新建',
'1': '等待中',
'2': '文件准备中',
'3': '正在刻录',
'4': '正在打印',
'5': '已失败',
'6': '已取消',
'7': '已完成'
},
}
},
watch: {
'$store.state.chat.taskList': {
handler(val) {
if (val && val.length) {
let list = []
val.forEach((item) => {
let task_size = 0
item.ass_task.forEach((item2) => {
task_size = accAdd(task_size, item2.task_size)
})
item.task_size = task_size
list.push(item)
})
this.taskList = list
}
},
deep: true,
immediate: true
}
},
watch: {
'$store.state.chat.taskItem': {
handler(val) {
this.workList.push(val)
},
deep: true,
immediate: true
}
},
computed: {
...mapGetters(['name', 'roles'])
@@ -293,7 +348,7 @@ export default {
methods: {
// 执行
handleRun() {
const index = that.runList.findIndex(item => item.value == that.runVal)
const index = that.runList.findIndex((item) => item.value == that.runVal)
that.$message({
message: that.runList[index].label,
type: 'success'
@@ -303,10 +358,13 @@ export default {
showWork() {
that.$refs.workAdd.show()
},
filterSize(size) {
return filterSize(size)
},
// 退出登录
goOut() {
this.$store.dispatch('FedLogOut').then(() => {
location.reload()// In order to re-instantiate the vue-router object to avoid bugs
location.reload()
})
}
}
@@ -325,12 +383,12 @@ export default {
cursor: pointer;
padding: 0 16px;
height: 30px;
background: #00C325;
background: #00c325;
border-radius: 6px;
margin-right: 16px;
font-weight: 500;
font-size: 15px;
color: #FFFFFF;
color: #ffffff;
img {
width: 18px;
height: 18px;
@@ -341,13 +399,13 @@ export default {
cursor: pointer;
padding: 0 16px;
height: 30px;
background: rgba(0,195,37,0.12);
border: 2px solid rgba(0,195,37,0.32);
background: rgba(0, 195, 37, 0.12);
border: 2px solid rgba(0, 195, 37, 0.32);
border-radius: 6px;
margin-right: 16px;
font-weight: 500;
font-size: 15px;
color: #00C325;
color: #00c325;
img {
width: 18px;
height: 18px;
@@ -357,7 +415,7 @@ export default {
.top_left_line {
width: 2px;
height: 30px;
background: #E0E0E0;
background: #e0e0e0;
margin: 0 16px;
}
.top_left_status {
@@ -375,23 +433,23 @@ export default {
.top_left_num {
padding: 0 10px;
height: 28px;
background: #00C325;
background: #00c325;
border-radius: 6px;
font-weight: 500;
font-size: 15px;
color: #FFFFFF;
color: #ffffff;
line-height: 28px;
margin-left: 12px;
}
.top_left_num1 {
background: #B8B8B8;
background: #b8b8b8;
}
}
}
}
.device_box {
padding: 16px;
background-color: #F8F8F8;
background-color: #f8f8f8;
.device_left {
width: 50%;
padding: 0 45px;
@@ -485,7 +543,7 @@ export default {
}
.device_status {
height: 44px;
background: #FFFFFF;
background: #ffffff;
border-radius: 4px;
margin-bottom: 24px;
padding: 0 18px;
@@ -493,13 +551,13 @@ export default {
width: 22px;
height: 22px;
border-radius: 50%;
background: #E54D4D;
background: #e54d4d;
margin-right: 18px;
}
.device_status_text {
font-weight: 500;
font-size: 19px;
color: #E54D4D;
color: #e54d4d;
line-height: 30px;
}
}
@@ -507,13 +565,13 @@ export default {
width: 100%;
height: 44px;
overflow: hidden;
background: #FFFFFF;
box-shadow: 0px 5 9px 2px rgba(102,102,102,0.18);
background: #ffffff;
box-shadow: 0px 5 9px 2px rgba(102, 102, 102, 0.18);
border-radius: 6px;
.device_run_input {
width: calc(100% - 140px);
height: 44px;
border: 2px solid #00BCC3;
border: 2px solid #00bcc3;
overflow: hidden;
border-radius: 6px 0 0 6px;
.el-select {
@@ -542,12 +600,12 @@ export default {
.device_run_btn {
width: 140px;
height: 44px;
background: #00BCC3;
background: #00bcc3;
border-radius: 0px 6px 6px 0px;
font-weight: 500;
font-size: 19px;
margin: 0;
color: #FFFFFF;
color: #ffffff;
}
}
}
@@ -555,7 +613,7 @@ export default {
width: 50%;
.device_right_top {
height: 200px;
background: #FFFFFF;
background: #ffffff;
border-radius: 4px;
margin-bottom: 18px;
padding: 0 24px;
@@ -581,14 +639,14 @@ export default {
}
.device_right_top_progress {
height: 18px;
background: #FFFFFF;
background: #ffffff;
border-radius: 3px;
border: 2px solid #707070;
margin: 2px 0 2px;
.device_right_top_progress_box {
width: 0;
height: 15px;
background: #00C325;
background: #00c325;
transition: all 0.5s;
}
}
@@ -597,17 +655,17 @@ export default {
.device_right_top_line {
width: 2px;
height: 150px;
background: #E1F5E5;
background: #e1f5e5;
margin: 0 24px;
}
}
.notice_box {
background: #FFFFFF;
background: #ffffff;
border-radius: 6px;
.notice_top {
height: 75px;
padding: 0 30px;
border-bottom: 2px solid #E1F5E5;
border-bottom: 2px solid #e1f5e5;
.notice_title {
font-weight: 500;
font-size: 19px;
@@ -621,7 +679,7 @@ export default {
.notice_all {
font-weight: 500;
font-size: 19px;
color: #00C325;
color: #00c325;
cursor: pointer;
img {
width: 28px;
@@ -652,14 +710,14 @@ export default {
}
.notice_item {
height: 42px;
background-color: #F8F8F8;
background-color: #f8f8f8;
margin-bottom: 3px;
cursor: pointer;
&:hover {
background-color: #FFE6E6;
background-color: #ffe6e6;
.notice_content,
.notice_time {
color: #FF0000;
color: #ff0000;
}
}
.notice_content {
@@ -692,26 +750,26 @@ export default {
.work_top_text {
width: 132px;
height: 72px;
background: linear-gradient( 180deg, #C1FFCD 0%, #FFFFFF 100%);
background: linear-gradient(180deg, #c1ffcd 0%, #ffffff 100%);
font-weight: bold;
font-size: 19px;
color: #00C325;
color: #00c325;
line-height: 72px;
text-align: center;
}
}
.work_table {
background-color: #F8F8F8;
background-color: #f8f8f8;
::v-deep {
tr {
background-color: #F8F8F8;
background-color: #f8f8f8;
}
td.el-table__cell {
background-color: #F8F8F8;
background-color: #f8f8f8;
border-bottom: 3px solid #ffffff;
}
th.el-table__cell {
background-color: #F2F9F4;
background-color: #f2f9f4;
border-bottom: 3px solid #ffffff;
}
.el-table__cell {
@@ -723,6 +781,19 @@ export default {
color: #000000;
}
}
.work_progress {
width: 80%;
::v-deep {
.el-progress-bar__outer {
height: 16px!important;
line-height: 16px!important;
.el-progress-bar__innerText {
font-size: 12px!important;
color: #fff!important;
}
}
}
}
.work_status_box {
font-weight: 500;
font-size: 14px;
@@ -733,7 +804,7 @@ export default {
}
.footer_box {
height: 36px;
background: #DCF5E1;
background: #dcf5e1;
font-weight: 500;
font-size: 14px;
color: #666666;
@@ -746,7 +817,7 @@ export default {
.footer_text {
cursor: pointer;
&:hover {
color: #00C325;
color: #00c325;
}
}
}