From 30d3e2ea9c2ed566cd83c7c7eecc30cc10b2ce53 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Mon, 25 Aug 2025 20:10:50 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=87=AA=E5=AE=9A=E4=B9=89?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/index.js                   |  7 +--
 src/views/industrySolutions/index.vue | 84 ++++++++++++++++++++++-----
 2 files changed, 72 insertions(+), 19 deletions(-)

diff --git a/src/router/index.js b/src/router/index.js
index 3647b00..2ed7c67 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -31,10 +31,9 @@ export default new Router({
           path: 'industrySolutions', component: () => import('@/views/industrySolutions/index.vue'),
         },
         {
-          path: 'productCenter/detail1', component: () => import('@/views/productCenter/detail1.vue'),
-        },
-        {
-          path: 'productCenter/detail2', component: () => import('@/views/productCenter/detail2.vue'),
+          path: 'productCenter/detail1', component: () => import('@/views/productCenter/detail2.vue'),
+        }, {
+          path: 'productCenter/detail2', component: () => import('@/views/productCenter/detail1.vue'),
         },
         {
           path: 'index', component: () => import('@/views/index/index.vue'),
diff --git a/src/views/industrySolutions/index.vue b/src/views/industrySolutions/index.vue
index d0130c3..7f382cb 100644
--- a/src/views/industrySolutions/index.vue
+++ b/src/views/industrySolutions/index.vue
@@ -13,8 +13,7 @@
       <template v-for="i in tabsList">
         <div class="card">
           <!-- 左侧图片 -->
-          <div class="card-img">
-            <img src="http://1.13.177.47:9665/statics/2025/07/24/mesnac_20250724093713A002.jpg" alt="语音拣选">
+          <div class="card-img" :style="{backgroundImage: 'url(' + i.img + ') '}">
           </div>
 
           <!-- 右侧内容 -->
@@ -51,15 +50,61 @@ export default {
       banner:'http://1.13.177.47:9665/statics/2025/07/24/mesnac_20250724093713A002.jpg',
       bannerTitle: '',
       tabsActive: 0,
-      tabsList: [{
-        title:'智能轮胎',
-        value:'智能轮胎介绍',
-        info:'智能轮胎信息',
-      }],
+      tabsList: [
+        {
+          title: '智能轮胎',
+          value: '智能轮胎介绍',
+          info: '智能轮胎信息',
+          img: 'http://1.13.177.47:9665/statics/2025/07/24/mesnac_20250724093713A002.jpg',
+          id: '5'
+        },
+        {
+          title: '轮胎工厂',
+          value: '轮胎工厂介绍',
+          info: '轮胎工厂信息',
+          img: 'http://1.13.177.47:9665/statics/2025/07/24/mesnac_20250724093713A002.jpg',
+          id: '18'
+        },
+        {
+          title: '快递物流',
+          value: '快递物流介绍',
+          info: '快递物流信息',
+          img: 'http://1.13.177.47:9665/statics/2025/08/22/%E5%9B%BE%E7%89%8717_20250822141810A130.jpg',
+          id: '19'
+        },
+        {
+          title: '畜牧食品',
+          value: '畜牧食品介绍',
+          info: '在畜牧屠宰行业，RFID助力车间自动化，智能化生产，合作客户包括双汇、正大、牧原等',
+          img: 'http://1.13.177.47:9665/statics/2025/08/22/12_20250822135124A121.png',
+          id: '20'
+        },
+        {
+          title: '新能源',
+          value: '新能源介绍',
+          info: '新能源信息',
+          img: 'http://1.13.177.47:9665/statics/2025/07/24/mesnac_20250724093713A002.jpg',
+          id: '21'
+        },
+        {
+          title: '智能制造',
+          value: '智能制造介绍',
+          info: '智能制造信息',
+          img: 'http://1.13.177.47:9665/statics/2025/08/22/%E5%9B%BE%E7%89%8736_20250822142617A134.jpg',
+          id: '22'
+        },
+        {
+          title: '工业物联',
+          value: '工业物联123xsw介绍',
+          info: '工业物联信息',
+          img: 'http://1.13.177.47:9665/statics/2025/07/24/mesnac_20250724093713A002.jpg',
+          id: '23'
+        },
+      ],
     }
   },
   mounted() {
-    this.getData()
+    // this.getData()
   },
   methods: {
     getData() {
@@ -174,22 +219,31 @@ export default {
   &:nth-child(3n){
     margin-left: 2%;
   }
-  &:nth-child(3n-   1){
+
+  &:nth-child(3n-1) {
     margin-left: 2%;
   }
+
   .card-img{
     position: absolute;
     opacity: 0.4;
-    width: 40%;
+    width: 100%;
     height: 100%;
     top: 0;
     left: 0;
-    img{
-      width: 100%;
-      height: 100%;
-      //object-fit: contain;
-    }
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+    /* 设置透明蒙版 */
+    -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
+    -webkit-mask-repeat: no-repeat;
+    -webkit-mask-size: 100% 100%;
+
+    mask-image: linear-gradient(to right, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
+    mask-repeat: no-repeat;
+    mask-size: 100% 100%;
   }
+
+
   .card-title{
 
     position: absolute;