Compare commits
4 Commits
3fbdb7830e
...
ffdec4455e
| Author | SHA1 | Date |
|---|---|---|
邓洁
|
ffdec4455e | |
|
邓洁
|
bdc8d87bb3 | |
|
邓洁
|
268e16a471 | |
odjbin
|
ac359d2667 |
|
|
@ -5,7 +5,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title>西南交通大学 保卫处</title>
|
||||
<title>艺鹏瓷砖|广东祥睿陶瓷有限公司</title>
|
||||
<script>
|
||||
fnResize();
|
||||
window.onresize = function() {
|
||||
|
|
|
|||
27
src/App.vue
27
src/App.vue
|
|
@ -3,7 +3,7 @@
|
|||
<div>
|
||||
<Header></Header>
|
||||
</div>
|
||||
<div>
|
||||
<div style="flex: 1;">
|
||||
<router-view/>
|
||||
</div>
|
||||
<div>
|
||||
|
|
@ -28,5 +28,28 @@ export default {
|
|||
},
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
<style lang="scss">
|
||||
#app{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
*{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
a{
|
||||
width: 100%;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
}
|
||||
li{
|
||||
list-style: none;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 86 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
|
|
@ -1,15 +1,197 @@
|
|||
<template>
|
||||
<div>
|
||||
脚
|
||||
<div class="footer_bg">
|
||||
<el-row type="flex" class="up_footer">
|
||||
<el-col :span="4">
|
||||
</el-col>
|
||||
<el-col :span="16">
|
||||
<div class="up_left">
|
||||
<el-image
|
||||
style="margin-bottom: 15px"
|
||||
:src="require('@/assets/footer/elogo.png')"></el-image>
|
||||
<div>
|
||||
广东祥睿陶瓷有限公司
|
||||
</div>
|
||||
</div>
|
||||
<div class="up_middle">
|
||||
<ul>
|
||||
<li v-for="(footerItem,footerIndex) in footerList" :key="footerIndex">
|
||||
<a>{{ footerItem.title }}</a>
|
||||
<div class="item" v-for="(footerItems,footerItemsIndex) in footerItem.items" :key="footerItemsIndex">
|
||||
<a>{{ footerItems.name }}</a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="up_right">
|
||||
<el-image
|
||||
style="width: 100px; height: 100px"
|
||||
:src="require('@/assets/footer/qr.jpg')"></el-image>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" class="down_footer">
|
||||
<el-col :span="3">
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<div>
|
||||
版权所有©广东祥睿陶瓷有限公司 2018-2019 未经本网书面授权，请勿转载、摘编或建立镜像，否则视为侵权。
|
||||
</div>
|
||||
<div>
|
||||
地址：佛山市禅城区华夏陶瓷博览城陶博会展三环路5座B3 技术支持：弈天网络
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "index"
|
||||
name: "index",
|
||||
data() {
|
||||
return {
|
||||
footerList: [
|
||||
{
|
||||
title: '关于我们',
|
||||
items: [
|
||||
{
|
||||
name: '企业简介'
|
||||
},
|
||||
{
|
||||
name: '品牌文化'
|
||||
},
|
||||
{
|
||||
name: '企业观点'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '新闻资讯',
|
||||
items: [
|
||||
{
|
||||
name: '公司新闻'
|
||||
},
|
||||
{
|
||||
name: '行业动态'
|
||||
},
|
||||
{
|
||||
name: '瓷砖百科'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '形象展示',
|
||||
items: [
|
||||
{
|
||||
name: '资质荣誉'
|
||||
},
|
||||
{
|
||||
name: '工程案例'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '招商加盟',
|
||||
items: [
|
||||
{
|
||||
name: '支持策略'
|
||||
},
|
||||
{
|
||||
name: '加盟条件'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: '联系我们',
|
||||
items: [
|
||||
{
|
||||
name: '联系方式'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
.footer_bg {
|
||||
height: 276px;
|
||||
width: 100%;
|
||||
background-color: #111;
|
||||
color: #fff;
|
||||
|
||||
.up_footer {
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
float: left;
|
||||
padding: 50px 0 50px;
|
||||
font-size: 12px;
|
||||
|
||||
.up_left {
|
||||
float: left;
|
||||
margin-right: 15px;
|
||||
|
||||
> div {
|
||||
font-size: 14px;
|
||||
clear: both;
|
||||
width: 251px;
|
||||
line-height: 36px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
background-color: #111;
|
||||
}
|
||||
}
|
||||
|
||||
.up_middle {
|
||||
ul {
|
||||
float: left;
|
||||
|
||||
li {
|
||||
color: #eee;
|
||||
display: inline;
|
||||
float: left;
|
||||
padding: 0 40px 0 40px;
|
||||
border-right: 1px solid #444;
|
||||
font-size: 14px;
|
||||
|
||||
> a {
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
> a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.item {
|
||||
color: #aaa;
|
||||
font-size: 13px;
|
||||
> a {
|
||||
line-height: 24px;
|
||||
}
|
||||
> a:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.up_right {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.down_footer {
|
||||
color: #aaa;
|
||||
width: 100%;
|
||||
float: left;
|
||||
padding: 12px 0;
|
||||
font-size: 12px;
|
||||
border-top: 1px solid #333;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,264 @@
|
|||
<template>
|
||||
<div>
|
||||
头部5464654646
|
||||
<div class="header_bg">
|
||||
<el-row type="flex" class="up_header">
|
||||
<el-col :span="4">
|
||||
</el-col>
|
||||
<el-col :span="16" style="z-index: 400;">
|
||||
<span class="up_left">
|
||||
艺鹏瓷砖 —— 拒绝千篇一律，艺术无处不在
|
||||
</span>
|
||||
<span class="up_right">
|
||||
广东祥睿陶瓷有限公司
|
||||
</span>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" class="down_header">
|
||||
<el-col :span="4">
|
||||
</el-col>
|
||||
<el-col :span="16">
|
||||
<div class="down_left">
|
||||
<a href="/">
|
||||
<el-image
|
||||
:src="require('@/assets/header/logo.png')"></el-image>
|
||||
</a>
|
||||
</div>
|
||||
<div class="down_right">
|
||||
<ul>
|
||||
<li v-for="(item,index) in navList" :key="index" class="nav">
|
||||
<a :href="item.href" class="nav_item">
|
||||
{{ item.title }}
|
||||
</a>
|
||||
<ul class="subNav" v-if="item.children">
|
||||
<li v-for="(childrenItem,childrenIndex) in item.children" :key="childrenIndex">
|
||||
<a :href="childrenItem.href">
|
||||
{{ childrenItem.title }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "index"
|
||||
name: "index",
|
||||
data() {
|
||||
return {
|
||||
navList: [
|
||||
{
|
||||
href: '',
|
||||
title: '网站首页',
|
||||
},
|
||||
{
|
||||
href: '',
|
||||
title: '关于我们',
|
||||
children:[
|
||||
{
|
||||
href: '',
|
||||
title:'企业简介'
|
||||
},
|
||||
{
|
||||
href: '',
|
||||
title:'品牌文化'
|
||||
},{
|
||||
href: '',
|
||||
title:'企业观点'
|
||||
},{
|
||||
href: '',
|
||||
title:'企业文化'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
href: '',
|
||||
title: '产品中心',
|
||||
children:[
|
||||
{
|
||||
href: '',
|
||||
title:'瓷抛大理石'
|
||||
},
|
||||
{
|
||||
href: '',
|
||||
title:'通体大理石'
|
||||
},{
|
||||
href: '',
|
||||
title:'中板通体大理石'
|
||||
},{
|
||||
href: '',
|
||||
title:'大板通体大理石'
|
||||
},{
|
||||
href: '',
|
||||
title:'银河系大板'
|
||||
},{
|
||||
href: '',
|
||||
title:'仿古砖600x600'
|
||||
},{
|
||||
href: '',
|
||||
title:'金刚大理石'
|
||||
},{
|
||||
href: '',
|
||||
title:'岩板'
|
||||
},{
|
||||
href: '',
|
||||
title:'微水泥'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
href: '',
|
||||
title: '新闻资讯',
|
||||
children:[
|
||||
{
|
||||
href: '',
|
||||
title:'公司新闻'
|
||||
},
|
||||
{
|
||||
href: '',
|
||||
title:'行业动态'
|
||||
},{
|
||||
href: '',
|
||||
title:'瓷砖百科'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
href: '',
|
||||
title: '形象展示',
|
||||
children:[
|
||||
{
|
||||
href: '',
|
||||
title:'资质荣誉'
|
||||
},
|
||||
{
|
||||
href: '',
|
||||
title:'工程案例'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
href: '',
|
||||
title: '招商加盟',
|
||||
children: [
|
||||
{
|
||||
href: '',
|
||||
title:'支持策略'
|
||||
},
|
||||
{
|
||||
href: '',
|
||||
title:'加盟条件'
|
||||
},
|
||||
]
|
||||
}, {
|
||||
href: '',
|
||||
title: '联系我们'
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.header_bg {
|
||||
height: 130px;
|
||||
width: 100%;
|
||||
background-color: #111;
|
||||
color: #fff;
|
||||
|
||||
.up_header {
|
||||
border-bottom: 1px solid #333;
|
||||
height: 36px;
|
||||
|
||||
.up_left {
|
||||
color: #fff;
|
||||
display: inline;
|
||||
line-height: 36px;
|
||||
float: left;
|
||||
margin-left: 90px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.up_right {
|
||||
color: #ccc;
|
||||
display: inline;
|
||||
float: right;
|
||||
line-height: 35px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.down_header {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
float: left;
|
||||
padding: 4px 0;
|
||||
z-index: 30;
|
||||
|
||||
.down_left {
|
||||
position: absolute;
|
||||
top: -30px;
|
||||
float: left;
|
||||
|
||||
> a:hover:after {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.down_right {
|
||||
position: relative;
|
||||
float: right;
|
||||
|
||||
>ul {
|
||||
display: inline;
|
||||
float: left;
|
||||
|
||||
>.nav {
|
||||
position: relative;
|
||||
display: inline;
|
||||
width: 100px;
|
||||
float: left;
|
||||
|
||||
> .nav_item {
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
height: 85px;
|
||||
line-height: 85px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.nav_item:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.subNav{
|
||||
display: none;
|
||||
width: 100px;
|
||||
background-color: #000;
|
||||
padding: 12px 0;
|
||||
>li{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
>a{
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
}
|
||||
>a:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
>.nav:hover {
|
||||
.subNav{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,7 @@
|
|||
<template>
|
||||
<div>首页</div>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue