rt-sim-training-client/src/views/lesson/taskmanage/list.vue
2019-11-11 18:42:14 +08:00

184 lines
6.7 KiB
Vue

<template>
<div style="height: 100%; overflow-y: auto;">
<QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" style="width: 98%;margin-left:1%;margin-top:20px;" />
<create-task ref="CreateTask" @reloadTable="reloadTable" />
<div class="draft">
<el-button-group>
<el-button type="primary" @click="turnback">{{ $t('global.back') }}</el-button>
</el-button-group>
</div>
</div>
</template>
<script>
import { getTaskList, postTask, postTaskCancel } from '@/api/management/task';
import { getPublishMapListOnline } from '@/api/jmap/map';
import CreateTask from './createTask';
export default {
name: 'ManagementList',
components: {
CreateTask
},
data() {
return {
mapIdList: [],
taskList: [],
taskStatusList: [],
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '80px',
queryObject: {
status: {
type: 'select',
label: this.$t('global.status'),
config: {
data: []
}
}
}
},
queryList: {
query: this.queryFunction,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: this.$t('lesson.mapName'),
prop: 'parameter',
type: 'tag',
columnValue: (row) => { return this.$convertField(row.parameter, this.mapIdList, ['id', 'name']); },
tagType: (row) => { return ''; }
},
{
title: this.$t('lesson.creationTime'),
prop: 'createTime'
},
{
title: this.$t('global.status'),
prop: 'status',
type: 'tag',
columnValue: (row) => { return this.$convertField(row.status, this.taskStatusList, ['code', 'name']); },
tagType: (row) => { if (row.status != '03') { return 'warning'; } else { return 'success'; } }
},
{
title: this.$t('global.startTime'),
prop: 'startTime'
},
{
title: this.$t('lesson.finishTime'),
prop: 'finishTime'
},
{
title: this.$t('lesson.createResults'),
prop: 'result',
width: '400px'
},
{
type: 'button',
title: this.$t('global.operate'),
width: '250',
buttons: [
{
name: this.$t('lesson.start'),
handleClick: this.taskStart,
type: '',
showControl: (row) => { return row.status == '01'; }
},
{
name: this.$t('global.cancel'),
handleClick: this.taskCancel,
type: '',
showControl: (row) => { return row.status == '04'; }
},
{
name: this.$t('lesson.toPerform'),
handleClick: this.taskStart,
type: '',
showControl: (row) => { return row.status == '03' || row.status == '05'; }
}
]
}
],
actions: [
{ text: this.$t('global.create'), btnCode: 'employee_insert', handler: this.createTask }
]
},
currentModel: {}
};
},
created() {
this.loadInitData();
},
methods: {
loadInitData() {
this.mapIdList = [];
getPublishMapListOnline().then(response => {
this.mapIdList = response.data;
});
this.taskStatusList = [];
this.$Dictionary.taskStatus().then(list => {
this.taskStatusList = list;
list.forEach(elem => {
this.queryForm.queryObject.status.config.data.push({ value: elem.code, label: elem.name });
});
});
},
taskStart(index, node) {
this.$confirm( this.$t('tip.startOperationHint'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
postTask({ id: node.id }).then(res => {
this.$message.success(this.$t('lesson.operateSuccess'));
this.reloadTable();
}).catch(error => {
this.reloadTable();
this.$messageBox(`${this.$t('error.operationFailure')}, ${error.message}`);
});
});
},
taskCancel(index, node) {
this.$confirm( this.$t('tip.cancelsTaskHint'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
postTaskCancel(node.id).then(res => {
this.$message.success(this.$t('lesson.operateSuccess'));
this.reloadTable();
}).catch(error => {
this.reloadTable();
this.$messageBox(`${this.$t('error.operationFailure')}, ${error.message}`);
});
});
},
reloadTable() {
this.queryList.reload();
},
createTask() {
this.$refs.CreateTask.doShow();
},
turnback() {
this.$router.go(-1);
},
queryFunction(params) {
params['mapId'] = this.$route.query.mapId;
return getTaskList(params);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.draft {
width: 400px;
text-align: center;
margin: 20px auto;
}
</style>