1

README.md

@@ -171,4 +171,6 @@ npm run build
 
 ---
 
-**丙维科技** - 技术驱动未来，服务创造价值 🚀
+**丙维科技** - 技术驱动未来，服务创造价值 🚀
+
+https://bimwe.oss-cn-shanghai.aliyuncs.com/web/foundry_1.gif

package.json

@@ -28,7 +28,8 @@
     "postcss-pxtorem": "^6.1.0",
     "responsive-loader": "^2.3.0",
     "sharp": "^0.34.3",
-    "vue-template-compiler": "^2.5.17"
+    "vue-template-compiler": "^2.5.17",
+    "webpack": "4.46.0"
   },
   "postcss": {
     "plugins": {

src/views/index.vue

@@ -44,8 +44,8 @@
     <div class="company-intro">
       <div class="container">
         <div class="intro-header">
-          <h2 class="section-title animate-on-scroll">技术驱动未来，服务创造价值</h2>
-          <p class="section-subtitle animate-on-scroll">上海丙维数字科技有限公司成立于2018年，专注于AI交付内容，为客户提供高质量的数字化解决方案</p>
+          <h2 class="section-title">技术驱动未来，服务创造价值</h2>
+          <p class="section-subtitle">上海丙维数字科技有限公司成立于2018年，专注于AI交付内容，为客户提供高质量的数字化解决方案</p>
         </div>
         
         <div class="intro-content animate-stagger">
@@ -73,7 +73,7 @@
     <!-- 核心优势展示 -->
     <div class="core-advantages">
       <div class="container">
-        <h2 class="section-title animate-on-scroll">核心优势</h2>
+        <h2 class="section-title">核心优势</h2>
         <div class="advantages-grid animate-stagger">
                      <div class="advantage-item hover-scale" v-for="advantage in advantages" :key="advantage.title">
              <div class="advantage-icon animate bounce delay-1s">
@@ -90,7 +90,7 @@
     <!-- 业务领域展示 -->
     <div class="business-areas">
       <div class="container">
-        <h2 class="section-title animate-on-scroll">业务领域</h2>
+        <h2 class="section-title">业务领域</h2>
         <div class="areas-grid animate-stagger">
                      <div class="area-item hover-glow" v-for="area in businessAreas" :key="area.name">
              <div class="area-icon animate wobble delay-2s">
@@ -118,8 +118,8 @@
          <!-- 产品展示区域 -->
      <div class="products-section">
        <div class="container">
-         <h2 class="section-title animate-on-scroll">核心解决方案</h2>
-         <p class="section-subtitle animate-on-scroll">为不同行业提供专业的技术解决方案，助力企业数字化转型</p>
+         <h2 class="section-title">核心解决方案</h2>
+         <p class="section-subtitle">为不同行业提供专业的技术解决方案，助力企业数字化转型</p>
          
          <div id="pageBoxesContainer" class="page pageBoxes animate-stagger">
            <div class="box hover-lift" v-for="product in productData" :key="product.name">
@@ -147,10 +147,30 @@
        </div>
      </div>
 
+    <!-- 客户展示区域 -->
+    <div class="clients-section">
+      <div class="container">
+        <h2 class="section-title">合作伙伴</h2>
+        <p class="section-subtitle">我们与众多知名企业建立了长期稳定的合作关系</p>
+        
+        <div class="clients-grid animate-stagger">
+          <div class="client-item hover-scale" v-for="client in clients" :key="client.name">
+            <div class="client-logo">
+              <img :src="client.logo" :alt="client.name" />
+            </div>
+            <div class="client-info">
+              <h4>{{client.name}}</h4>
+              <p>{{client.description}}</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
     <!-- 联系我们区域 -->
     <div class="contact-section">
       <div class="container">
-        <h2 class="section-title animate-on-scroll">联系我们</h2>
+        <h2 class="section-title">联系我们</h2>
         <div class="contact-info animate-stagger">
           <div class="contact-item hover-scale">
             <div class="contact-icon animate heartBeat infinite">📍</div>
@@ -196,6 +216,21 @@ let boxbg_iot = require('../assets/img/boxbg_iot.png')
 let boxbg_facilitiesmanagement = require('../assets/img/boxbg_facilitiesmanagement.png')
 let boxbg_errands = require('../assets/img/boxbg_errands.png')
 
+// 客户logo图片
+let client_01 = require('../assets/img/hezuo/client_01.png')
+let client_02 = require('../assets/img/hezuo/client_02.png')
+let client_03 = require('../assets/img/hezuo/client_03.png')
+let client_04 = require('../assets/img/hezuo/client_04.png')
+let client_05 = require('../assets/img/hezuo/client_05.png')
+let client_06 = require('../assets/img/hezuo/client_06.png')
+let client_07 = require('../assets/img/hezuo/client_07.png')
+let client_08 = require('../assets/img/hezuo/client_08.png')
+let client_09 = require('../assets/img/hezuo/client_09.png')
+let client_10 = require('../assets/img/hezuo/client_10.png')
+let client_11 = require('../assets/img/hezuo/client_11.png')
+let client_12 = require('../assets/img/hezuo/client_12.png')
+
+
 export default {
   components: {
     VueAwesomeSwiper,
@@ -251,7 +286,7 @@ export default {
           description: '由阿里、字节、腾讯等顶尖互联网公司资深开发人员组成，技术积累深厚，项目经验丰富'
         },
         {
-          icon: '🤖',
+          icon: '🚀',
           title: 'AI领域战略转型',
           description: '2022年成功转型，将业务重心聚焦于AI交付领域，围绕客户需求提供定制化智能应用解决方案'
         },
@@ -323,6 +358,69 @@ export default {
            tags: ['API集成', '数据同步', '统一管理']
          },
        ],
+       clients: [
+         {
+           name: '合作伙伴1',
+           logo: client_01,
+           description: '长期战略合作伙伴'
+         },
+         {
+           name: '合作伙伴2',
+           logo: client_02,
+           description: '技术合作企业'
+         },
+         {
+           name: '合作伙伴3',
+           logo: client_03,
+           description: '行业领先企业'
+         },
+         {
+           name: '合作伙伴4',
+           logo: client_04,
+           description: '创新科技公司'
+         },
+         {
+           name: '合作伙伴5',
+           logo: client_05,
+           description: '数字化转型伙伴'
+         },
+         {
+           name: '合作伙伴6',
+           logo: client_06,
+           description: 'AI技术合作方'
+         },
+         {
+           name: '合作伙伴7',
+           logo: client_07,
+           description: '智能制造企业'
+         },
+         {
+           name: '合作伙伴8',
+           logo: client_08,
+           description: '金融服务机构'
+         },
+         {
+           name: '合作伙伴9',
+           logo: client_09,
+           description: '零售行业客户'
+         },
+         {
+           name: '合作伙伴10',
+           logo: client_10,
+           description: '教育科技公司'
+         },
+         {
+           name: '合作伙伴11',
+           logo: client_11,
+           description: '医疗健康企业'
+         },
+         {
+           name: '合作伙伴12',
+           logo: client_12,
+           description: '物流运输公司'
+         }
+       ],
+
     }
   },
 
@@ -590,6 +688,128 @@ export default {
   font-weight: bold;
 }
 
+/* 客户展示区域 */
+.clients-section {
+  padding: 80px 0;
+  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
+}
+
+.clients-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  gap: 30px;
+  margin-top: 50px;
+}
+
+.client-item {
+  background: white;
+  padding: 30px 20px;
+  border-radius: 15px;
+  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
+  transition: transform 0.3s ease, box-shadow 0.3s ease;
+  text-align: center;
+  border: 1px solid #e9ecef;
+}
+
+.client-item:hover {
+  transform: translateY(-10px);
+  box-shadow: 0 20px 40px rgba(0,0,0,0.15);
+}
+
+.client-logo {
+  margin-bottom: 20px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 80px;
+}
+
+.client-logo img {
+  max-width: 100%;
+  max-height: 60px;
+  object-fit: contain;
+  filter: grayscale(100%);
+  transition: filter 0.3s ease;
+}
+
+.client-item:hover .client-logo img {
+  filter: grayscale(0%);
+}
+
+.client-info h4 {
+  font-size: 1.3rem;
+  font-weight: 600;
+  color: #2c3e50;
+  margin-bottom: 10px;
+}
+
+.client-info p {
+  color: #6c757d;
+  font-size: 0.9rem;
+  margin: 0;
+}
+
+/* 客户展示区域 */
+.clients-section {
+  padding: 80px 0;
+  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
+}
+
+.clients-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+  gap: 20px;
+  margin-top: 50px;
+}
+
+.client-item {
+  background: white;
+  padding: 20px 15px;
+  border-radius: 12px;
+  box-shadow: 0 8px 25px rgba(0,0,0,0.1);
+  transition: transform 0.3s ease, box-shadow 0.3s ease;
+  text-align: center;
+  border: 1px solid #e9ecef;
+}
+
+.client-item:hover {
+  transform: translateY(-8px);
+  box-shadow: 0 15px 35px rgba(0,0,0,0.15);
+}
+
+.client-logo {
+  margin-bottom: 15px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 60px;
+}
+
+.client-logo img {
+  max-width: 100%;
+  max-height: 45px;
+  object-fit: contain;
+  filter: grayscale(100%);
+  transition: filter 0.3s ease;
+}
+
+.client-item:hover .client-logo img {
+  filter: grayscale(0%);
+}
+
+.client-info h4 {
+  font-size: 1.1rem;
+  font-weight: 600;
+  color: #2c3e50;
+  margin-bottom: 8px;
+}
+
+.client-info p {
+  color: #6c757d;
+  font-size: 0.8rem;
+  margin: 0;
+}
+
 /* 联系我们区域 */
 .contact-section {
   padding: 80px 0;
@@ -663,6 +883,7 @@ export default {
   .intro-content,
   .advantages-grid,
   .areas-grid,
+  .clients-grid,
   .contact-info {
     grid-template-columns: 1fr;
   }
@@ -670,43 +891,44 @@ export default {
        .company-intro,
   .core-advantages,
   .business-areas,
+  .clients-section,
   .contact-section,
   .products-section {
-    padding: 60px 0;
+    padding: 10px 0;
   }
   
   .pageBoxes {
     grid-template-columns: 1fr;
-    gap: 30px;
+    gap: 20px;
     display: flex;
     flex-direction: row;
   }
   
   .boxTableHeader {
-    padding: 25px;
+    padding: 15px;
   }
   
   .product-tags {
-    gap: 8px;
+    gap: 6px;
   }
   
   .tag {
-    font-size: 0.8rem;
-    padding: 5px 12px;
+    font-size: 0.75rem;
+    padding: 4px 10px;
   }
 }
 
  /* 产品展示区域样式 */
 .products-section {
-  padding: 80px 0;
+  padding: 10px 0;
   background: white;
 }
 
 .pageBoxes {
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
-  gap: 40px;
-  margin-top: 50px;
+  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
+  gap: 25px;
+  margin-top: 40px;
 }
 
 .box {
@@ -778,37 +1000,37 @@ export default {
 }
 
 .boxTableHeader {
-  padding: 30px;
+  padding: 20px;
   text-align: center;
 }
 
 .boxTableHeader .h2 {
-  font-size: 1.6rem;
+  font-size: 1.4rem;
   font-weight: 600;
   color: #2c3e50;
-  margin-bottom: 20px;
+  margin-bottom: 15px;
 }
 
 .product-description {
   color: #6c757d;
-  line-height: 1.7;
-  margin-bottom: 25px;
-  font-size: 1rem;
+  line-height: 1.6;
+  margin-bottom: 20px;
+  font-size: 0.95rem;
 }
 
 .product-tags {
   display: flex;
   flex-wrap: wrap;
-  gap: 10px;
+  gap: 8px;
   justify-content: center;
 }
 
 .tag {
   background: #e9ecef;
   color: #495057;
-  padding: 6px 14px;
-  border-radius: 18px;
-  font-size: 0.85rem;
+  padding: 5px 12px;
+  border-radius: 15px;
+  font-size: 0.8rem;
   font-weight: 500;
   transition: all 0.3s ease;
 }

vue.config.js

@@ -14,6 +14,9 @@ module.exports = {
     lintOnSave: false, // 是否启用 eslint
 
     chainWebpack: (config) => {
+        // 禁用 CaseSensitivePathsPlugin
+        config.plugins.delete('case-sensitive-paths');
+        
         // 别名
         config.resolve.alias.set("@", resolve("src"));
         config.resolve.alias.set("_c", resolve("src/components"));
@@ -71,7 +74,7 @@ module.exports = {
     configureWebpack: {
         output: {
             filename: "js/[hash].js",
-        },
+        }
     },
 
     css: {