|
|
@@ -0,0 +1,169 @@
|
|
|
+<template>
|
|
|
+ <div id="index">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" class="top">
|
|
|
+ <top></top>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="logo">
|
|
|
+ <div class="w_1200">
|
|
|
+ <logo></logo>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="menu">
|
|
|
+ <div class="w_1200">
|
|
|
+ <menuInfo></menuInfo>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="main">
|
|
|
+ <div class="w_1200">
|
|
|
+ <el-col :span="12" class="map">
|
|
|
+ 创新地图
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12" class="zixun">
|
|
|
+ 最新资讯
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="15" class="aoliao">
|
|
|
+ <el-col :span="24" class="notification">
|
|
|
+ <el-col :span="12" class="notice">通知公告</el-col>
|
|
|
+ <el-col :span="12" class="law">政策法规</el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="dian">
|
|
|
+ 图标
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="9" class="xinpin">
|
|
|
+ 新品发布，创新服务
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="link">
|
|
|
+ 友情链接
|
|
|
+ </el-col>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="foot">
|
|
|
+ <div class="w_1200">
|
|
|
+ <foot></foot>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import top from '@/layout/index/top.vue';
|
|
|
+import logo from '@/layout/index/logo.vue';
|
|
|
+import menuInfo from '@/layout/index/menuInfo.vue';
|
|
|
+import foot from '@/layout/index/foot.vue';
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'index',
|
|
|
+ props: {},
|
|
|
+ components: {
|
|
|
+ top, //头部
|
|
|
+ logo, //logo
|
|
|
+ menuInfo, //导航
|
|
|
+ foot, //底部
|
|
|
+ },
|
|
|
+ data: () => ({}),
|
|
|
+ created() {},
|
|
|
+ computed: {},
|
|
|
+ methods: {},
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+.w_1200 {
|
|
|
+ width: 1200px;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+.top {
|
|
|
+ height: 40px;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: rgba(11, 58, 125, 0.8);
|
|
|
+}
|
|
|
+.logo {
|
|
|
+ height: 200px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.menu {
|
|
|
+ height: 70px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.main {
|
|
|
+ height: 1000px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+.main .map {
|
|
|
+ float: left;
|
|
|
+ width: 590px;
|
|
|
+ height: 360px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0 10px 10px 0;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.main .zixun {
|
|
|
+ float: left;
|
|
|
+ width: 600px;
|
|
|
+ height: 360px;
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.main .aoliao {
|
|
|
+ float: left;
|
|
|
+ width: 810px;
|
|
|
+ height: 480px;
|
|
|
+ margin: 0 10px 10px 0;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.main .aoliao .notification {
|
|
|
+ float: left;
|
|
|
+ width: 810px;
|
|
|
+ height: 310px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0 10px 10px 0;
|
|
|
+}
|
|
|
+.main .aoliao .notification .notice {
|
|
|
+ float: left;
|
|
|
+ width: 400px;
|
|
|
+ height: 310px;
|
|
|
+ margin: 0 10px 0 0;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.main .aoliao .notification .law {
|
|
|
+ float: left;
|
|
|
+ width: 400px;
|
|
|
+ height: 310px;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.main .aoliao .dian {
|
|
|
+ float: left;
|
|
|
+ width: 100%;
|
|
|
+ height: 160px;
|
|
|
+ background: #fff;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.main .xinpin {
|
|
|
+ float: left;
|
|
|
+ width: 380px;
|
|
|
+ height: 480px;
|
|
|
+ overflow: hidden;
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.main .link {
|
|
|
+ float: left;
|
|
|
+ width: 100%;
|
|
|
+ height: 140px;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+.foot {
|
|
|
+ float: left;
|
|
|
+ width: 100%;
|
|
|
+ height: 120px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+</style>
|
