From 80b0d612f914d24a0595e952c6d4891e84f10da6 Mon Sep 17 00:00:00 2001
From: maochaoying <925670706@qq.com>
Date: Tue, 18 Apr 2023 17:38:18 +0800
Subject: [PATCH] 123

---
 src/components/Trumbs/index.vue | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/components/Trumbs/index.vue b/src/components/Trumbs/index.vue
index deffcd1..6df6204 100644
--- a/src/components/Trumbs/index.vue
+++ b/src/components/Trumbs/index.vue
@@ -17,7 +17,11 @@
         :key="item.picUrl"
         style="background: none"
       >
-        <div class="img_card" :key="item.picUrl" @click="viewDetail(item.id)">
+        <div
+          :class="isActive(item.id) ? 'img_card active_card' : 'img_card'"
+          :key="item.picUrl"
+          @click="viewDetail(item.id)"
+        >
           <img v-lazy="item.picUrl" class="img" alt="" />
           <div class="dialog_text">
             <div class="btn" @click="viewDetail(item.id)">查看详情</div>
@@ -83,6 +87,15 @@ const props = defineProps({
   isCase: Boolean,
 })
 const modules = ref([FreeMode, Navigation])
+
+const isActive = index => {
+  if (props.isCase) {
+    return index == detailStore.example_id
+  } else {
+    return index == detailStore.hardwareExampleId
+  }
+}
+
 const viewDetail = index => {
   myEmit('onMySonFunc')
   if (props.isCase) {
@@ -158,6 +171,10 @@ const onSwiper = swiper => {
       }
     }
   }
+  .active_card {
+    border-top: solid 6px #283fe7;
+    box-sizing: border-box;
+  }
   .dialog_text:hover {
     background: rgba(53, 83, 227, 0.63);
     opacity: 1;