关于我们固定页

src/components/aboutInfo.vue

@@ -0,0 +1,78 @@
+<template>
+  <div id="aboutInfo">
+    <el-row>
+      <el-col :span="24" class="top">
+        <div class="w_1200">
+          <top :info="info" :Color="Color"></top>
+        </div>
+      </el-col>
+      <el-col :span="24" class="menu">
+        <menuInfo :backColor="backColor"></menuInfo>
+      </el-col>
+      <el-col :span="24" class="main">
+        <div class="w_1200">
+          <about :aboutInfo="aboutInfo"></about>
+        </div>
+      </el-col>
+      <el-col :span="24" class="foot">
+        <foot :info="info" :backColor="backColor"></foot>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/index/top.vue';
+import menuInfo from '@/layout/index/menuInfo.vue';
+import listLeft from '@/layout/list/listLeft.vue';
+import about from '@/layout/detail/about.vue';
+
+import foot from '@/layout/index/foot.vue';
+export default {
+  name: 'aboutInfo',
+  props: {
+    info: null, //头部信息
+    Color: null, //头部电话字体颜色
+    backColor: null, //导航菜单背景颜色
+    aboutInfo: null, //关于我们详细信息
+  },
+  components: {
+    top, //头部
+    menuInfo, //导航
+    foot, //底部信息
+    about, //詳情
+  },
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.top {
+  height: 120px;
+  overflow: hidden;
+}
+.menu {
+  height: 40px;
+  overflow: hidden;
+}
+.main {
+  min-height: 1060px;
+  margin: 30px 0 20px 0;
+  overflow: hidden;
+}
+.mainList {
+  float: right;
+  width: 930px;
+}
+.foot {
+  height: 133px;
+  overflow: hidden;
+}
+</style>

src/components/detail.vue

@@ -71,7 +71,7 @@ export default {
 .main {
   min-height: 1060px;
   margin: 50px 0 0 0;
-  overflow: hiddenpx;
+  overflow: hidden;
 }
 .mainList {
   float: right;

src/components/memberDetail.vue

@@ -80,7 +80,7 @@ export default {
 .main {
   min-height: 1060px;
   margin: 50px 0 0 0;
-  overflow: hiddenpx;
+  overflow: hidden;
 }
 .mainList {
   float: right;

src/layout/detail/about.vue

@@ -0,0 +1,67 @@
+<template>
+  <div id="about">
+    <el-row>
+      <el-col :span="24" class="top">
+        <span>关于我们</span>
+      </el-col>
+      <el-col :span="24" class="info">
+        <p>{{ aboutInfo.content1 }}</p>
+        <p>{{ aboutInfo.content2 }}</p>
+        <p>{{ aboutInfo.content3 }}</p>
+        <p style="text-align: center;color: #000;font-weight: 600;">
+          {{ aboutInfo.content4 }}
+        </p>
+        <p>{{ aboutInfo.content5 }}</p>
+        <p>{{ aboutInfo.content6 }}</p>
+        <p>{{ aboutInfo.content7 }}</p>
+        <p>{{ aboutInfo.content8 }}</p>
+        <p>{{ aboutInfo.content9 }}</p>
+        <p>{{ aboutInfo.content10 }}</p>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'about',
+  props: {
+    aboutInfo: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+p {
+  padding: 0;
+  margin: 0;
+}
+.top {
+  height: 30px;
+  line-height: 30px;
+  padding: 0 50px;
+  margin: 10px 0;
+}
+.top span {
+  display: inline-block;
+  font-size: 20px;
+  background: #0457c7;
+  padding: 0px 15px;
+  color: #fff;
+  border-radius: 20px;
+}
+.info {
+  padding: 0 110px;
+}
+.info p {
+  font-size: 18px;
+  color: #333333;
+  text-indent: 2rem;
+  line-height: 40px;
+}
+</style>

src/router/index.js

@@ -35,5 +35,10 @@ export default new Router({
       name: 'newsList',
       component: () => import('../views/newsList.vue'),
     },
+    {
+      path: '/aboutMe',
+      name: 'aboutMe',
+      component: () => import('../views/aboutMe.vue'),
+    },
   ],
 });