|
|
@@ -0,0 +1,194 @@
|
|
|
+<template>
|
|
|
+ <div id="index">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" class="style">
|
|
|
+ <el-col :span="24" class="top">
|
|
|
+ <div class="w_1200">
|
|
|
+ <top></top>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="banner">
|
|
|
+ <banner :bannerlist="bannerlist"></banner>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="menu">
|
|
|
+ <menuInfo></menuInfo>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="main">
|
|
|
+ <div class="w_1200">
|
|
|
+ <el-col :span="24" class="mainOne">
|
|
|
+ <mainOne :carouselList="carouselList" :noticeList="noticeList" :newsList="newsList"></mainOne>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="mainTwo">
|
|
|
+ <mainTwo :noticeList1="noticeList1"></mainTwo>
|
|
|
+ </el-col>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="foot">
|
|
|
+ 头部
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import top from '@/layout/index/top.vue';
|
|
|
+import banner from '@/layout/index/banner.vue';
|
|
|
+import menuInfo from '@/layout/index/menuInfo.vue';
|
|
|
+import mainOne from '@/layout/index/mainOne.vue';
|
|
|
+import mainTwo from '@/layout/index/mainTwo.vue';
|
|
|
+import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
+export default {
|
|
|
+ name: 'index',
|
|
|
+ props: {},
|
|
|
+ components: {
|
|
|
+ top,
|
|
|
+ banner,
|
|
|
+ menuInfo,
|
|
|
+ mainOne,
|
|
|
+ mainTwo,
|
|
|
+ },
|
|
|
+ data: function() {
|
|
|
+ return {
|
|
|
+ // banner
|
|
|
+ bannerlist: [
|
|
|
+ {
|
|
|
+ pic: require('@a/banner.png'),
|
|
|
+ },
|
|
|
+ {
|
|
|
+ pic: require('@a/banner.png'),
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ // 轮播
|
|
|
+ carouselList: [
|
|
|
+ {
|
|
|
+ pic: require('@a/lunbo.jpg'),
|
|
|
+ title: '测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ pic: require('@a/lunbo.jpg'),
|
|
|
+ title: '测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ pic: require('@a/lunbo.jpg'),
|
|
|
+ title: '测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ pic: require('@a/lunbo.jpg'),
|
|
|
+ title: '测试标题',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ // 通知公告
|
|
|
+ noticeList: [
|
|
|
+ {
|
|
|
+ title: '8888888测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '888测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ // eslint-disable-next-line vue/no-dupe-keys
|
|
|
+ noticeList1: [
|
|
|
+ {
|
|
|
+ title: '55555555测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '55555555测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '55555555测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '55555555测试标题',
|
|
|
+ date: '2020-10-10',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ // eslint-disable-next-line vue/no-dupe-keys
|
|
|
+ newsList: [
|
|
|
+ {
|
|
|
+ title: '哈哈测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '哈哈测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '哈哈测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '测试标题',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ // eslint-disable-next-line vue/no-dupe-keys
|
|
|
+ newsList1: [
|
|
|
+ {
|
|
|
+ title: '添加标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '添加测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '添加测试标题',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '添加测试标题',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {},
|
|
|
+ methods: {},
|
|
|
+ computed: {
|
|
|
+ ...mapState(['user']),
|
|
|
+ pageTitle() {
|
|
|
+ return `${this.$route.meta.title}`;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ metaInfo() {
|
|
|
+ return { title: this.$route.meta.title };
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+.w_1200 {
|
|
|
+ width: 1200px;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+.style {
|
|
|
+ background-color: #f6f6f6;
|
|
|
+ .top {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ background-color: hsla(0, 0%, 96.1%, 0.31);
|
|
|
+ }
|
|
|
+ // .banner {
|
|
|
+ // border-bottom: 1px solid red;
|
|
|
+ // }
|
|
|
+ // .menu {
|
|
|
+ // border-bottom: 1px solid red;
|
|
|
+ // }
|
|
|
+ .main {
|
|
|
+ margin: 10px 0 0 0;
|
|
|
+ border-bottom: 1px solid red;
|
|
|
+ .mainOne {
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .foot {
|
|
|
+ border-bottom: 1px solid red;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
