welfare-admin/src/views/course/CourseDetail.vue
2021-11-26 16:01:51 +08:00

79 lines
2.4 KiB
Vue

<template>
<a-card :bordered="false" title="课程详情">
<a-descriptions layout="horizontal" bordered size="small" :column="1">
<a-descriptions-item label="课程编号"> {{ detailData.courseCode }} </a-descriptions-item>
<a-descriptions-item label="课程名称"> {{ detailData.courseName }} </a-descriptions-item>
<a-descriptions-item label="课程类别" v-for="(item,index) in dictCourseType" :key="index" :value="item.value"> {{ item.name }} </a-descriptions-item>
<a-descriptions-item label="课时"> {{ detailData.hour }} </a-descriptions-item>
<a-descriptions-item label="学习内容"> {{ detailData.learningContent }} </a-descriptions-item>
<a-descriptions-item label="试题数量"> {{ detailData.questionCount }} </a-descriptions-item>
<a-descriptions-item label="备注"> {{ detailData.remark }} </a-descriptions-item>
<a-descriptions-item label="课程封面图">
<div>
<img :src="detailData.coverPath">
</div>
</a-descriptions-item>
</a-descriptions>
<div class="buttonGroup">
<a-button type="primary" @click="close"> 返回 </a-button>
<a-button type="primary" @click="edit"> 编辑 </a-button>
</div>
</a-card>
</template>
<script>
import { getCourseDetails } from '@/api/course/course'
import { dictionaryDropDown } from '@/api/sys/dictionaryItem'
export default {
name: 'details',
components: {},
data() {
return {
queryParam: { id: this.$route.query.id },
detailData: {
coverPath: [],
},
dictCourseType:[]
}
},
created: function () {
let parameter = {}
getCourseDetails(Object.assign(parameter, this.queryParam)).then((res) => {
this.detailData = res.data
})
//调用词典
this.dictionaryDropDown();
},
methods: {
close() {
this.$router.push({ path: '/course/CourseList', query: {} })
},
edit(record) {
this.$router.push({ path: '/course/CourseAdd', query: { id: this.queryParam.id } })
},
//获取数据字典
dictionaryDropDown() {
this.formLoading = true
// 课程类别
dictionaryDropDown({ dictionaryCode: '0006' }).then((res) => {
this.dictCourseType = res.data
this.formLoading = false
})
},
},
}
</script>
<style>
.ant-descriptions-item-label {
width: 100px;
text-align: center;
}
.buttonGroup {
width: 100%;
height: auto;
text-align: center;
margin-top: 10px;
}
</style>