添加app-footer

src/layout/components/AppFooter.vue

+<template>
+  <div class="app_footer">
+    <el-row :gutter="20">
+      <el-col :span="16">
+        <div class="footer-title">
+          友情链接
+        </div>
+        <el-row>
+          <el-col
+            v-for="(item,index) in linkList"
+            :key="index"
+            style="padding: 0 0 10px 0"
+            :span="8"
+          >
+            <span class="linkName">{{ item.name }}</span>
+          </el-col>
+        </el-row>
+      </el-col>
+      <el-col :span="8">
+        <div class="footer-title">
+          快捷入口
+        </div>
+        <el-row>
+          <el-col
+            v-for="(item,index) in entranceList"
+            :key="index"
+            style="padding: 0 0 10px 0"
+            :span="12"
+          >
+            <span class="linkName">{{ item.name }}</span>
+          </el-col>
+        </el-row>
+      </el-col>
+    </el-row>
+    <el-divider/>
+    <div class="footer-bottom">
+      <div>copyright 河北省石家庄市工业和信息化局|地址:河北省石家庄市xxxxxx</div>
+      <div style="margin-top: 10px">ICP备案号: 冀ICP备220926218号</div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'AppFooter',
+  data() {
+    return {
+      entranceList: [
+        { name: '政策直达' },
+        { name: '服务共享' },
+        { name: '活动信息' },
+        { name: '一键办事' },
+        { name: '企业诉求' },
+        { name: '工具' }
+      ],
+      linkList: [
+        { name: '石家庄人民政府' },
+        { name: '石家庄产权交易所' },
+        { name: '石家庄市科学技术局' },
+        { name: '石家庄市工业和信息化局' },
+        { name: '石家庄商务信用平台' },
+        { name: '石家庄市行政审批局' },
+        { name: '国家两化融合服务平台' },
+        { name: '石家庄市公共资源交易中心' },
+        { name: '石家庄市政府采购网' },
+        { name: '国家税务局河北省电子税务局' },
+        { name: '石家庄市商务局' }
+      ]
+
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.app_footer {
+  background: #21ADF3 ;;
+  padding: 20px 120px;
+  .el-divider--horizontal{
+    margin: 12px 0;
+  }
+  .footer-title{
+    color: white;
+    padding: 0 0 20px 0;
+  }
+  .linkName{
+    color: white;
+    font-size: 14px;
+  }
+  .footer-bottom{
+    color: white;
+    text-align: center;
+  }
+}
+</style>

src/layout/index.vue

@@ -12,6 +12,7 @@
 <!--        <navbar />-->
 <!--      </div>-->
       <app-main />
+      <app-footer />
     </div>
   </div>
 </template>
@@ -19,10 +20,12 @@
 <script>
 import { Navbar, Sidebar, AppMain, TagsView, Header } from './components'
 import ResizeMixin from './mixin/ResizeHandler'
+import AppFooter from './components/AppFooter'
 
 export default {
   name: 'Layout',
   components: {
+    AppFooter,
     Navbar,
     Sidebar,
     AppMain,