首页更新

src/components/index.vue

@@ -6,7 +6,7 @@
       </el-col>
       <el-col :span="24" class="logo">
         <div class="w_1200">
-          <logo></logo>
+          <logo :info="info"></logo>
         </div>
       </el-col>
       <el-col :span="24" class="menu">
@@ -56,7 +56,9 @@ import foot from '@/layout/index/foot.vue';
 
 export default {
   name: 'index',
-  props: {},
+  props: {
+    info: null, //站点信息
+  },
   components: {
     top, //头部
     logo, //logo
@@ -89,7 +91,7 @@ export default {
   overflow: hidden;
 }
 .main {
-  height: 1000px;
+  height: 960px;
   overflow: hidden;
   margin: 10px 0;
 }
@@ -156,7 +158,7 @@ export default {
 .main .link {
   float: left;
   width: 100%;
-  height: 140px;
+  height: 100px;
   overflow: hidden;
   background-color: #fff;
 }

src/layout/index/logo.vue

@@ -1,13 +1,19 @@
 <template>
   <div id="logo">
-    <p>logo</p>
+    <el-row>
+      <el-col :span="24" class="logo">
+        <el-image style="width:690px;height:66px;" :src="info.logo"></el-image>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
 <script>
 export default {
   name: 'logo',
-  props: {},
+  props: {
+    info: null,
+  },
   components: {},
   data: () => ({}),
   created() {},
@@ -16,4 +22,8 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="less" scoped>
+.logo {
+  padding: 65px 0;
+}
+</style>

src/layout/index/menuInfo.vue

@@ -2,7 +2,16 @@
   <div id="menuInfo">
     <el-row>
       <el-col :span="24" class="menu">
-        导航
+        <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect" text-color="#fff">
+          <el-menu-item index="1">网站首页</el-menu-item>
+          <el-menu-item index="2">科技政务</el-menu-item>
+          <el-menu-item index="3">科技政策</el-menu-item>
+          <el-menu-item index="4">科技超市</el-menu-item>
+          <el-menu-item index="5">科技数据</el-menu-item>
+          <el-menu-item index="6">科技服务</el-menu-item>
+          <el-menu-item index="7">科技资源</el-menu-item>
+          <el-menu-item index="8">科技人才</el-menu-item>
+        </el-menu>
       </el-col>
     </el-row>
   </div>
@@ -13,10 +22,16 @@ export default {
   name: 'menuInfo',
   props: {},
   components: {},
-  data: () => ({}),
+  data: () => ({
+    activeIndex: '1',
+  }),
   created() {},
   computed: {},
-  methods: {},
+  methods: {
+    handleSelect(key, keyPath) {
+      console.log(key, keyPath);
+    },
+  },
 };
 </script>
 
@@ -24,6 +39,27 @@ export default {
 .menu {
   height: 70px;
   overflow: hidden;
-  background-color: #ffffff;
+  background-color: rgba(0, 0, 0, 0.4);
+}
+/deep/.el-menu {
+  background-color: rgba(0, 0, 0, 0.4);
+}
+/deep/.el-menu--horizontal > .el-menu-item {
+  height: 70px;
+  line-height: 70px;
+  border-right: 1px solid #ccc;
+  padding: 0 30px;
+  font-size: 22px;
+}
+/deep/.el-menu--horizontal > .el-menu-item:last-child {
+  padding: 0 34px;
+}
+/deep/.el-menu--horizontal > .el-menu-item.is-active {
+  border-bottom: none;
+  color: #fff;
+  background-color: #215299;
+}
+/deep/.el-menu--horizontal > .el-menu-item:hover {
+  background-color: #215299;
 }
 </style>

src/layout/index/top.vue

@@ -3,12 +3,10 @@
     <el-row>
       <el-col :span="24" class="top">
         <div class="w_1200">
-          <el-col :span="12">
-            时间
-          </el-col>
-          <el-col :span="12">
-            按钮
+          <el-col :span="22" class="date">
+            {{ gettime }}
           </el-col>
+          <el-col :span="2" class="btn"> <el-link :underline="false">登录</el-link>|<el-link :underline="false">注册</el-link> </el-col>
         </div>
       </el-col>
     </el-row>
@@ -20,10 +18,26 @@ export default {
   name: 'top',
   props: {},
   components: {},
-  data: () => ({}),
-  created() {},
+  data: () => ({
+    gettime: '',
+  }),
+  created() {
+    this.currentTime();
+  },
   computed: {},
-  methods: {},
+  methods: {
+    currentTime() {
+      setInterval(this.getTime, 500);
+    },
+    getTime: function() {
+      var _this = this;
+      let yy = new Date().getFullYear();
+      let mm = new Date().getMonth() + 1;
+      let dd = new Date().getDate();
+      let day = new Date().getDay();
+      _this.gettime = yy + '-' + mm + '-' + dd + ' ' + '星期' + day;
+    },
+  },
 };
 </script>
 
@@ -32,4 +46,19 @@ export default {
   width: 1200px;
   margin: 0 auto;
 }
+.date {
+  height: 40px;
+  line-height: 40px;
+  color: #fff;
+  font-size: 16px;
+}
+.btn {
+  height: 40px;
+  line-height: 40px;
+  color: #fff;
+}
+.btn .el-link {
+  color: #fff;
+  margin: 0 5px;
+}
 </style>

src/views/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="index">
-    <index-detail></index-detail>
+    <index-detail :info="info"></index-detail>
   </div>
 </template>
 
@@ -12,7 +12,11 @@ export default {
   components: {
     indexDetail,
   },
-  data: () => ({}),
+  data: () => ({
+    info: {
+      logo: require('@/assets/logo.png'),
+    },
+  }),
   created() {},
   computed: {},
   methods: {},