387 lines
11 KiB
Vue
387 lines
11 KiB
Vue
<template>
|
||
<div class="pageHome">
|
||
<el-row class="logo" :gutter="20">
|
||
<el-col class="logoLeft" :span="12">
|
||
<img :src="logoImg" alt="" />
|
||
<span class="logoText">{{ logoText }}</span>
|
||
</el-col>
|
||
<el-col class="logoRight" :span="12">
|
||
<ul class="liList">
|
||
<li v-for="(item, index) in menuList" :key="index" :class="{ active: isActive === index }" @click="menuChange(index)">
|
||
{{ item.name }}
|
||
</li>
|
||
<li>
|
||
<span @click="register" style="color: #fa6e00">注册</span>/
|
||
<span @click="login">登录</span>
|
||
</li>
|
||
</ul>
|
||
</el-col>
|
||
</el-row>
|
||
<!-- 中间图片 -->
|
||
<el-row class="banner">
|
||
<el-col :span="24">
|
||
<div class="image">
|
||
<img src="../../assets/logo/banner.jpg" />
|
||
</div>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<el-row class="content">
|
||
<div class="contentCenter">
|
||
<el-row type="flex" align="middle" class="nav">
|
||
<img src="../../assets/logo/icontront1.png" alt="" />
|
||
<span class="currentPosition">当前位置:</span>
|
||
<span class="home">首页</span>
|
||
<span class="currentMenu">/{{ currentMenu }}</span>
|
||
</el-row>
|
||
<el-row v-if="isActive == 0" class="zixunshoufei">
|
||
<el-row class="title">
|
||
<el-col :span="10" class="titleCol">
|
||
<img src="../../assets/logo/icontfont2.png" alt="" />
|
||
<span class="titleText">产品</span>
|
||
</el-col>
|
||
</el-row>
|
||
<el-row class="con">
|
||
<ul class="zixunUl">
|
||
<li class="zixunLi" v-for="(item, index) in zixunList" :key="index">
|
||
<el-row>
|
||
<el-col :span="12" class="left">
|
||
<span>{{ item.title }}</span>
|
||
<!-- <span>观看次数:{{ item.viewCount }}</span> -->
|
||
</el-col>
|
||
<el-col :span="12" class="right">
|
||
<span class="btn" @click="pay">查看</span>
|
||
</el-col>
|
||
</el-row>
|
||
</li>
|
||
</ul>
|
||
</el-row>
|
||
</el-row>
|
||
<el-row v-if="isActive == 1" class="about">
|
||
<p>
|
||
开元云(北京)科技有限公司,成立于2020年5月,在南京设有研发中心。创始团队核心成员来自一流的云计算公司及电信运营商,拥有云计算、超算、智算和网络运营专业经验。
|
||
</p>
|
||
<p>
|
||
公司致力于打造新一代算力云应用服务新模式，通过自主研发的开元算力云应用服务平台，面向超算、智算提供算力服务，形成“
|
||
算力云+ 算力网络+ 算力应用”的一体化解决方案。
|
||
</p>
|
||
<p>
|
||
公司聚焦算力服务，行业覆盖人工智能、芯片仿真、生物制药、工业仿真、材料研发、精尖制造、海洋勘探、气象监测等高科技领域。
|
||
</p>
|
||
<p>
|
||
公司拥有全国范围内的所有互联网增值服务牌照,能充分发挥公司网络结构优势,以企业互联网提供商为目标,致力于解决企业数字化转型面对的混合IT架构搭建、应用部署、多云管理、成本控制等问题,凭借云网生态创新产品,可以最大化的满足企业客户-云、数据中心-云、数据中心-数据中心的互联需求，能帮助企业快速构建高质量私有网络，实现降本增效，全力与各企业互惠共赢，携手未来！
|
||
</p>
|
||
</el-row>
|
||
<el-row v-if="isActive == 2" class="helpCenter">
|
||
<el-row class="title">
|
||
<el-col :span="10" class="titleCol">
|
||
<img src="../../assets/logo/helpCenter.png" alt="" />
|
||
</el-col>
|
||
</el-row>
|
||
<el-row class="mapBox">
|
||
<el-col :span="12" class="map">
|
||
<span>网站地图/Site map</span>
|
||
</el-col>
|
||
<el-col :span="12" class="map">
|
||
<img src="../../assets/logo/myPostion.png" alt="" />
|
||
</el-col>
|
||
</el-row>
|
||
</el-row>
|
||
</div>
|
||
</el-row>
|
||
<!-- 底部 -->
|
||
<el-row class="footer" style="height: 240px; background-color: #94d1d7; color: white">
|
||
<el-col :span="24" style="line-height: 60px; font-size: 26px">
|
||
联系我们
|
||
</el-col>
|
||
<el-col :span="24" style="line-height: 32px; font-size: 18px">
|
||
公司名称:{{logoText}}
|
||
</el-col>
|
||
<el-col :span="24" style="line-height: 32px; font-size: 18px">
|
||
公司地址: {{address}}
|
||
</el-col>
|
||
<el-col :span="24" style="line-height: 32px; font-size: 18px">
|
||
<a href="http://beian.miit.gov.cn/" target="_blank" title="点击查询备案号">ICP备案号:{{ICP}}</a>
|
||
<span> </span>
|
||
<router-link target="_blank" :to="{ name: 'homePageImage' }">经营性网站备案信息</router-link>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { getLogoAPI } from "@/api/login";
|
||
export default {
|
||
data() {
|
||
return {
|
||
logoImg: require("../../assets/logo/colorLogo.png"),
|
||
logoText: "开元云(北京)科技有限公司",
|
||
optionsViewer: {
|
||
zIndex: 99999,
|
||
inline: true,
|
||
button: false,
|
||
navbar: true,
|
||
title: false,
|
||
toolbar: true,
|
||
tooltip: true,
|
||
movable: true,
|
||
zoomable: true,
|
||
rotatable: true,
|
||
scalable: true,
|
||
transition: true,
|
||
fullscreen: false,
|
||
keyboard: true,
|
||
url: "data-source",
|
||
},
|
||
pics: ["@/src/image/homePage/kyy.jpg"],
|
||
isActive: 0,
|
||
menuList: [
|
||
{
|
||
name: "产品",
|
||
},
|
||
{
|
||
name: "关于我们",
|
||
},
|
||
{
|
||
name: "帮助中心",
|
||
},
|
||
],
|
||
currentMenu: "",
|
||
zixunList: [
|
||
{
|
||
title: "云企业网_跨境(预付费)",
|
||
viewCount: 7215,
|
||
},
|
||
{
|
||
title: "智能语音交互4.0",
|
||
viewCount: 7639,
|
||
},
|
||
{
|
||
title: "QuickBI",
|
||
viewCount: 2697,
|
||
},
|
||
{
|
||
title: "网络点对点专线",
|
||
viewCount: 1582,
|
||
},
|
||
{
|
||
title: "超算底价产品测试",
|
||
viewCount: 9162,
|
||
},
|
||
{
|
||
title: "标准型S6 2核",
|
||
viewCount: 1587,
|
||
},
|
||
{
|
||
title: "标准型S6 16核",
|
||
viewCount: 8125,
|
||
},
|
||
{
|
||
title: "计算型C6 4核",
|
||
viewCount: 8425,
|
||
},
|
||
{
|
||
title: "内存型M6 2核",
|
||
viewCount: 5226,
|
||
},
|
||
{
|
||
title: "高IO型IT5 16核",
|
||
viewCount: 5984,
|
||
},
|
||
{
|
||
title: "GPU计算型GT4 16核",
|
||
viewCount: 2613,
|
||
},
|
||
],
|
||
url: window.location.href,
|
||
ICP:"京ICP备2022001945号-1",
|
||
address:"农业展览馆13号瑞辰国际中心518B(团结湖地铁站c东南口步行420米)",
|
||
photos: [],
|
||
photosUrl: [],
|
||
};
|
||
},
|
||
|
||
created() {
|
||
this.init();
|
||
},
|
||
mounted() { },
|
||
methods: {
|
||
init() {
|
||
getLogoAPI({ url_link: this.GetQueryString(this.url) }).then((res) => {
|
||
if (res.status == true && res.data && res.data.length) {
|
||
this.photosUrl = res.data[0];
|
||
if (this.photosUrl.orgname != '业主机构') {
|
||
this.logoImg = this.photosUrl.logo;
|
||
this.logoText = this.photosUrl.orgname;
|
||
this.ICP = this.photosUrl.license_number;
|
||
this.address = this.photosUrl.address;
|
||
}
|
||
} else {
|
||
this.$message({
|
||
message: res.msg,
|
||
type: "error",
|
||
});
|
||
}
|
||
});
|
||
},
|
||
open() {
|
||
window.open("http://beian.miit.gov.cn/", "miit");
|
||
},
|
||
pay() {
|
||
// this.$router.push('/payPage')
|
||
this.$router.push({ name: "Login" });
|
||
},
|
||
menuChange(index) {
|
||
this.isActive = index;
|
||
},
|
||
register() {
|
||
this.$router.push({ name: "registrationPage" });
|
||
},
|
||
login() {
|
||
this.$router.push({ name: "Login" });
|
||
},
|
||
|
||
GetQueryString(name) {
|
||
if (this.url.indexOf("#") != -1) {
|
||
const params = name.split("#")[0];
|
||
return params;
|
||
}
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.pageHome {
|
||
background-color: #f9f5f5;
|
||
overflow-x: hidden;
|
||
overflow-y: auto;
|
||
height: 100%;
|
||
|
||
.logo {
|
||
padding-left:0.1875rem;
|
||
padding-right: 0.1875rem;
|
||
.logoLeft {
|
||
display: flex;
|
||
flex-direction: row;
|
||
padding-top: 0.25rem;
|
||
img {
|
||
width: 0.625rem;
|
||
height: 0.4375rem;
|
||
margin-right: 20px;
|
||
}
|
||
.logoText {
|
||
font-size: 32px;
|
||
}
|
||
}
|
||
.logoRight {
|
||
.liList {
|
||
li {
|
||
float: left;
|
||
list-style: none;
|
||
border: 1px solid;
|
||
//padding: 5px 20px 5px 20px;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
}
|
||
.active {
|
||
background-color: #94d1d7;
|
||
}
|
||
}
|
||
.banner {
|
||
margin-bottom: 15px;
|
||
.image {
|
||
padding-top: 20px;
|
||
width: 100%;
|
||
// overflow: hidden;
|
||
display: block;
|
||
margin: 0 auto;
|
||
img {
|
||
width: 100%;
|
||
}
|
||
}
|
||
}
|
||
.content {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
|
||
.contentCenter {
|
||
width: 60%;
|
||
.nav {
|
||
border-bottom: 1px solid #ccc;
|
||
.currentPosition {
|
||
}
|
||
.home {
|
||
color: #999;
|
||
}
|
||
}
|
||
|
||
.zixunshoufei {
|
||
.title {
|
||
margin: 10px 0px;
|
||
.titleCol {
|
||
height: 40px;
|
||
border-bottom: 1px solid #ccc;
|
||
display: flex;
|
||
align-items: center;
|
||
.titleText {
|
||
font-size: 16px;
|
||
margin-left: 10px;
|
||
}
|
||
}
|
||
}
|
||
.con {
|
||
.zixunUl {
|
||
margin-top: 0;
|
||
.zixunLi {
|
||
list-style: none;
|
||
height: 30px;
|
||
line-height: 30px;
|
||
font-size: 14px;
|
||
.left {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
}
|
||
.right {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
.btn {
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.about {
|
||
height: 280px;
|
||
margin-top: 20px;
|
||
}
|
||
.helpCenter {
|
||
.title {
|
||
margin: 10px 0px;
|
||
.titleCol {
|
||
height: 40px;
|
||
border-bottom: 1px solid #ccc;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
}
|
||
.mapBox {
|
||
.map {
|
||
// width: 100%;
|
||
height: 430px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.footer {
|
||
padding-left: 20%;
|
||
padding-right: 20%;
|
||
}
|
||
}
|
||
</style>
|