global.vue
5.86 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
<!--
* @Date: 2024-10-17 11:13:44
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2024-11-06 16:08:30
* @FilePath: /hager/src/views/about/global.vue
* @Description: 文件描述
-->
<template>
<div class="hager-about-global-page">
<hager-box>
<div style="margin-top: 1.5rem;">
<el-breadcrumb separator="/">
<el-breadcrumb-item :to="{ path: '/about' }">关于海格</el-breadcrumb-item>
<el-breadcrumb-item>{{ $route.name }}</el-breadcrumb-item>
</el-breadcrumb>
</div>
</hager-box>
<hager-box v-if="!is_xs">
<el-row style="margin: 3rem 0;">
<el-col :span="8">
<div class="about-box-wrapper">
<div class="about-box">
<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="16">
<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 v-else>
<div class="about-img xs"></div>
<div class="about-box-wrapper xs">
<div class="about-box xs">
<div class="title">
<p class="c xs">海格全球</p>
<p class="e xs">Hager Group</p>
</div>
<div class="introduce" v-clamp="3">海格集团是全球领先的电气及智能化解决方案和服务提供商，应用领域涵盖住宅、商业建筑、公共建筑和工业。</div>
</div>
</div>
<div class="about-content xs">
<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>
</div>
</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/g071@2x.png);
&.xs {
height: 15rem;
margin-top: 1rem;
}
}
.about-box-wrapper {
background-color: #F7F7F7;
position: relative; /* 父容器设置为相对定位 */
padding: 2rem;
height: 30rem; /* 让 .about-box 撑满父容器 */
box-sizing: border-box;
&.xs {
height: auto;
padding: 2rem;
background-color: #FFF;
}
.about-box {
top: 50%;
transform: translateY(50%);
&.xs {
transform: none;
}
}
.title {
font-weight: bold;
.c {
font-size: 2rem;
color: @secondary-color;
&.xs {
font-size: 1.5rem;
}
}
.e {
font-size: 1.5rem;
color: @primary-color;
&.xs {
font-size: 1.1rem;
}
}
}
.introduce {
line-height: 1.75;
margin-top: 1rem;
}
}
.about-content {
padding: 0 2rem 2rem;
&.xs {
background-color: #F7F7F7;
padding-top: 2rem;
}
p {
line-height: 2;
margin-bottom: 1.5rem;
}
}
}
</style>