From c318e667cb29242733c78232e97795d52fa56dd6 Mon Sep 17 00:00:00 2001
From: zx <zhouxinxin0724@163.com>
Date: Thu, 5 Feb 2026 08:30:36 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E6=A0=B7=E5=BC=8F=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/icons/svg/inbound.svg  |   1 +
 src/assets/icons/svg/outbound.svg |   1 +
 src/assets/images/inbound.png     | Bin 0 -> 4405 bytes
 src/assets/images/outbound.png    | Bin 0 -> 4323 bytes
 src/views/index.vue               | 188 ++++++++++++++----------------
 5 files changed, 89 insertions(+), 101 deletions(-)
 create mode 100644 src/assets/icons/svg/inbound.svg
 create mode 100644 src/assets/icons/svg/outbound.svg
 create mode 100644 src/assets/images/inbound.png
 create mode 100644 src/assets/images/outbound.png

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 0000000000000000000000000000000000000000..ed4f2c8c6b7325ff7be558e87ccb5aeb1cc68622
GIT binary patch
literal 4405
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

literal 0
HcmV?d00001

diff --git a/src/assets/images/outbound.png b/src/assets/images/outbound.png
new file mode 100644
index 0000000000000000000000000000000000000000..4453b1281d99dc1fe04713cf2d62c16fd134095d
GIT binary patch
literal 4323
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
L8el7~-3$LeOQ7K>

literal 0
HcmV?d00001

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;