diff --git a/src/assets/img/sectionbig.svg b/src/assets/img/sectionbig.svg
new file mode 100644
index 0000000..879a26e
--- /dev/null
+++ b/src/assets/img/sectionbig.svg
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="-340 -89.7 653.5 219.7" style="enable-background:new -340 -89.7 653.5 219.7;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#2391FA;stroke-miterlimit:10;}
+	.st1{opacity:0.8;fill:#2391FA;enable-background:new    ;}
+	.st2{fill:#2391FA;}
+	.st3{display:none;opacity:0.2;fill:url(#XMLID_4_);enable-background:new    ;}
+	.st4{display:none;opacity:0.2;fill:url(#XMLID_5_);enable-background:new    ;}
+</style>
+<path id="XMLID_11_" class="st0" d="M-339.5-89.2H297l16,16V114l-15.8,15.5h-620.7l-16-15.1V-89.2z"/>
+<path id="XMLID_2_" class="st1" d="M312.5,117.5v3l-9,9h-3L312.5,117.5z"/>
+<path id="XMLID_1_" class="st2" d="M310.5-86.8h-8l8,8"/>
+<linearGradient id="XMLID_4_" gradientUnits="userSpaceOnUse" x1="-338.9" y1="114.4" x2="-31.5667" y2="114.4" gradientTransform="matrix(1 0 0 -1 0 40.6)">
+	<stop  offset="0" style="stop-color:#3E9AF1"/>
+	<stop  offset="0.6139" style="stop-color:#3E9AF1;stop-opacity:0.2862"/>
+	<stop  offset="1" style="stop-color:#3E9AF1;stop-opacity:0"/>
+</linearGradient>
+<path id="XMLID_7_" class="st3" d="M-338.9-88.8h303v30h-303V-88.8z"/>
+<path id="XMLID_9_" class="st2" d="M-338.9-89.2h4v4h-4C-338.9-85.2-338.9-89.2-338.9-89.2z"/>
+<linearGradient id="XMLID_5_" gradientUnits="userSpaceOnUse" x1="-13.5" y1="115.3" x2="293.8333" y2="115.3" gradientTransform="matrix(1 0 0 -1 0 40.6)">
+	<stop  offset="0" style="stop-color:#3E9AF1"/>
+	<stop  offset="0.6139" style="stop-color:#3E9AF1;stop-opacity:0.2862"/>
+	<stop  offset="1" style="stop-color:#3E9AF1;stop-opacity:0"/>
+</linearGradient>
+<path id="XMLID_39_" class="st4" d="M-13.5-89.7h303v30h-303V-89.7z"/>
+</svg>
diff --git a/src/views/mainContainer.vue b/src/views/mainContainer.vue
index 32245cb..26f9f6e 100644
--- a/src/views/mainContainer.vue
+++ b/src/views/mainContainer.vue
@@ -8,7 +8,10 @@
       </li>
       <li class="margin0-12">
         <div class="heightper-top"></div>
-        <div class="heightper-bottom"></div>
+        <div class="heightper-bottom">
+          <outsection style="width: 50%;float: left"></outsection>
+          <outsection style="width: 50%;float: left"></outsection>
+        </div>
       </li>
       <li>
         <sfysection class="sectionsmall"></sfysection>
@@ -28,6 +31,8 @@ import youdaopingsection from '../views/youdaopingsection'
 import sfysection from '../views/sfysection'
 import berthsection from '../views/berthsection'
 import newssection from '../views/newssection'
+import outsection from '../views/outsection'
+
 
 export default {
   name: 'mainContainer',
@@ -38,7 +43,8 @@ export default {
     youdaopingsection,
     sfysection,
     berthsection,
-    newssection
+    newssection,
+    outsection
   },
   data() {
     return {
@@ -88,8 +94,9 @@ export default {
 
   .heightper-bottom {
     height: calc((100% - 24px) / 3);
-    background: #f00;
     margin-top: 12px;
+    background: url("../assets/img/sectionsmall.png") no-repeat;
+    background-size: 100% 100%;
   }
 
   .containerwrap > li:nth-of-type(3) {
diff --git a/src/views/outsection.vue b/src/views/outsection.vue
new file mode 100644
index 0000000..fe97f9a
--- /dev/null
+++ b/src/views/outsection.vue
@@ -0,0 +1,53 @@
+<template>
+  <div>
+    <titlesection title="周出场统计"></titlesection>
+    <ul class="flexfm ydp-dz-wrap">
+
+    </ul>
+  </div>
+</template>
+
+<script>
+import titlesection from '../components/titlesection'
+import {fetchList} from '../api/api'
+
+const lineChartData = {
+  newVisitis: {
+    yData: [100, 120, 161],
+    xData: ['正常', '异常', '故障']
+  }
+}
+
+
+export default {
+  name: 'outsection',
+  components: {
+    titlesection
+  },
+  data() {
+    return {
+      lineChartData: lineChartData.newVisitis,
+      dzNum: '23454',
+      ydpNum: '4454'
+    }
+  },
+  created() {
+  },
+  methods: {
+    getList() {
+      fetchList()
+      .then(res => {
+        console.log(res);
+
+      });
+    },
+  }
+}
+</script>
+
+<style lang="scss"  scoped>
+  .ydp-dz-wrap{
+    display: flex;
+
+  }
+</style>