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 http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||||
<title>西南交通大学 保卫处</title>
|
<title>艺鹏瓷砖|广东祥睿陶瓷有限公司</title>
|
||||||
<script>
|
<script>
|
||||||
fnResize();
|
fnResize();
|
||||||
window.onresize = function() {
|
window.onresize = function() {
|
||||||
|
|
|
||||||
27
src/App.vue
27
src/App.vue
|
|
@ -3,7 +3,7 @@
|
||||||
<div>
|
<div>
|
||||||
<Header></Header>
|
<Header></Header>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div style="flex: 1;">
|
||||||
<router-view/>
|
<router-view/>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
|
|
@ -28,5 +28,28 @@ export default {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</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>
|
</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>
|
<template>
|
||||||
|
<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>
|
||||||
|
<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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
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>
|
</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>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,264 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="header_bg">
|
||||||
头部5464654646
|
<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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
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>
|
</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>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div>首页</div>
|
<div>
|
||||||
|
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue