|
@@ -1,10 +1,20 @@
|
|
<template>
|
|
<template>
|
|
<index-card simple title="生涯视频" more-text="查看全部" @more="handleMore">
|
|
<index-card simple title="生涯视频" more-text="查看全部" @more="handleMore">
|
|
- <index-card-content :list="list" :line-size="lineSize">
|
|
|
|
- <template #default="{item}">
|
|
|
|
- <index-image-item v-bind="item"></index-image-item>
|
|
|
|
- </template>
|
|
|
|
- </index-card-content>
|
|
|
|
|
|
+ <template #more-prefix>
|
|
|
|
+ <div class="fx-1 fx-row jc-end ai-cen f-333 f16">
|
|
|
|
+ <template v-for="(t,idx) in types">
|
|
|
|
+ <span :key="'t_'+idx" class="pointer" :class="{'f-primary':idx==currentIndex}" @click="currentIndex=idx">{{ t.name }}</span>
|
|
|
|
+ <el-divider :key="'d_'+idx" direction="vertical"/>
|
|
|
|
+ </template>
|
|
|
|
+ </div>
|
|
|
|
+ </template>
|
|
|
|
+ <div v-loading="loading" style="height: 418px">
|
|
|
|
+ <index-card-content :list="list" :line-size="lineSize">
|
|
|
|
+ <template #default="{item}">
|
|
|
|
+ <index-image-item v-bind="item"></index-image-item>
|
|
|
|
+ </template>
|
|
|
|
+ </index-card-content>
|
|
|
|
+ </div>
|
|
</index-card>
|
|
</index-card>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
@@ -19,10 +29,13 @@ import loginCheckMixin from '@/views/index/blocks/index-login-interceptor-mixin'
|
|
export default {
|
|
export default {
|
|
mixins: [transferMixin, loginCheckMixin],
|
|
mixins: [transferMixin, loginCheckMixin],
|
|
name: 'index-card-career',
|
|
name: 'index-card-career',
|
|
- components: { IndexImageItem, IndexCardContent, IndexCard },
|
|
|
|
|
|
+ components: {IndexImageItem, IndexCardContent, IndexCard},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
|
|
+ loading: false,
|
|
morePath: '/new-gaokao/careerVideo',
|
|
morePath: '/new-gaokao/careerVideo',
|
|
|
|
+ types: [{type: 1, name: '发现自我', list: null}, {type: 2, name: '生涯探索', list: null}],
|
|
|
|
+ currentIndex: 0,
|
|
list: [],
|
|
list: [],
|
|
lineSize: 4,
|
|
lineSize: 4,
|
|
queryParams: {
|
|
queryParams: {
|
|
@@ -32,12 +45,31 @@ export default {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
+ computed: {
|
|
|
|
+ currentType() {
|
|
|
|
+ return this.types[this.currentIndex]
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ watch: {
|
|
|
|
+ currentType: function () {
|
|
|
|
+ this.getList()
|
|
|
|
+ }
|
|
|
|
+ },
|
|
mounted() {
|
|
mounted() {
|
|
this.getList()
|
|
this.getList()
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
getList() {
|
|
getList() {
|
|
- career.listNoToken(this.queryParams).then(res => {
|
|
|
|
|
|
+ if (this.currentType.list?.length) {
|
|
|
|
+ this.list = this.currentType.list
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ this.loading = true
|
|
|
|
+ const params = {
|
|
|
|
+ ...this.queryParams,
|
|
|
|
+ type: this.currentType.type
|
|
|
|
+ }
|
|
|
|
+ career.listNoToken(params).then(res => {
|
|
this.list = res['rows']?.map((item, idx) => {
|
|
this.list = res['rows']?.map((item, idx) => {
|
|
const path = '/career/plan/detail'
|
|
const path = '/career/plan/detail'
|
|
const nextParams = {
|
|
const nextParams = {
|
|
@@ -57,7 +89,8 @@ export default {
|
|
titleClasses: ['width100', 'fx-row', 'f-666', 'pf', 'f14', 'text-ellipsis']
|
|
titleClasses: ['width100', 'fx-row', 'f-666', 'pf', 'f14', 'text-ellipsis']
|
|
}
|
|
}
|
|
})
|
|
})
|
|
- })
|
|
|
|
|
|
+ this.currentType.list = this.list
|
|
|
|
+ }).finally(() => this.loading = false)
|
|
},
|
|
},
|
|
async handleMore() {
|
|
async handleMore() {
|
|
await this.loginCheck()
|
|
await this.loginCheck()
|