深圳或然科技官网
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

243 lines
7.1 KiB

2 years ago
<template>
<div class="wrap index">
<div class="banner">
<h6>教育数字化产品供应商</h6>
<p class="text">与3000所高校共建数字化教育产业未来</p>
<el-button class="dev"
type="primary"
@click="openDev">登录供应商平台</el-button>
</div>
<!-- 关于教育产业数字化开发者 -->
<div class="about">
<div class="inner">
<div class="text">如果您是从事高职本科市场相应数字化场景的软件硬件研发生产或代理的供应商如果您正面临拓展渠道难精准触达客户难售前支持难按时回款难等发展瓶颈请加入职站商城让您的产品走进全国院校</div>
</div>
</div>
<div class="entry">
</div>
<!-- 我们提供的支持 -->
<div class="sup">
<div class="inner">
<h6 class="i-title">我们提供的支持</h6>
<ul class="list">
<li>
<h6>生产力赋能</h6>
<p class="text">公司打造的产业中台将赋能联盟厂家高效地进行软件产品的开发与交付</p>
</li>
<li>
<h6>渠道与运营服务赋能</h6>
<p class="text">公司会为联盟厂家提供公共的渠道支撑和客户获取帮助厂家获得客户成交降低产品厂家的市场压力</p>
</li>
<li>
<h6>创业技术孵化服务</h6>
<p class="text">对于还在创业阶段的产品创业者我司还提供初始的技术外包支撑服务帮助产品创业者最小成本的完成产品的落地</p>
</li>
</ul>
</div>
</div>
<!-- 开发者需要具备的条件 -->
<div class="con">
<div class="inner">
<h6 class="i-title">开发者需要具备的条件</h6>
<ul class="list">
<li>
<img src="@/assets/images/dev/con1.png"
alt="">
<h6>产品研发</h6>
<p class="text">具备独立设计开发教育产业数字化产品的能力</p>
</li>
<li>
<img src="@/assets/images/dev/con2.png"
alt="">
<h6>产品运维 </h6>
<p class="text">具备独立的产品运维支持的能力</p>
</li>
<li>
<img src="@/assets/images/dev/con3.png"
alt="">
<h6>专业服务</h6>
<p class="text">具备对产品内容专业支持的能力</p>
</li>
</ul>
</div>
</div>
<div class="profit">
<div class="item1">开发者受益</div>
<div class="item2">我们将与开发者共享教育产业数字化蓝海的巨大收益</div>
</div>
<!-- 联系 -->
<div class="contact">
<img class="love"
src="@/assets/images/love.png"
alt="">
</div>
</div>
</template>
<script>
export default {
name: 'cityPartner',
data () {
return {
}
},
mounted () { },
methods: {
openDev () {
window.open('https://dev.huorantech.cn')
}
}
};
</script>
<style lang="scss" scoped>
.wrap {
position: relative;
background-color: #fff;
.banner {
position: relative;
height: 350px;
padding: 100px 0 0 180px;
background: url(../../assets/images/dev/banner2.png) (90% 32px) / auto no-repeat,
url(../../assets/images/dev/banner1.png) 0 0/100% 100% no-repeat;
.dev {
position: absolute;
bottom: 120px;
left: 50%;
transform: translateX(-50%);
text-align: center;
}
h6 {
margin-bottom: 30px;
font-size: 42px;
}
.text {
font-size: 16px;
line-height: 30px;
}
}
.i-title {
position: relative;
margin-bottom: 37px;
font-size: 30px;
text-align: center;
color: #0b1d30;
}
.inner {
width: 1200px;
padding: 67px 0;
margin: 0 auto;
}
.about {
position: relative;
margin: -60px 0 20px;
.inner {
padding: 40px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0px 5px 20px 0px rgba(98, 117, 163, 0.08);
}
h6 {
margin-bottom: 20px;
font-size: 24px;
color: #0b1d30;
}
.text {
font-size: 14px;
line-height: 1.8;
color: #0b1d30;
}
}
.sup {
background: linear-gradient(180deg, #ffffff 0%, #f1f6fe 100%);
.list {
display: flex;
justify-content: space-between;
li {
width: 33%;
padding: 140px 50px 50px;
background: url(../../assets/images/dev/sup1.png) 0 0/100% 100% no-repeat;
&:nth-child(2) {
background-image: url(../../assets/images/dev/sup2.png);
}
&:last-child {
margin-right: 0;
background-image: url(../../assets/images/dev/sup3.png);
}
}
h6 {
margin: 15px 0 10px;
font-size: 18px;
color: #0b1d30;
}
.text {
font-size: 14px;
color: #757f92;
}
}
}
.con {
background: url(../../assets/images/dev/con-bg.png) 0 0/100% 100% no-repeat;
.list {
display: flex;
flex: 1;
li {
padding-bottom: 40px;
margin-right: 24px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0px 5px 20px 0px rgba(98, 117, 163, 0.08);
&:last-child {
margin-right: 0;
}
}
img {
width: 100%;
}
h6 {
margin: 15px 24px 10px;
font-size: 18px;
color: #0b1d30;
}
.text {
margin: 0 24px;
font-size: 14px;
color: #757f92;
}
}
}
.profit {
margin-bottom: 70px;
text-align: center;
.item1 {
line-height: 250px;
font-size: 30px;
color: #fff;
background: url(../../assets/images/dev/profit-bg1.png) 0 0/100% 100% no-repeat;
}
.item2 {
width: 70%;
margin: -100px auto 0;
line-height: 202px;
font-size: 30px;
color: #0b1d30;
background: url(../../assets/images/dev/profit-bg2.png) 0 0/100% 100% no-repeat;
}
}
.contact {
position: relative;
height: 250px;
background: url(../../assets/images/contact-info.png) center center/auto no-repeat,
url(../../assets/images/contact-bg.png) 0 0/100% 100% no-repeat;
.love {
position: absolute;
top: -45px;
right: 10%;
}
}
}
</style>