new index - + career video

src/api/webApi/career-course.js

@@ -17,6 +17,14 @@ export function list(params) {
         params: params
     })
 }
+export function listNoToken(params) {
+  return request({
+    url: '/front/sykc/listNoToken',
+    method: 'get',
+    params: params,
+    withoutToken: true
+  })
+}
 
 // 02 生涯课程详情
 export function info(params) {

src/views/index/components/index-card-career.vue

@@ -1,20 +1,63 @@
 <template>
-  <index-card title="生涯视频" more-text="更多" @more="handleMore"></index-card>
+  <index-card 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>
+  </index-card>
 </template>
 
 <script>
 import IndexCard from '@/views/index/components/index-card'
+import * as career from '@/api/webApi/career-course'
+import IndexCardContent from '@/views/index/components/index-card-content'
+import IndexImageItem from '@/views/index/components/index-image-item'
+import transferMixin from '@/components/mx-transfer-mixin'
 
 export default {
+  mixins: [transferMixin],
   name: 'index-card-career',
-  components: { IndexCard },
+  components: { IndexImageItem, IndexCardContent, IndexCard },
   data() {
     return {
-      morePath: '',
-      list: []
+      morePath: '/new-gaokao/careerVideo',
+      list: [],
+      lineSize: 6,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 12,
+        type: 0
+      }
     }
   },
+  mounted() {
+    this.getList()
+  },
   methods: {
+    getList() {
+      career.listNoToken(this.queryParams).then(res => {
+        this.list = res['rows']?.map((item, idx) => {
+          const path = '/career/plan/detail'
+          const nextParams = {
+            id: item.id,
+            aliid: item.aliid,
+            aliIdType: item.aliIdType,
+            name: item.name,
+            count: item.plays,
+            img: item.pictUrl
+          }
+          return {
+            title: item.name,
+            src: item.pictUrl,
+            path: path,
+            nextData: nextParams,
+            class: idx >= this.lineSize ? ['mt15'] : [],
+            titleClasses: ['width100', 'fx-row', 'f-666', 'pf', 'f14', 'text-ellipsis']
+          }
+        })
+      })
+    },
     async handleMore() {
       await this.loginCheck()
       this.transferTo(this.morePath)

src/views/index/components/index-image-item.vue

@@ -55,13 +55,17 @@ export default {
         left: '17px',
         opacity: 0.6
       })
+    },
+    nextData: {
+      type: Object,
+      default: null
     }
   },
   methods: {
     async handleItem() {
       await this.loginCheck()
       if (!this.path) return
-      this.transferTo(this.path)
+      this.transferTo(this.path, this.nextData)
     }
   }
 }

src/views/index/components/index-preference-simulate.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="mt20 index-block" @click="handleClick">
+  <div @click="handleClick">
     <el-image :src="require('@/assets/images/index/login/banner_preference_simulate@2x.png')" fit="contain"/>
   </div>
 </template>

src/views/index/login.vue

@@ -10,6 +10,7 @@
       <div class="fx-column fx-cen-cen">
         <index-card-subject-query class="mt20 index-block"/>
         <index-card-elective-test class="mt20 index-block"/>
+        <index-card-career class="mt20 index-block"/>
         <index-preference-simulate class="mt20 index-block"/>
         <index-preference class="mt20 index-block"/>
       </div>
@@ -44,10 +45,12 @@ import IndexCardSubjectQuery from '@/views/index/components/index-card-subject-q
 import IndexCardElectiveTest from '@/views/index/components/index-card-elective-test'
 import IndexPreferenceSimulate from '@/views/index/components/index-preference-simulate'
 import IndexPreference from '@/views/index/components/index-preference'
+import IndexCardCareer from '@/views/index/components/index-card-career'
 
 export default {
   mixins: [RouterHelpMixin, loginCheckMixin],
   components: {
+    IndexCardCareer,
     IndexPreference,
     IndexPreferenceSimulate,
     IndexCardElectiveTest,