finish footer

components/pc/pageFooter.vue

 <template>
   <div class="bc-layout-container-footer">
     <div class="footer-center">
-      <div class="footer-center-l">
-
+      <div class="footer-center-section1">
+        <div class="footer-center-section1-left">
+          <span>联系电话：010-6868088</span>
+          <span>官方邮箱：yundingshuyuan@163.com</span>
+        </div>
+        <div class="footer-center-section1-center">
+          <a href="">云顶书院官网</a>
+          <a href="">代码托管平台官网</a>
+        </div>
+        <div class="footer-center-section1-right">
+          <div>
+            <a href="">关于我们</a>
+            <a href="">加入我们</a>
+          </div>
+          <div>
+            <a href="">联系我们</a>
+            <a href="">商务合作</a>
+          </div>
+          <div>
+            <a href="">版权声明</a>
+            <a href="">用户协议</a>
+          </div>
+          <div>
+            <a href="">投诉举报</a>
+            <a href="">意见反馈</a>
+          </div>
+        </div>
+      </div>
+      <div class="footer-center-section2">
+        <p class="footer-center-section2-l">
+          Copyright © 2019 云里云外开源社区 All Rights Reserved · 京ICP备 1234567891号-11
+        </p>
+        <p class="footer-center-section2-r">
+          营业执照 · 网络文化经营许可证
+        </p>
       </div>
     </div>
   </div>
@@ -14,6 +47,71 @@ export default {
 }
 </script>
 
-<style scoped>
-
+<style lang="scss" scoped>
+  .bc-layout-container-footer {
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    background-color: #fff;
+    .footer-center {
+      width: $pageWidth;
+      margin: 0 auto;
+      .footer-center-section1 {
+        height: 188*$length;
+        @extend %flex-row-spb;
+        .footer-center-section1-right {
+          @extend %flex-row-spb;
+          width: 508*$length;
+          div {
+            a {
+              display: block;
+              @include fontStyle(13, 17, 500, #8F9CA0, center);
+              @extend %animate-transition;
+              &:hover{
+                color:#00AAE6;
+              }
+              &:first-child {
+                margin-bottom: 26*$length;
+              }
+            }
+          }
+        }
+        .footer-center-section1-center {
+          a {
+            display: block;
+            @include fontStyle(13, 17, 500, #8F9CA0, start);
+            @extend %animate-transition;
+            &:hover{
+              color:#00AAE6;
+            }
+            &:first-child {
+              margin-bottom: 26*$length;
+            }
+          }
+        }
+        .footer-center-section1-left {
+          @extend %flex-column-spb;
+          align-items: start;
+          span{
+            @include fontStyle(13, 17, 500, #8F9CA0, start);
+            @extend %animate-transition;
+            @extend %cursorPointer;
+            &:hover{
+              color:#00AAE6;
+            }
+            &:first-child {
+              padding-bottom: 26*$length;
+            }
+          }
+        }
+      }
+      .footer-center-section2 {
+        height: 54*$length;
+        border-top: 1px solid #EFEFEF;
+        font-size: 12*$font-size;
+        color: #8F9CA0;
+        @extend %flex-row-spb
+      }
+    }
+  }
 </style>

components/pc/pageHeader.vue

@@ -80,7 +80,7 @@
 <style lang="scss">
   .bc-layout-container-header{
 
-    >.container-header{
+    .container-header{
       position:fixed;
       top:0;
       left:0;

pages/index.vue

@@ -54,7 +54,7 @@ export default {
 <style>
 .container {
   margin: 0 auto;
-  min-height: 100vh;
+  min-height: 300vh;
   display: flex;
   background-color: #fff;
   justify-content: center;