feat(purchaseOrder): 采购订单详情增加统计卡片

src/api/purchasingManage/purchaseOrder.js

@@ -181,4 +181,16 @@ export async function batchCompleted(data) {
     return res.data.data;
   }
   return Promise.reject(new Error(res.data.message));
-}
+}
+
+/**
+
+- 摘要卡片
+  */
+  export async function queryOrderNoCount(code) {
+  const res = await request.get(`/eom/purchaseorder/dataStatistics/${code}`, {});
+  if (res.data.code == 0) {
+  return res.data.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+  }

src/views/purchasingManage/purchaseOrder/components/detailDialog.vue

@@ -13,6 +13,50 @@
     :modal="modal"
     append-to-body
   >
+    <div class="card">
+      <div>
+        <span> 订单数量</span>
+        <span class="value"
+          >{{ orderNoCountData.orderQuantity }}
+          &nbsp;&nbsp;
+        </span>
+      </div>
+      <div>
+        <span> 订单金额</span>
+        <span class="value"
+          >{{ orderNoCountData.orderAmount }}
+          &nbsp;&nbsp;元
+        </span>
+      </div>
+      <div>
+        <span> 收货数量</span>
+        <span class="value"
+          >{{ orderNoCountData.receivedQuantity }}
+          &nbsp;&nbsp;
+        </span>
+      </div>
+      <div>
+        <span> 收货金额</span>
+        <span class="value"
+          >{{ orderNoCountData.receivedAmount }}
+          &nbsp;&nbsp;元
+        </span>
+      </div>
+      <div>
+        <span> 未收数量</span>
+        <span class="value"
+          >{{ orderNoCountData.unReceivedQuantity }}
+          &nbsp;&nbsp;
+        </span>
+      </div>
+      <div>
+        <span> 未收金额</span>
+        <span class="value"
+          >{{ orderNoCountData.unReceivedAmount }}
+          &nbsp;&nbsp;元
+        </span>
+      </div>
+    </div>
     <div class="switch">
       <div class="switch_left">
         <ul>
@@ -514,7 +558,8 @@
 <script>
   import {
     // getpurchaseorderDetail,
-    getpurchaseorderDetail
+    getpurchaseorderDetail,
+    queryOrderNoCount
   } from '@/api/purchasingManage/purchaseOrder';
   import invoiceList from '@/views/purchasingManage/purchaseOrder/orderAssociation/invoiceList.vue';
   import returnGoodsList from '@/views/purchasingManage/purchaseOrder/orderAssociation/returnGoodsList.vue';
@@ -1179,7 +1224,15 @@
             slot: 'remark',
             align: 'center'
           }
-        ]
+        ],
+        orderNoCountData: {
+          orderAmount: '', //订单金额
+          orderQuantity: '', //订单数量
+          receivedQuantity: '', //已货数量
+          unReceivedQuantity: '', //未收货数量
+          receivedAmount: '', //已货金额
+          unReceivedAmount: '', //未收货金额
+        }
       };
     },
     created() {
@@ -1192,6 +1245,7 @@
 
         this.form = row;
         this.visible = true;
+        this.orderNoCountData = await queryOrderNoCount(row.orderNo);
         await this.getDetailData(row.id);
         this.detailId = row.id;
       },
@@ -1261,4 +1315,24 @@
   :deep .divider .content {
     justify-content: flex-start;
   }
+  .card {
+  display: flex;
+  padding: 15px;
+  font-size: 16px;
+  > div {
+    flex: 1;
+    margin: 0px 40px;
+    background: #1890ff;
+    color: #fff;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 12px;
+    border-radius: 10px;
+    .value {
+      margin-top: 8px;
+    }
+  }
+}
 </style>