aa

src/views/HomeView.vue

@@ -1700,7 +1700,7 @@ const partners = Array.from({ length: 10 }).map((_, idx) => ({
   font-weight: bold;
   letter-spacing: -0.03em;
   font-size: 22px;
-  /* color: rgb(var(--cap-accent, 37 99 235) / 1); */
+  /* color: #003f99; */
 }
 
 .capPlatformDesc {
@@ -3004,4 +3004,42 @@ const partners = Array.from({ length: 10 }).map((_, idx) => ({
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
 }
+
+.capModuleTile {
+  position: relative;
+  border-radius: 5px;
+  padding: 12px 10px 10px;
+  /* border: 1px solid rgba(15, 23, 42, 0.06); */
+  background: linear-gradient(
+    180deg,
+    rgba(255, 255, 255, 1),
+    rgba(248, 250, 252, 0.95)
+  );
+  display: grid;
+  place-items: center;
+  gap: 8px;
+  text-align: center;
+  min-height: 106px;
+  transition:
+    transform 180ms ease,
+    box-shadow 180ms ease,
+    border-color 180ms ease;
+  cursor: pointer;
+  box-shadow:
+    inset 0 2px 4px rgba(255, 255, 255, 1),
+    inset 0 -2px 4px rgba(2, 6, 23, 0.06),
+    inset 0 1px 0 rgba(255, 255, 255, 1),
+    0 4px 8px rgba(2, 6, 23, 0.08);
+}
+
+.capModuleTile:hover {
+  transform: translateY(-3px);
+  border-color: rgb(var(--cap-accent, 37 99 235) / 0.18);
+  box-shadow:
+    inset 0 3px 6px rgba(255, 255, 255, 1),
+    inset 0 -3px 6px rgba(2, 6, 23, 0.08),
+    inset 0 1px 0 rgba(255, 255, 255, 1),
+    0 8px 16px rgba(2, 6, 23, 0.12),
+    0 12px 24px rgba(2, 6, 23, 0.08);
+}
 </style>

src/views/NewsView.vue

@@ -47,24 +47,24 @@ const items = [
     type: "list", // 下部列表新闻
     link: "/news/7",
   },
-  {
-    title: "设备管理系统赋能资产全生命周期管理：从采购到报废的闭环落地",
-    desc: "设备从“采购入库”到“报废处置”的每一步都可控、可追溯。",
-    cover: news1,
-    link: "/news/1",
-  },
-  {
-    title: "AI 设备管理系统实现在线状态智能分析，隐患早发现",
-    desc: "推动工业智能化发展，助力企业创新转型。",
-    cover: news3,
-    link: "/news/2",
-  },
-  {
-    title: "设备维保 “凭感觉”？健康档案 + 动态保养，寿命延25%",
-    desc: "打造“人工智能+工业互联网”赋能制造业转型发展新范式",
-    cover: news4,
-    link: "/news/3",
-  },
+  // {
+  //   title: "设备管理系统赋能资产全生命周期管理：从采购到报废的闭环落地",
+  //   desc: "设备从“采购入库”到“报废处置”的每一步都可控、可追溯。",
+  //   cover: news1,
+  //   link: "/news/1",
+  // },
+  // {
+  //   title: "AI 设备管理系统实现在线状态智能分析，隐患早发现",
+  //   desc: "推动工业智能化发展，助力企业创新转型。",
+  //   cover: news3,
+  //   link: "/news/2",
+  // },
+  // {
+  //   title: "设备维保 “凭感觉”？健康档案 + 动态保养，寿命延25%",
+  //   desc: "打造“人工智能+工业互联网”赋能制造业转型发展新范式",
+  //   cover: news4,
+  //   link: "/news/3",
+  // },
 ];
 
 const marketActivities = [

src/views/ProductsView.vue

@@ -366,66 +366,6 @@ onBeforeUnmount(() => {
                 </div>
               </div>
             </div>
-
-            <!-- <div class="tabContentLayout" v-else>
-              <div class="tabContentFeatures">
-                <div
-                  v-for="(it, idx) in p.items"
-                  :key="it.title"
-                  class="tabFeatureRow"
-                  :class="{
-                    'is-highlighted': idx === currentImageIndex[p.key],
-                  }"
-                  @mouseenter="
-                    () => {
-                      stopImageCarousel(p.key);
-                      currentImageIndex[p.key] = idx;
-                    }
-                  "
-                  @mouseleave="() => startImageCarousel(p.key, p.items.length)"
-                >
-                  <div class="tabFeatureMain">
-                    <div class="featureTitle">{{ it.title }}</div>
-                    <div class="muted featureDesc">{{ it.desc }}</div>
-                  </div>
-                </div>
-              </div>
-              <div class="tabContentImage">
-                <div class="imageCarouselWrapper">
-                  <div class="imageCarouselViewport">
-                    <Transition name="image-carousel-slide" mode="out-in">
-                      <div
-                        v-if="p.items?.length"
-                        :key="`${p.key}-${getActiveIndex(p.key, p.items.length)}`"
-                        class="imageCarouselSlide"
-                      >
-                        <img
-                          :src="getActiveImageSrc(p)"
-                          :alt="getActiveImageAlt(p)"
-                          loading="lazy"
-                          decoding="async"
-                        />
-                      </div>
-                    </Transition>
-                  </div>
-                </div>
-
-                <div class="carouselIndicators">
-                  <button
-                    v-for="(item, idx) in p.items"
-                    :key="idx"
-                    :class="[
-                      'indicator',
-                      { 'is-active': idx === currentImageIndex[p.key] },
-                    ]"
-                    @click="goToImageSlide(p.key, idx, p.items.length)"
-                    @mouseenter="stopImageCarousel(p.key)"
-                    @mouseleave="startImageCarousel(p.key, p.items.length)"
-                    :aria-label="`第${idx + 1}张图片`"
-                  ></button>
-                </div>
-              </div>
-            </div> -->
           </section>
         </div>
       </div>
@@ -906,6 +846,16 @@ onBeforeUnmount(() => {
   box-shadow: 0 0 0 3px rgba(7, 102, 205, 0.24);
 }
 
+/* .tabFeatureRow:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 12px 32px rgba(2, 6, 23, 0.12);
+} */
+
+/* .tabFeatureRow.is-highlighted {
+  border-left: 3px solid #0766cd;
+  box-shadow: 0 8px 24px rgba(7, 102, 205, 0.15);
+} */
+
 .tabFeatureRow {
   padding: 28px;
   background: #fff;
@@ -917,19 +867,39 @@ onBeforeUnmount(() => {
     box-shadow 180ms ease,
     border-left 0.3s ease;
   border-left: 3px solid transparent;
+  position: relative;
 }
 
-.tabFeatureRow:hover {
-  transform: translateY(-2px);
-  box-shadow: 0 12px 32px rgba(2, 6, 23, 0.12);
+.tabFeatureRow.is-highlighted {
+  /* border-left: none; */
+  /* box-shadow:
+    0 8px 24px rgba(7, 102, 205, 0.15),
+    inset 0 0 0 1px rgba(7, 102, 205, 0.1); */
 }
 
-.tabFeatureRow.is-highlighted {
-  border-left: 3px solid #0766cd;
-  box-shadow: 0 8px 24px rgba(7, 102, 205, 0.15);
+.tabFeatureRow.is-highlighted::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 20px;
+  width: calc(100% - 40px);
+  height: 4px;
+  background: linear-gradient(90deg, #0766cd, #0d4a9e);
+  border-radius: 2px 2px 0 0;
 }
 
-/* ... existing code ... */
+.tabFeatureRow.is-highlighted::after {
+  content: "";
+  position: absolute;
+  bottom: -4px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 60px;
+  height: 4px;
+  background: linear-gradient(90deg, transparent, #0766cd, transparent);
+  border-radius: 2px;
+  opacity: 0.6;
+}
 
 .tabContentImage {
   /* border-radius: 16px; */

src/views/SolutionsView.vue

@@ -372,66 +372,6 @@ onBeforeUnmount(() => {
                 </div>
               </div>
             </div>
-
-            <!-- <div class="tabContentLayout" v-else>
-              <div class="tabContentFeatures">
-                <div
-                  v-for="(it, idx) in p.items"
-                  :key="it.title"
-                  class="tabFeatureRow"
-                  :class="{
-                    'is-highlighted': idx === currentImageIndex[p.key],
-                  }"
-                  @mouseenter="
-                    () => {
-                      stopImageCarousel(p.key);
-                      currentImageIndex[p.key] = idx;
-                    }
-                  "
-                  @mouseleave="() => startImageCarousel(p.key, p.items.length)"
-                >
-                  <div class="tabFeatureMain">
-                    <div class="featureTitle">{{ it.title }}</div>
-                    <div class="muted featureDesc">{{ it.desc }}</div>
-                  </div>
-                </div>
-              </div>
-              <div class="tabContentImage">
-                <div class="imageCarouselWrapper">
-                  <div class="imageCarouselViewport">
-                    <Transition name="image-carousel-slide" mode="out-in">
-                      <div
-                        v-if="p.items?.length"
-                        :key="`${p.key}-${getActiveIndex(p.key, p.items.length)}`"
-                        class="imageCarouselSlide"
-                      >
-                        <img
-                          :src="getActiveImageSrc(p)"
-                          :alt="getActiveImageAlt(p)"
-                          loading="lazy"
-                          decoding="async"
-                        />
-                      </div>
-                    </Transition>
-                  </div>
-                </div>
-
-                <div class="carouselIndicators">
-                  <button
-                    v-for="(item, idx) in p.items"
-                    :key="idx"
-                    :class="[
-                      'indicator',
-                      { 'is-active': idx === currentImageIndex[p.key] },
-                    ]"
-                    @click="goToImageSlide(p.key, idx, p.items.length)"
-                    @mouseenter="stopImageCarousel(p.key)"
-                    @mouseleave="startImageCarousel(p.key, p.items.length)"
-                    :aria-label="`第${idx + 1}张图片`"
-                  ></button>
-                </div>
-              </div>
-            </div> -->
           </section>
         </div>
       </div>
@@ -1265,17 +1205,7 @@ onBeforeUnmount(() => {
     transform 180ms ease,
     box-shadow 180ms ease,
     border-left 0.3s ease;
-  border-left: 3px solid transparent;
-}
-
-.tabFeatureRow:hover {
-  transform: translateY(-2px);
-  box-shadow: 0 12px 32px rgba(2, 6, 23, 0.12);
-}
-
-.tabFeatureRow.is-highlighted {
-  border-left: 3px solid #0766cd;
-  box-shadow: 0 8px 24px rgba(7, 102, 205, 0.15);
+  /* border-left: 3px solid transparent; */
 }
 
 /* ... existing code ... */
@@ -1357,4 +1287,49 @@ onBeforeUnmount(() => {
   outline: none;
   box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.5);
 }
+
+.tabFeatureRow {
+  padding: 28px;
+  background: #fff;
+  /* border-radius: 16px; */
+  box-shadow: 0 8px 24px rgba(2, 6, 23, 0.08);
+  min-height: 140px;
+  transition:
+    transform 180ms ease,
+    box-shadow 180ms ease,
+    border-left 0.3s ease;
+  border-left: 3px solid transparent;
+  position: relative;
+}
+
+.tabFeatureRow.is-highlighted {
+  /* border-left: none; */
+  /* box-shadow:
+    0 8px 24px rgba(7, 102, 205, 0.15),
+    inset 0 0 0 1px rgba(7, 102, 205, 0.1); */
+}
+
+.tabFeatureRow.is-highlighted::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 20px;
+  width: calc(100% - 40px);
+  height: 4px;
+  background: linear-gradient(90deg, #0766cd, #0d4a9e);
+  border-radius: 2px 2px 0 0;
+}
+
+.tabFeatureRow.is-highlighted::after {
+  content: "";
+  position: absolute;
+  bottom: -4px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 60px;
+  height: 4px;
+  background: linear-gradient(90deg, transparent, #0766cd, transparent);
+  border-radius: 2px;
+  opacity: 0.6;
+}
 </style>