diff --git a/src/assets/icons/svg/inbound.svg b/src/assets/icons/svg/inbound.svg
new file mode 100644
index 0000000..8035213
--- /dev/null
+++ b/src/assets/icons/svg/inbound.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1770191940726" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2273" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M896 597.333333a42.666667 42.666667 0 0 1 42.666667 42.666667v170.666667a128 128 0 0 1-128 128H213.333333a128 128 0 0 1-128-128v-170.666667a42.666667 42.666667 0 1 1 85.333334 0v170.666667a42.666667 42.666667 0 0 0 42.666666 42.666666h597.333334a42.666667 42.666667 0 0 0 42.666666-42.666666v-170.666667a42.666667 42.666667 0 0 1 42.666667-42.666667zM512.853333 85.376a42.666667 42.666667 0 0 1 8.405334 0.981333l1.194666 0.298667a42.325333 42.325333 0 0 1 19.712 11.178667l213.333334 213.333333a42.666667 42.666667 0 1 1-60.330667 60.330667L554.666667 230.997333V640a42.666667 42.666667 0 1 1-85.333334 0V230.997333L328.832 371.498667a42.666667 42.666667 0 1 1-60.330667-60.330667l213.333334-213.333333c2.645333-2.645333 5.632-4.906667 8.874666-6.826667l1.877334-0.981333a42.368 42.368 0 0 1 8.405333-3.242667l2.133333-0.554667 1.408-0.213333A43.178667 43.178667 0 0 1 511.146667 85.333333L512 85.333333l0.853333 0.042667z" p-id="2274" fill="#409EFF"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/svg/outbound.svg b/src/assets/icons/svg/outbound.svg
new file mode 100644
index 0000000..f126782
--- /dev/null
+++ b/src/assets/icons/svg/outbound.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1770191913465" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2064" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M896 597.333333a42.666667 42.666667 0 0 1 42.666667 42.666667v170.666667a128 128 0 0 1-128 128H213.333333a128 128 0 0 1-128-128v-170.666667a42.666667 42.666667 0 1 1 85.333334 0v170.666667a42.666667 42.666667 0 0 0 42.666666 42.666666h597.333334a42.666667 42.666667 0 0 0 42.666666-42.666666v-170.666667a42.666667 42.666667 0 0 1 42.666667-42.666667zM512 85.333333a42.666667 42.666667 0 0 1 42.666667 42.666667v409.002667l140.501333-140.501334a42.666667 42.666667 0 1 1 60.330667 60.330667l-213.333334 213.333333a42.837333 42.837333 0 0 1-17.706666 10.666667l-2.645334 0.64-1.450666 0.341333-1.322667 0.170667A43.008 43.008 0 0 1 512 682.666667c-2.432 0-4.778667-0.298667-7.082667-0.682667-0.426667-0.042667-0.853333-0.085333-1.322666-0.213333l-1.450667-0.298667-2.645333-0.682667a42.496 42.496 0 0 1-17.664-10.624l-213.333334-213.333333a42.666667 42.666667 0 1 1 60.330667-60.330667L469.333333 537.002667V128a42.666667 42.666667 0 0 1 42.666667-42.666667z" p-id="2065" fill="#E6A23C"></path></svg>
\ No newline at end of file
diff --git a/src/assets/images/inbound.png b/src/assets/images/inbound.png
new file mode 100644
index 0000000..ed4f2c8
Binary files /dev/null and b/src/assets/images/inbound.png differ
diff --git a/src/assets/images/outbound.png b/src/assets/images/outbound.png
new file mode 100644
index 0000000..4453b12
Binary files /dev/null and b/src/assets/images/outbound.png differ
diff --git a/src/views/index.vue b/src/views/index.vue
index 9021328..8636680 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,110 +1,61 @@
 <template>
   <div class="dashboard app-container">
     <el-row :gutter="24">
-      <el-col :span="4">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #ec4786, #b955a4)">
-          <div style="font-size: 18px;">月项目数(入库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24">
-              <OfficeBuilding />
-            </el-icon>
-            <div>{{ countObj.monthInCount }}</div>
+      <el-col :span="12">
+        <div class="inOrOutBox" style="background-color: #FDF6E3;">
+          <div class="inOrOutBox_left">
+            <div style="font-size: 20px; font-weight:bold; color:#333333; ">月入库统计</div>
+            <div class="itemBox">
+              <div>
+                <p style="font-size: 14px;color:#606266">项目数 </p>
+                <p style="font-size: 20px; font-weight:500; ">{{ countObj.monthInCount }} </p>
+              </div>
+              <div>
+                <p style="font-size: 14px;color:#606266 ">条目数 </p>
+                <p style="font-size: 20px;font-weight:500;">{{ countObj.monthInProjectCount }} </p>
+              </div>
+              <div>
+                <p style="font-size: 14px; color:#606266">总金额 </p>
+                <p style="font-size: 20px; font-weight:500;">{{ countObj.monthInAmount }} </p>
+              </div>
+            </div>
+          </div>
+          <div class="inOrOutBox_icon">
+            <img src="../assets/images/inbound.png" alt="">
           </div>
         </div>
       </el-col>
-      <el-col :span="4">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #865ec0, #5144b4);">
-          <div style="font-size: 18px;">月条目数(入库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24">
-              <OfficeBuilding />
-            </el-icon>
-            <div>{{ countObj.monthInProjectCount }}</div>
+
+      <el-col :span="12">
+        <div class="inOrOutBox" style="background-color: #EBF5FF;">
+          <div class="inOrOutBox_left">
+            <div style="font-size: 20px; font-weight:bold;color:#333333 ">月出库统计</div>
+            <div class="itemBox">
+              <div>
+                <p style="font-size: 14px;color:#606266 ">项目数 </p>
+                <p style="font-size: 20px;font-weight:500; ">{{ countObj.monthOutCount }} </p>
+              </div>
+              <div>
+                <p style="font-size: 14px; color:#606266">条目数 </p>
+                <p style="font-size: 20px; font-weight:500;">{{ countObj.monthOutProjectCount }} </p>
+              </div>
+              <div>
+                <p style="font-size: 14px; color:#606266">总金额 </p>
+                <p style="font-size: 20px; font-weight:500;">{{ countObj.monthOutAmount }} </p>
+              </div>
+            </div>
+          </div>
+          <div class="inOrOutBox_icon">
+            <img src="../assets/images/outbound.png" alt="">
+
           </div>
         </div>
       </el-col>
-      <el-col :span="4">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #56cdf3, #719de3);">
-          <div style="font-size: 18px;">月总金额(入库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24">
-              <OfficeBuilding />
-            </el-icon>
-            <div>{{ countObj.monthInAmount }}</div>
-          </div>
-        </div>
-      </el-col>
-      <!-- <el-col :span="3">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #fcbc25, #f68057);">
-          <div style="font-size: 18px;">月总数(入库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24"><OfficeBuilding /></el-icon>
-            <div>{{ countObj.inSummary.totalQty }}</div>
-          </div>
-        </div>
-      </el-col> -->
-      <el-col :span="4">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #ec4786, #b955a4)">
-          <div style="font-size: 18px;">月项目数(出库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24">
-              <OfficeBuilding />
-            </el-icon>
-            <div>{{ countObj.monthOutCount }}</div>
-          </div>
-        </div>
-      </el-col>
-      <el-col :span="4">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #865ec0, #5144b4);">
-          <div style="font-size: 18px;">月条目数(出库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24">
-              <OfficeBuilding />
-            </el-icon>
-            <div>{{ countObj.monthOutProjectCount }}</div>
-          </div>
-        </div>
-      </el-col>
-      <el-col :span="4">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #56cdf3, #719de3);">
-          <div style="font-size: 18px;">月总金额(出库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24">
-              <OfficeBuilding />
-            </el-icon>
-            <div>{{ countObj.monthOutAmount }}</div>
-          </div>
-        </div>
-      </el-col>
-      <!-- <el-col :span="3">
-        <div class="boxNum" style="background: linear-gradient(to right bottom, #fcbc25, #f68057);">
-          <div style="font-size: 18px;">月总数(出库)</div>
-          <div class="boxNum_icon">
-            <el-icon size="24"><OfficeBuilding /></el-icon>
-            <div>{{ countObj.outSummary.totalQty }}</div>
-          </div>
-        </div>
-      </el-col> -->
+
     </el-row>
 
     <el-row :gutter="24" style="margin-top: 20px;">
-      <!-- <el-col :span="6">
-        <div class="main">
-          <div class="titleBox">
-            <div class="line"></div>
-            <div class="name">
-              <div>仓库概览</div>
-            </div>
-          </div>
-          <div class="main_progress" style="margin-top: 35px;">总库位100</div>
-          <el-progress :show-text="false" :stroke-width="20" :percentage="70" />
-          <div class="main_progress">已用库位100</div>
-          <el-progress :show-text="false" :stroke-width="20" :percentage="70" />
-          <div class="main_progress">可用库位100</div>
-          <el-progress :show-text="false" :stroke-width="20" :percentage="70" />
-          
-        </div>
-      </el-col>  -->
+
       <el-col :span="8">
         <div class="main">
           <div class="titleBox">
@@ -291,9 +242,12 @@
             <div class="line"></div>
             <div class="name">
               <div>入库类型统计</div>
-              <el-date-picker v-model="dateInventoryTypeObj" type="daterange" range-separator="至"
-                start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" style="margin: 0 20px;" />
-              <el-button type="primary" @click="getInventoryTypeList">搜索</el-button>
+              <div>
+                <el-date-picker v-model="dateInventoryTypeObj" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" style="margin: 0 20px;" />
+                <el-button type="primary" @click="getInventoryTypeList">搜索</el-button>
+              </div>
+
             </div>
           </div>
           <div class="echartsBox" style="margin-top: 20px;" id="echartsInventoryType"></div>
@@ -305,9 +259,11 @@
             <div class="line"></div>
             <div class="name">
               <div>出库类型统计</div>
-              <el-date-picker v-model="dateOutInventoryTypeObj" type="daterange" range-separator="至"
-                start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" style="margin: 0 20px;" />
-              <el-button type="primary" @click="getOutInventoryTypeList">搜索</el-button>
+              <div>
+                <el-date-picker v-model="dateOutInventoryTypeObj" type="daterange" range-separator="至"
+                  start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD" style="margin: 0 20px;" />
+                <el-button type="primary" @click="getOutInventoryTypeList">搜索</el-button>
+              </div>
             </div>
           </div>
           <div class="echartsBox" style="margin-top: 20px;" id="echartsOutInventoryType"></div>
@@ -1163,6 +1119,34 @@ const getChartInventoryType = (data, id) => {
   background-color: #F5F5F5;
   padding: 32rpx;
 
+  .itemBox {
+    display: flex;
+    justify-content: space-between;
+    margin-top: 8px;
+  }
+
+  .inOrOutBox {
+    padding: 20px;
+    border-radius: 8px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .inOrOutBox_left {
+      width: 60%;
+    }
+
+    .inOrOutBox_icon {
+      img {
+        width: 80px;
+        height: 80px;
+        opacity: 0.3;
+      }
+
+    }
+
+  }
+
   .boxNum {
     height: 100px;
     width: 100%;
@@ -1196,9 +1180,11 @@ const getChartInventoryType = (data, id) => {
     }
 
     .name {
+      width: 100%;
       margin-left: 8px;
       display: flex;
       align-items: center;
+      justify-content: space-between;
       height: 28px;
       font-family: PingFang SC, PingFang SC;
       font-weight: 500;