Hooke / hager

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
72c46633 1 parent e6e31e4e

✨ feat: 新增关于海格相关的页面

Inline Side-by-side
Showing 10 changed files with 399 additions and 5 deletions
<!--
* @Date: 2024-09-26 13:42:11
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 11:04:59
* @LastEditTime: 2024-10-17 11:21:45
* @FilePath: /hager/src/components/common/hagerHeader.vue
* @Description: 文件描述
-->
......@@ -46,7 +46,7 @@
</el-col>
<el-col :sm="1" :md="1" :lg="3" :xl="4">&nbsp;</el-col>
</el-row>
<el-row class="hidden-xs-only" style="background-color: #fff; border-top: 1px solid rgba(218, 218, 218, 0.4);">
<el-row class="hidden-xs-only" style="background-color: #fff; border-top: 1px solid rgba(218, 218, 218, 0.4); border-bottom: 1px solid rgba(218, 218, 218, 0.4);">
<el-col :sm="1" :md="1" :lg="3" :xl="4">&nbsp;</el-col>
<el-col :sm="22" :md="22" :lg="18" :xl="16" style="position: relative;height: 5rem;">
<el-row>
......
......@@ -59,4 +59,58 @@ export default [{
tag: 'about'
},
children: []
}, {
path: '/about/global',
name: '海格全球',
component: () => import('@/views/about/global'),
meta: {
title: '海格电器',
tag: 'about'
},
children: []
}, {
path: '/about/china',
name: '海格电气在中国',
component: () => import('@/views/about/china'),
meta: {
title: '海格电器',
tag: 'about'
},
children: []
}, {
path: '/about/design',
name: '创新设计',
component: () => import('@/views/about/design'),
meta: {
title: '海格电器',
tag: 'about'
},
children: []
}, {
path: '/about/product',
name: '生产研发',
component: () => import('@/views/about/product'),
meta: {
title: '海格电器',
tag: 'about'
},
children: []
}, {
path: '/about/development',
name: '可持续发展',
component: () => import('@/views/about/development'),
meta: {
title: '海格电器',
tag: 'about'
},
children: []
}, {
path: '/about/honors',
name: '荣誉展示',
component: () => import('@/views/about/honors'),
meta: {
title: '海格电器',
tag: 'about'
},
children: []
}]
......
<!--
* @Date: 2024-10-17 11:13:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 11:27:27
* @FilePath: /hager/src/views/about/global.vue
* @Description: 文件描述
-->
<template>
<div class="hager-about-global-page">
<hager-box>
<div v-if="!is_xs" style="margin-top: 1.5rem;">
<el-breadcrumb separator="/">
<el-breadcrumb-item>关于海格</el-breadcrumb-item>
<el-breadcrumb-item>{{ $route.name }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</hager-box>
</div>
</template>
<script>
import mixin from 'common/mixin';
import hagerBox from '@/components/common/hagerBox';
export default {
components: { hagerBox },
mixins: [mixin.init],
data () {
return {
}
},
mounted () {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.hager-about-global-page {
}
</style>
<!--
* @Date: 2024-10-17 11:13:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 11:27:27
* @FilePath: /hager/src/views/about/global.vue
* @Description: 文件描述
-->
<template>
<div class="hager-about-global-page">
<hager-box>
<div v-if="!is_xs" style="margin-top: 1.5rem;">
<el-breadcrumb separator="/">
<el-breadcrumb-item>关于海格</el-breadcrumb-item>
<el-breadcrumb-item>{{ $route.name }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</hager-box>
</div>
</template>
<script>
import mixin from 'common/mixin';
import hagerBox from '@/components/common/hagerBox';
export default {
components: { hagerBox },
mixins: [mixin.init],
data () {
return {
}
},
mounted () {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.hager-about-global-page {
}
</style>
<!--
* @Date: 2024-10-17 11:13:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 11:27:27
* @FilePath: /hager/src/views/about/global.vue
* @Description: 文件描述
-->
<template>
<div class="hager-about-global-page">
<hager-box>
<div v-if="!is_xs" style="margin-top: 1.5rem;">
<el-breadcrumb separator="/">
<el-breadcrumb-item>关于海格</el-breadcrumb-item>
<el-breadcrumb-item>{{ $route.name }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</hager-box>
</div>
</template>
<script>
import mixin from 'common/mixin';
import hagerBox from '@/components/common/hagerBox';
export default {
components: { hagerBox },
mixins: [mixin.init],
data () {
return {
}
},
mounted () {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.hager-about-global-page {
}
</style>
<!--
* @Date: 2024-10-17 11:13:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 11:48:43
* @FilePath: /hager/src/views/about/global.vue
* @Description: 文件描述
-->
<template>
<div class="hager-about-global-page">
<hager-box>
<div v-if="!is_xs" style="margin-top: 1.5rem;">
<el-breadcrumb separator="/">
<el-breadcrumb-item>关于海格</el-breadcrumb-item>
<el-breadcrumb-item>{{ $route.name }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</hager-box>
<hager-box>
<el-row style="margin: 3rem 0;">
<el-col :span="8">
<div class="about-box">
<div style="top: 50%; transform: translateY(50%);">
<div class="title">
<p class="c">海格全球</p>
<p class="e">Hager Group</p>
</div>
<div class="introduce" v-clamp="3">海格集团是全球领先的电气及智能化解决方案和服务提供商，应用领域涵盖住宅、商业建筑、公共建筑和工业。</div>
</div>
</div>
</el-col>
<el-col :span="15">
<div class="about-img"></div>
</el-col>
</el-row>
<div class="about-content">
<p>海格电气品牌代表了集团的核心业务，覆盖配电系统、电缆管理系统，KNX 智能控制系统和开关面板、楼宇自动化和安防系统。集团旗下还拥有Berker、Bocchiotti、Elcom 和 E3 / DC 等品牌。这使我们得以整合专能，持续为楼宇自动化领域开发创新产品、系统和服务。</p>
<p>海格集团是行业创新领导者之一，我们与来自工业和电气领域的客户一起致力于引领面向未来的主题，如家庭互联、智能建筑技术、能源效率、生活辅助系统、电动交通、可再生能源。配电系统是这些技术得以实现的中枢，也是伴随我们成长的基础产品。</p>
<p>海格集团于1955年由Hermann Hager、Oswald Hager 博士和他们的父亲Peter Hager 一起创立，集团总部位于德国Blieskastel，直到今天依然是一家独立运营的家族企业。在“真诚、勇气、正直”价值观的指导下，全球13000名员工紧密与客户联系在一起，在2023年创造了约32亿欧元的销售业绩，来自全球22个生产基地的产品和解决方案赢得了100多个国家客户的信任。</p>
</div>
</hager-box>
</div>
</template>
<script>
import mixin from 'common/mixin';
import hagerBox from '@/components/common/hagerBox';
export default {
components: { hagerBox },
mixins: [mixin.init],
data () {
return {
}
},
mounted () {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.hager-about-global-page {
.about-img {
width: 100%;
height: 30rem;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-image: url(https://cdn.ipadbiz.cn/hager/img/about/g07@2x.png);
}
.about-box {
background-color: #F7F7F7;
position: relative; /* 父容器设置为相对定位 */
padding: 2rem;
height: 30rem; /* 让 .about-box 撑满父容器 */
box-sizing: border-box;
.title {
font-weight: bold;
.c {
font-size: 2rem;
color: @secondary-color;
}
.e {
font-size: 1.5rem;
color: @primary-color;
}
}
.introduce {
line-height: 1.75;
margin-top: 1rem;
}
}
.about-content {
padding: 0 2rem 2rem;
p {
line-height: 2;
margin-bottom: 1.5rem;
}
}
}
</style>
<!--
* @Date: 2024-10-17 11:13:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 11:27:27
* @FilePath: /hager/src/views/about/global.vue
* @Description: 文件描述
-->
<template>
<div class="hager-about-global-page">
<hager-box>
<div v-if="!is_xs" style="margin-top: 1.5rem;">
<el-breadcrumb separator="/">
<el-breadcrumb-item>关于海格</el-breadcrumb-item>
<el-breadcrumb-item>{{ $route.name }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</hager-box>
</div>
</template>
<script>
import mixin from 'common/mixin';
import hagerBox from '@/components/common/hagerBox';
export default {
components: { hagerBox },
mixins: [mixin.init],
data () {
return {
}
},
mounted () {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.hager-about-global-page {
}
</style>
<!--
* @Date: 2024-10-17 09:22:56
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 10:46:59
* @LastEditTime: 2024-10-17 11:26:40
* @FilePath: /hager/src/views/about/index.vue
* @Description: 文件描述
-->
......@@ -102,7 +102,11 @@ export default {
},
methods: {
goTo (path) {
this.$router.push({
path,
});
}
}
}
</script>
......
<!--
* @Date: 2024-10-17 11:13:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-17 11:27:27
* @FilePath: /hager/src/views/about/global.vue
* @Description: 文件描述
-->
<template>
<div class="hager-about-global-page">
<hager-box>
<div v-if="!is_xs" style="margin-top: 1.5rem;">
<el-breadcrumb separator="/">
<el-breadcrumb-item>关于海格</el-breadcrumb-item>
<el-breadcrumb-item>{{ $route.name }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</hager-box>
</div>
</template>
<script>
import mixin from 'common/mixin';
import hagerBox from '@/components/common/hagerBox';
export default {
components: { hagerBox },
mixins: [mixin.init],
data () {
return {
}
},
mounted () {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.hager-about-global-page {
}
</style>
<!--
* @Date: 2024-08-27 10:06:30
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-10-16 17:41:25
* @LastEditTime: 2024-10-17 11:12:56
* @FilePath: /hager/src/views/index.vue
* @Description: 文件描述
-->
......