feat: 接口对接

This commit is contained in:
cgd_mac 2022-02-23 14:34:04 +08:00
parent e8cba8fceb
commit 255e4d9433
7 changed files with 201 additions and 41 deletions

View File

@ -0,0 +1,153 @@
<template>
<div class="CourseCatalogue-box">
<ul class="list-box">
<li class="list-item" v-for="(item, index) in catalogueList" :key="index">
<div class="list-item-title">
<span style="margin-right: 10px;">{{ capitalizeNumber[index] }}</span>
{{ item.name }}
</div>
<ul class="sub-list">
<li
@click="handlerItem(j, item)"
class="sub-list-item"
v-for="(j, k) in item.courseList"
:key="`${index}-${k}`"
>
<div
:class="[
'sub-item-info',
{ 'sub-item-info-success': j.status === 1 }
]"
>
<VideoOne
theme="filled"
:fill="j.status === 1 ? '#26bd71' : '#ccc'"
style="margin-right: 6px;"
size="1.2em"
></VideoOne>
{{ index + 1 }}.{{ k + 1 }}
{{ j.name }}
</div>
<!-- 0-未学 1-已学 -->
<div v-if="j.status === 1" class="sub-item-status">
<span style="color: #26bd71;">已学习</span>
<History
theme="filled"
tyle="margin-left: 10px;"
size="1.2em"
style="margin-left: 10px;"
fill="#26bd71"
></History>
</div>
<!-- <div v-else class="sub-item-status">
<Round
theme="filled"
strokeWidth="6"
:fill="j.status === 1 ? '#26bd71' : '#666'"
style="margin-left: 10px;"
></Round>
</div> -->
</li>
</ul>
</li>
</ul>
</div>
</template>
<script>
import { VideoOne, Round, History } from '@icon-park/vue'
export default {
components: { VideoOne, Round, History },
props: {
catalogueList: {
type: Array,
default: () => []
}
},
data () {
return {
capitalizeNumber: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一'],
data: []
}
},
mounted () {},
methods: {
handlerItem (item, pItem) {
this.$emit('changeVideo', { item, pItem })
}
}
}
</script>
<style lang="less" scoped>
.learn-detail {
display: flex;
}
.learn-detail-video {
flex: 1;
}
.learn-detail-list {
flex: 220px;
}
.list-box,
.sub-list {
margin: 0;
padding: 0;
}
.list-item-title {
color: 16px;
font-weight: bold;
color: #333;
padding: 10px 0;
}
.sub-list-item {
color: #666;
padding-bottom: 10px;
&:hover {
color: #1890ff;
}
}
.sub-list {
padding-left: 20px;
}
.sub-list-item {
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
.sub-item-info {
flex: 1;
display: flex;
line-height: 2;
}
.sub-item-info-active {
color: #1890ff !important;
}
.sub-item-info-success {
color: #26bd71;
}
.sub-item-status {
flex: 0 0 200px;
font-size: 12px;
text-align: right;
color: #1890ff;
display: flex;
align-items: center;
justify-content: flex-end;
}
}
.list-item {
width: 100%;
}
</style>

View File

@ -23,12 +23,17 @@
<span class="label">学习状态</span> <span class="label">学习状态</span>
<span class="value">{{ data.status }}</span> <span class="value">{{ data.status }}</span>
</a-col> </a-col>
<a-col>
<CourseCatalogue :catalogueList="data.details"></CourseCatalogue>
</a-col>
</a-row> </a-row>
</div> </div>
</template> </template>
<script> <script>
import CourseCatalogue from './CourseCatalogue.vue'
export default { export default {
components: {CourseCatalogue},
props: { props: {
data: { data: {
type: Object, type: Object,

View File

@ -110,7 +110,7 @@ export default {
if (selected) { if (selected) {
this.curVideo = selected this.curVideo = selected
this.playerOptions = { this.playerOptions = {
height: '360', height: '500',
autoplay: false, autoplay: false,
muted: false, muted: false,
language: 'zh-CN', language: 'zh-CN',

View File

@ -1,13 +0,0 @@
<template>
</template>
<script>
export default {
}
</script>
<style>
</style>

View File

@ -161,7 +161,7 @@ export default {
}, },
// //
handleRefresh () { handleRefresh () {
this.$refs.table.refresh()
}, },
handleOk () { handleOk () {
this.$refs.table.refresh() this.$refs.table.refresh()

View File

@ -13,7 +13,7 @@
"></SearchCom> "></SearchCom>
</div> </div>
</br> </br>
<a-tabs :default-active-key="activeTab"> <a-tabs :default-active-key="activeTab" @change="(key)=>{activeTab = key}">
<a-tab-pane key="1" tab="预约考试"> <a-tab-pane key="1" tab="预约考试">
<s-table <s-table
ref="examTable" ref="examTable"
@ -79,6 +79,8 @@
<script> <script>
import { STable, SearchCom } from '@/components' import { STable, SearchCom } from '@/components'
import { reqExamList, reqExamAttendList, reqExamSubscribe } from '@/api/myexam/exam' import { reqExamList, reqExamAttendList, reqExamSubscribe } from '@/api/myexam/exam'
import { dictionaryDropDown } from '@/api/sys/dictionaryItem'
import { dictToTree } from '@/utils/util'
export default { export default {
components: { STable, SearchCom }, components: { STable, SearchCom },
@ -87,10 +89,10 @@ export default {
loading: false, loading: false,
activeTab: '1', activeTab: '1',
queryParam: { queryParam: {
examType: '' // examClassify: '' //
}, },
queryOptions: [ queryOptions: [
{ type: 'select-dic-tree', placeholder: '考试分类', key: 'examType', options: [] } { type: 'select-dic-tree', placeholder: '课程分类', key: 'examClassify', options: [] }
], ],
examColumns: [ examColumns: [
{ {
@ -186,15 +188,24 @@ export default {
} }
}, },
mounted () { mounted () {
this.dictionaryDropDown()
}, },
methods: { methods: {
dictionaryDropDown () {
dictionaryDropDown({ dictionaryCode: '0006' }).then((res) => {
const result = dictToTree(res.data, [], 0)
this.queryOptions[0].options = result
this.loading = false
})
},
// //
handleRefresh () { handleRefresh () {
const { activeTab } = this const { activeTab } = this
console.log('activeTab', activeTab)
if (activeTab === '1') { if (activeTab === '1') {
this.$refs.examTable.refresh() this.$refs.examTable.refresh()
} else { } else {
this.$refs.examDoneColumns.refresh() this.$refs.examDoneTable.refresh()
} }
}, },
// //

View File

@ -22,6 +22,7 @@
</div> </div>
</div> </div>
</br> </br>
<template v-if="dataList && dataList.length>0">
<a-card v-for="(item, index) in dataList" :key="index" :bordered="false" :bodyStyle="{paddingLeft: '0px !important'}" :headStyle="{paddingLeft: '0px !important'}" > <a-card v-for="(item, index) in dataList" :key="index" :bordered="false" :bodyStyle="{paddingLeft: '0px !important'}" :headStyle="{paddingLeft: '0px !important'}" >
<template slot="title"> <template slot="title">
<b>{{ item.title }}</b><span class="sub-txt">{{ item.questionCount }}</span> <b>{{ item.title }}</b><span class="sub-txt">{{ item.questionCount }}</span>
@ -44,6 +45,9 @@
</a-col> </a-col>
</a-row> </a-row>
</a-card> </a-card>
</template>
<a-empty v-else />
</a-card> </a-card>
</template> </template>