底部组件数据联调

hookehuyr
Commit d81b68c1431120c6aea1357c45c7c7cdef3bce63 d81b68c1 1 parent c3b9ccaa
Showing 2 changed files with 76 additions and 65 deletions
src/api/hager.js
src/components/common/hagerFooter.vue
--- a/src/api/hager.js
View file @d81b68c
+++ b/src/api/hager.js
View file @d81b68c
@@ -16,6 +16,7 @@ const Api = {
   PRODUCT_INFO: '/srv/?a=detail&type=product',
   PRODUCT_SEARCH: '/srv/?a=cate&type=product_search',
   SOLUTION: '/srv/?a=cate&type=solution',
+  FOOTER: '/srv/?a=footer',
 };
 export const honorAPI = (params) => fn(fetch.get(Api.HONOR, params));
@@ -33,3 +34,5 @@ export const getProductInfoAPI = (params) => fn(fetch.get(Api.PRODUCT_INFO, para
 export const getProductSearchAPI = (params) => fn(fetch.get(Api.PRODUCT_SEARCH, params));
 export const getSolutionListAPI = (params) => fn(fetch.get(Api.SOLUTION, params));
+
+export const getFooterAPI = (params) => fn(fetch.get(Api.FOOTER, params));
--- a/src/components/common/hagerFooter.vue
View file @d81b68c
+++ b/src/components/common/hagerFooter.vue
View file @d81b68c
 <!--
  * @Date: 2024-09-26 13:42:22
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2024-10-23 09:42:45
+ * @LastEditTime: 2024-10-24 11:50:08
  * @FilePath: /hager/src/components/common/hagerFooter.vue
  * @Description: 文件描述
 -->
@@ -15,19 +15,7 @@
               <div class="link-box">
                 <div class="link-title">产品目录</div>
                 <div class="link-info">
-                  <p>空气断路器</p>
+                  <p v-for="(item, index) in footer_data.product" :key="index" @click="goToProduct(item)">{{ item.category_name }}</p>
-                  <p>塑壳断路器</p>
-                  <p>自动转换开关</p>
-                  <p>接触器及热过载继电器</p>
-                  <p>隔离开关</p>
-                  <p>配电箱</p>
-                  <p>终端配电</p>
-                  <p>Unimes开关柜</p>
-                  <p>Berker</p>
-                  <p>志系列</p>
-                  <p>KNX控制系统</p>
-                  <p>RCU客房控制系统</p>
-                  <p>Agardio数字化能源解决方案</p>
                 </div>
               </div>
             </el-col>
@@ -35,18 +23,7 @@
               <div class="link-box">
                 <div class="link-title">解决方案</div>
                 <div class="link-info">
-                  <p>住宅解决方案</p>
+                  <p v-for="(item, index) in footer_data.solution" :key="index" @click="goToSolution(item)">{{ item.category_name }}</p>
-                  <p>商建解决方案</p>
-                  <p>公建解决方案</p>
-                  <p>供电局解决方案</p>
-                  <p>发电解决方案</p>
-                  <p>石油石化解决方案</p>
-                  <p>冶金解决方案</p>
-                  <p>电子解决方案</p>
-                  <p>通信解决方案</p>
-                  <p>算力解决方案</p>
-                  <p>交通解决方案</p>
-                  <p>其它解决方案</p>
                 </div>
               </div>
             </el-col>
@@ -54,12 +31,7 @@
               <div class="link-box">
                 <div class="link-title">企业</div>
                 <div class="link-info">
-                  <p>海格全球</p>
+                  <p v-for="(item, index) in intro_list" :key="index" @click="goToCorp(item)">{{ item.c_title }}</p>
-                  <p>海格电气在中国</p>
-                  <p>创新设计与用户体验</p>
-                  <p>生产研发与服务</p>
-                  <p>可持续发展的企业文化</p>
-                  <p>荣誉展示</p>
                 </div>
               </div>
             </el-col>
@@ -96,19 +68,7 @@
         </div>
         <el-collapse-transition>
           <div v-show="show_p" class="link-info">
-            <p>空气断路器</p>
+            <p v-for="(item, index) in footer_data.product" :key="index" @click="goToProduct(item)">{{ item.category_name }}</p>
-            <p>塑壳断路器</p>
-            <p>自动转换开关</p>
-            <p>接触器及热过载继电器</p>
-            <p>隔离开关</p>
-            <p>配电箱</p>
-            <p>终端配电</p>
-            <p>Unimes开关柜</p>
-            <p>Berker</p>
-            <p>志系列</p>
-            <p>KNX控制系统</p>
-            <p>RCU客房控制系统</p>
-            <p>Agardio数字化能源解决方案</p>
           </div>
         </el-collapse-transition>
       </div>
@@ -119,18 +79,7 @@
         </div>
         <el-collapse-transition>
           <div v-show="show_s" class="link-info">
-            <p>住宅解决方案</p>
+            <p v-for="(item, index) in footer_data.solution" :key="index" @click="goToSolution(item)">{{ item.category_name }}</p>
-            <p>商建解决方案</p>
-            <p>公建解决方案</p>
-            <p>供电局解决方案</p>
-            <p>发电解决方案</p>
-            <p>石油石化解决方案</p>
-            <p>冶金解决方案</p>
-            <p>电子解决方案</p>
-            <p>通信解决方案</p>
-            <p>算力解决方案</p>
-            <p>交通解决方案</p>
-            <p>其它解决方案</p>
           </div>
         </el-collapse-transition>
       </div>
@@ -141,12 +90,7 @@
         </div>
         <el-collapse-transition>
           <div v-show="show_c" class="link-info">
-            <p>海格全球</p>
+            <p v-for="(item, index) in intro_list" :key="index" @click="goToCorp(item)">{{ item.c_title }}</p>
-            <p>海格电气在中国</p>
-            <p>创新设计与用户体验</p>
-            <p>生产研发与服务</p>
-            <p>可持续发展的企业文化</p>
-            <p>荣誉展示</p>
           </div>
         </el-collapse-transition>
       </div>
@@ -176,19 +120,62 @@
 <script>
 import mixin from 'common/mixin';
 import hagerBox from '@/components/common/hagerBox';
+import { getFooterAPI } from '@/api/hager';
 export default {
   components: { hagerBox },
   mixins: [mixin.init],
   data () {
     return {
+      footer_data: '',
       show_p: false,
       show_s: false,
       show_c: false,
+      intro_list: [{
+        img: 'https://cdn.ipadbiz.cn/hager/img/about/g01@2x.png',
+        c_title: '海格全球',
+        e_title: 'Hager Group',
+        content: '海格集团是全球领先的电气及智能化解决方案和服务提供商，应用领域涵盖住宅、商业建筑、公共建筑和工业。',
+        link: '/about/global',
+      },{
+        img: 'https://cdn.ipadbiz.cn/hager/img/about/g02@2x.png',
+        c_title: '海格电气在中国',
+        e_title: 'Hager in China',
+        content: '海格电气于1997 年进入中国市场，至今已在中国设立了3家工厂和32个销售办事处，通过覆盖全国的营销网络及高资质合作伙伴，为中国客户提供全球领先的解决方案和高效服务。',
+        link: '/about/china',
+      },{
+        img: 'https://cdn.ipadbiz.cn/hager/img/about/g03@2x.png',
+        c_title: '创新设计',
+        e_title: 'Innovative Design',
+        content: '海格电气一直致力于创新，我们与客户共同着手面向未来的主题。海格电气仔细倾听客户的声音，以使我们的设计语言能够被普遍理解。',
+        link: '/about/design',
+      },{
+        img: 'https://cdn.ipadbiz.cn/hager/img/about/g04@2x.png',
+        c_title: '生产研发',
+        e_title: 'Production and R&D',
+        content: '为配合海格集团在全球的业务扩展计划，目前中国有2个生产基地，分别位于惠州和东莞，主要为亚太乃至全球市场提供优质的配电及相关产品。海格集团在全球拥有22家生产基地，主要分布于欧洲。',
+        link: '/about/product',
+      },{
+        img: 'https://cdn.ipadbiz.cn/hager/img/about/g05@2x.png',
+        c_title: '可持续发展',
+        e_title: 'Sustainable Development',
+        content: '海格集团是全球领先的电气及智能化解决方案和服务提供商，应用领域涵盖住宅、商业建筑、公共建筑和工业。',
+        link: '/about/development',
+      },{
+        img: 'https://cdn.ipadbiz.cn/hager/img/about/g06@2x.png',
+        c_title: '荣誉展示',
+        e_title: 'Honors',
+        content: '海格集团是行业创新领导者之一，我们与来自工业和电气领域的客户一起致力于引领面向未来的主题，如家庭互联、智能建筑技术、能源效率、生活辅助系统、电动交通、可再生能源。',
+        link: '/about/honors',
+      }]
     }
   },
-  mounted () {
+  async mounted () {
-
+    const { code, data } = await getFooterAPI();
+    if (code) {
+      this.footer_data = data;
+      console.warn(data);
+    }
   },
   methods: {
     toggleCollapse (type) {
@@ -201,6 +188,27 @@ export default {
       if (type === 'c') { // 企业
         this.show_c = !this.show_c;
       }
+    },
+    goToProduct (item) {
+      this.$router.push({
+        path: '/product/index',
+        query: {
+          id: item.id
+        }
+      });
+    },
+    goToSolution (item) {
+      this.$router.push({
+        path: '/solution/detail',
+        query: {
+          id: item.id
+        }
+      });
+    },
+    goToCorp (item) {
+      this.$router.push({
+        path: item.link,
+      })
     }
   }
 }