91 lines
2.4 KiB
Vue
91 lines
2.4 KiB
Vue
<template>
|
|
<el-dialog
|
|
:title="this.$t('approval.courseDetails')"
|
|
:visible.sync="showDetail"
|
|
top="20px"
|
|
width="90%"
|
|
:before-do-close="doClose"
|
|
:close-on-click-modal="false"
|
|
>
|
|
<div>
|
|
<el-card v-loading="loading">
|
|
<div slot="header" style="text-align: center;">
|
|
<b>{{ $t('global.courseName') }}: {{ lessonName }}</b>
|
|
</div>
|
|
<div style="margin:50px">
|
|
<p style="font-size: 14px; margin-bottom: 20px"> {{ $t('approval.courseDescription') }}:
|
|
<span style="color: #808080 !important;">{{ lessonRemark }}</span>
|
|
</p>
|
|
</div>
|
|
</el-card>
|
|
<el-card v-loading="loading">
|
|
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: height -60 + 'px'}">
|
|
<el-table
|
|
:data="tableData"
|
|
row-key="id"
|
|
border
|
|
default-expand-all
|
|
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
|
>
|
|
<el-table-column
|
|
prop="name"
|
|
border
|
|
:label="this.$t('approval.chapterTrainingName')"
|
|
/>
|
|
<el-table-column
|
|
prop="remarks"
|
|
border
|
|
:label="this.$t('approval.instructions')"
|
|
/>
|
|
</el-table>
|
|
</el-scrollbar>
|
|
</el-card>
|
|
</div>
|
|
</el-dialog>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import {reviewLessonDetail} from '@/api/designPlatform';
|
|
|
|
export default {
|
|
name: 'LessonApprovalDetail',
|
|
components: {
|
|
|
|
},
|
|
data() {
|
|
return {
|
|
loading: false,
|
|
tableData: [],
|
|
lessonName: '',
|
|
lessonRemark: '',
|
|
showDetail: false
|
|
};
|
|
},
|
|
computed: {
|
|
height() {
|
|
return this.$store.state.app.height - 260;
|
|
}
|
|
},
|
|
methods: {
|
|
show(lessonId) {
|
|
this.showDetail = true;
|
|
this.loadInitData(lessonId);
|
|
},
|
|
loadInitData(lessonId) {
|
|
this.loading = true;
|
|
reviewLessonDetail(lessonId).then(response =>{
|
|
this.tableData = response.data[0].children;
|
|
this.lessonName = response.data[0].name;
|
|
this.lessonRemark = response.data[0].remarks;
|
|
this.loading = false;
|
|
}).catch(()=>{
|
|
this.$messageBox(this.$t('approval.failedToGetCourseData'));
|
|
});
|
|
},
|
|
doClose() {
|
|
}
|
|
}
|
|
};
|
|
</script>
|