index block - question center main

src/views/career/zhiyuan/cards/index-card-voluntary-f6.vue

@@ -55,7 +55,7 @@ export default {
           ...commonStyle,
           title: '高考政策',
           src: require('@/assets/images/index/voluntary/voluntary-policy.png'),
-          path: '/fuzhu/newGaokaoNews'
+          path: {name: 'NewsAll'}
         },
         {
           ...commonStyle,

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

@@ -2,7 +2,9 @@
   <index-card title="智能练习">
     <index-card-content :list="list" :line-size="2">
       <template #default="{item}">
-        <index-image-item v-bind="item"/>
+        <index-image-item class="active-pointer" v-bind="item">
+          <div slot="title" class="reverse-item">进入练习</div>
+        </index-image-item>
       </template>
     </index-card-content>
   </index-card>
@@ -15,27 +17,42 @@ import IndexImageItem from '@/views/index/components/index-image-item'
 
 export default {
   name: 'index-card-smart',
-  components: { IndexImageItem, IndexCardContent, IndexCard },
+  components: {IndexImageItem, IndexCardContent, IndexCard},
   data() {
     return {
       list: [{
         title: '同步练习',
-        src: `${this.$imgBase}index/question-center/tongbuzaixian.png`,
-        path: '/question-center/smartExercise?tabActive=0'
-      },
-        {
-          title: '知识点练习',
-          src: `${this.$imgBase}index/question-center/zhishidianzaixian.png`,
-          path: '/question-center/smartExercise?tabActive=1'
-
-        }]
+        src: require('@/assets/images/index/qc/qc-sync.png'),
+        path: '/question-center/smartExercise?tabActive=0',
+        titleClasses: 'abs f-333',
+        titleStyle: {bottom: '60px', left: '65px'}
+      }, {
+        title: '知识点练习',
+        src: require('@/assets/images/index/qc/qc-knowledge.png'),
+        path: '/question-center/smartExercise?tabActive=1',
+        titleClasses: 'abs f-333',
+        titleStyle: {bottom: '60px', left: '65px'}
+      }]
     }
   },
-  methods: {
-  }
+  methods: {}
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+.active-pointer .reverse-item {
+  font-size: 16px;
+  font-weight: bold;
+  line-height: 34px;
+  padding: 0 12px;
+  color: var(--themeColor);
+  background: transparent;
+  border: 1px solid var(--themeColor);
+  border-radius: 5px;
+}
 
+.active-pointer:hover .reverse-item {
+  color: white;
+  background: var(--themeColor);
+}
 </style>

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

@@ -42,7 +42,7 @@ export default {
     },
     morePath: {
       type: String | Object,
-      default: '/fuzhu/newGaokaoNews'
+      default: () => ({name: 'NewsAll'})
     },
     simple: {
       type: Boolean,

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

@@ -35,8 +35,8 @@ export default {
 }
 
 ::v-deep .el-card__header {
-  min-height: 60px;
-  padding: 30px 12px 5px 12px;
+  min-height: 50px;
+  padding: 20px 12px 5px 12px;
 }
 
 .index-card-more {

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

@@ -2,10 +2,10 @@
   <div :class="classes" :style="wrapStyle" @click="handleItem">
     <el-image :src="src" fit="contain" :class="imgClasses" :style="imgStyle"/>
     <div :class="titleClasses" :style="titleStyle">
-      {{ title }}
+      <slot name="title">{{ title }}</slot>
     </div>
     <div :class="descClasses" :style="descStyle">
-      {{ desc }}
+      <slot name="desc">{{ desc }}</slot>
     </div>
   </div>
 </template>

src/views/questioncenter/main.vue

@@ -1,12 +1,10 @@
 <template>
   <!-- 题库中心首页 -->
   <div class="app-back">
-    <div class="banner">
-      <el-image style="width: 100vw" :src="`${$imgBase}index/banner/question-banner.png`" fit="cover"></el-image>
-    </div>
+    <div class="index-banner" :style="bannerStyle" />
     <div class="fx-column fx-cen-cen pb20">
-      <index-card-smart class="mt20 index-block"></index-card-smart>
-      <index-card title="精品试卷" class="mt20 index-block" more-text="更多" @more="more('/question-center/bestPaper')">
+      <index-card-smart class="mt20 index-block" />
+      <index-card title="精品试卷" class="mt20 index-block" more-text="查看全部" @more="more('/question-center/bestPaper')">
         <el-tabs type="card">
           <el-tab-pane label="名校试卷">
             <el-row :gutter="20">
@@ -26,29 +24,6 @@
           </el-tab-pane>
         </el-tabs>
       </index-card>
-      <!--<index-card-generating class="mt20 index-block"></index-card-generating>-->
-      <!--<index-card title="视频课程" class="mt20 index-block" more-text="更多" @more="more('/question-center/video_course')">-->
-        <!--<el-tabs type="card">-->
-          <!--<el-tab-pane label="同步课程">-->
-            <!--<el-row :gutter="20">-->
-              <!--<el-col :span="6" class="video_item" v-for="item in tbvideoList">-->
-                <!--<img :src="item.img"-->
-                     <!--@click=" toVideoDetail(item.pack_id,item.chapter_id,item.id, item.section_aliId,item.aliIdType)"/>-->
-                <!--<p class="text-center text-ellipsis f-999">{{ item.section_name }}</p>-->
-              <!--</el-col>-->
-            <!--</el-row>-->
-          <!--</el-tab-pane>-->
-          <!--<el-tab-pane v-if="specialSupport" :label="specialName">-->
-            <!--<el-row :gutter="20">-->
-              <!--<el-col :span="6" class="video_item" v-for="item in gkVideoList">-->
-                <!--<img :src="item.img"-->
-                     <!--@click=" toVideoDetail(item.pack_id,item.chapter_id,item.id, item.section_aliId,item.aliIdType)"/>-->
-                <!--<p class="text-center text-ellipsis f-999">{{ item.section_name }}</p>-->
-              <!--</el-col>-->
-            <!--</el-row>-->
-          <!--</el-tab-pane>-->
-        <!--</el-tabs>-->
-      <!--</index-card>-->
     </div>
   </div>
 </template>
@@ -64,6 +39,10 @@ export default {
   components: { IndexCard, IndexCardGenerating, IndexCardSmart },
   data() {
     return {
+      bannerStyle: {
+        backgroundImage: `url(${require('@/assets/images/index/banner/question-center-banner.png')})`,
+        height: '300px'
+      },
       // 智能练习
       zujuan: [
         {