rt-sim-training-client/src/views/lesson/home.vue
joylink_cuiweidong ad97697406 接口调整
2019-10-31 15:56:07 +08:00

255 lines
10 KiB
Vue

<template>
<div style="height: 100%; overflow-y: auto;">
<el-card>
<div class="button_group">
<el-button v-if="hasRelease" size="mini" @click="operationManage">{{ $t('lesson.trainingRule') }}</el-button>
<el-button v-if="hasRelease" size="mini" @click="trainingManage">{{ $t('lesson.trainingManage') }}</el-button>
<el-button v-if="hasRelease" size="mini" @click="taskManage">{{ $t('lesson.taskManage') }}</el-button>
<el-button size="mini" type="primary" @click="lessonCreateByPublish">{{ $t('lesson.createNewCoursesFromRelease') }}</el-button>
<el-button size="mini" type="primary" @click="lessonCreate">{{ $t('lesson.newConstruction') }}</el-button>
</div>
</el-card>
<el-card v-loading="loading">
<QueryListPage ref="queryListPage" :query-form="queryForm" :pager-config="pagerConfig" :query-list="queryList" />
</el-card>
<publish-create ref="publishCreate" @refresh="refresh" />
<publish-lesson ref="publishLesson" @refresh="refresh" />
<lesson-detail ref="lessonDetail" />
</div>
</template>
<script>
import { releaseOrCancel } from '@/api/designPlatform';
import { getLessonDrftList } from '@/api/jmap/lessondraft';
import { UrlConfig } from '@/router/index';
import PublishCreate from './lessoncategory/edit/create';
import PublishLesson from './lessoncategory/edit/lesson/publish';
import { delLesson } from '@/api/jmap/lessondraft';
import LessonDetail from '@/views/approval/lesson/detail';
import ConstConfig from '@/scripts/ConstConfig';
export default {
name: 'LessonHome',
components: {
PublishCreate,
PublishLesson,
LessonDetail
},
data() {
return {
loading: false,
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
show: false
},
queryList: {
query: this.queryFunction,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: this.$t('lesson.courseName'),
prop: 'name'
},
{
title: this.$t('lesson.courseDescription'),
prop: 'remarks'
},
{
title: this.$t('global.status'),
prop: 'status',
type: 'tag',
columnValue: (row) => {
return this.$convertField(row.status, ConstConfig.ConstSelect.releaseReview, ['value', 'label']);
},
tagType: (row) => { return 'success'; }
},
{
title: this.$t('lesson.explanation'),
prop: 'explanation'
},
{
type: 'button',
title: this.$t('global.operate'),
width: '400',
buttons: [
{
name: this.$t('lesson.courseDetails'),
handleClick: this.goDetail,
type: 'primary',
showControl: (row) => {
return row.status !== '1';
}
},
{
name: this.$t('lesson.contentSorting'),
handleClick: this.treeSort,
type: 'primary',
showControl: (row) => {
return row.status !== '1';
}
},
{
name: this.$t('global.release'),
handleClick: this.publish,
type: 'primary',
showControl: (row) => {
return row.status === '0' && this.hasRelease;
}
},
{
name: this.$t('lesson.applicationForRelease'),
handleClick: this.publish,
type: 'primary',
showControl: (row) => {
return row.status === '0' && !this.hasRelease;
}
},
{
name: this.$t('lesson.review'),
handleClick: this.review,
type: 'primary',
showControl: (row) => {
return row.status === '1';
}
},
{
name: this.$t('global.delete'),
handleClick: this.deleteLesson,
type: 'danger',
showControl: (row) => {
return row.status !== '1';
}
},
{
name: this.$t('lesson.withdraw'),
handleClick: this.revertLesson,
type: 'danger',
showControl: (row) => {
return row.status === '1';
}
}
]
}
]
}
};
},
computed: {
mapId() {
return this.$route.params.mapId;
},
hasRelease() {
return this.$store.state.user.roles.includes('04') ||
this.$store.state.user.roles.includes('05');
}
},
watch: {
$route() {
this.refresh();
}
},
mounted() {
},
methods: {
queryFunction(params) {
return getLessonDrftList(this.$route.params.mapId, params);
},
handlerStatus(row) {
let lessonStatus = '';
switch (row.status) {
case '0':
lessonStatus = this.$t('lesson.notRelease');
break;
case '1':
lessonStatus = this.$t('lesson.pendingReview');
break;
case '2':
lessonStatus = this.$t('lesson.published');
break;
case '3':
lessonStatus = this.$t('lesson.rejected');
break;
}
return lessonStatus;
},
refresh() {
this.$refs.queryListPage.refresh(true);
},
lessonCreate() {
this.$router.push({ path: `${UrlConfig.design.lessonEdit}/lessonCreate`, query: {skinCode: this.$route.params.skinCode, mapId: this.$route.params.mapId, cityCode: this.$route.query.cityCode} });
},
lessonCreateByPublish() {
this.$nextTick(() => {
this.$refs.publishCreate.doShow();
});
},
publish(index, row) {
row.skinCode = this.$route.params.skinCode;
row.cityCode = this.$route.query.cityCode;
this.$refs.publishLesson.doShow(row);
},
deleteLesson(index, row) {
delLesson(row).then(response => {
this.$message.success(this.$t('tip.successfullyDelete'));
this.loading = true;
this.refresh();
this.loading = false;
}).catch(() => {
this.$messageBox(this.$t('tip.failDelete'));
});
},
treeSort(index, row) {
this.$router.push({path: `${UrlConfig.design.lessonEdit}/treeSort`, query: {id: row.id}});
},
taskManage() {
this.$router.push({path: `${UrlConfig.design.taskManage}`, query: {mapId: this.$route.params.mapId}});
},
trainingManage() {
this.$router.push({path: `${UrlConfig.design.trainingManage}`, query: {mapId: this.$route.params.mapId}});
},
operationManage() {
this.$router.push({path: `${UrlConfig.design.trainingRule}`, query: {mapId: this.$route.params.mapId}});
},
revertLesson(index, row) {
this.$confirm(this.$t('tip.cancelCoursePublicationHint'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
releaseOrCancel(row.id, '0').then(response => {
this.loading = false;
this.$message.success(this.$t('tip.cancelTheSuccessfulApplicationOfTheCourseRelease'));
this.refresh();
}).catch(() => {
this.loading = false;
this.$messageBox(this.$t('tip.cancellationOfCoursePublicationApplicationFailed'));
this.refresh();
});
});
},
review(index, row) {
this.$refs.lessonDetail.show(row.id);
},
goDetail(index, row) {
this.$router.push({path: `/design/lesson/details`, query: {lessonId: row.id, skinCode: this.$route.params.skinCode, cityCode: this.$route.query.cityCode, mapId: this.$route.params.mapId}});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.draft {
width: 400px;
text-align: center;
margin: 20px auto;
}
.button_group {
float: right;
margin: 20px 10px;
}
</style>