From 379d1d83bc515ae1321f1cc1eeb643977391c8a4 Mon Sep 17 00:00:00 2001
From: xiao-fajia <1665375861@qq.com>
Date: Wed, 25 Sep 2024 19:38:46 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/repair/orderinfo/index.js    |   7 ++
 src/views/repair/orderinfo/index.vue | 101 +++++++++++++++++++++------
 2 files changed, 86 insertions(+), 22 deletions(-)

diff --git a/src/api/repair/orderinfo/index.js b/src/api/repair/orderinfo/index.js
index dd1705f..31ac54e 100644
--- a/src/api/repair/orderinfo/index.js
+++ b/src/api/repair/orderinfo/index.js
@@ -61,3 +61,10 @@ export function toPay(params) {
     params
   })
 }
+
+export function getOrderCensus(){
+  return request({
+    url: "/repair/order-info/census",
+    method: "get"
+  })
+}
diff --git a/src/views/repair/orderinfo/index.vue b/src/views/repair/orderinfo/index.vue
index 9fd5140..6843829 100644
--- a/src/views/repair/orderinfo/index.vue
+++ b/src/views/repair/orderinfo/index.vue
@@ -6,10 +6,12 @@
         <el-input v-model="queryParams.orderNo" placeholder="请输入订单号" clearable @keyup.enter.native="handleQuery"/>
       </el-form-item>
       <el-form-item label="服务名称" prop="goodsTitle">
-        <el-input v-model="queryParams.goodsTitle" placeholder="请输入服务名称" clearable @keyup.enter.native="handleQuery"/>
+        <el-input v-model="queryParams.goodsTitle" placeholder="请输入服务名称" clearable
+                  @keyup.enter.native="handleQuery"/>
       </el-form-item>
       <el-form-item label="客户姓名" prop="cusName">
-        <el-input v-model="queryParams.cusName" placeholder="请输入服务名称" clearable @keyup.enter.native="handleQuery"/>
+        <el-input v-model="queryParams.cusName" placeholder="请输入服务名称" clearable
+                  @keyup.enter.native="handleQuery"/>
       </el-form-item>
       <el-form-item label="支付方式" prop="payType">
         <el-select v-model="queryParams.payType" placeholder="请选择支付方式">
@@ -37,7 +39,13 @@
     <el-row :gutter="10" class="mb8">
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"/>
     </el-row>
-
+    <div class="census">
+      <span class="credited">已入账&nbsp;:&nbsp;{{ census?.credited || 0 }}元</span>
+      <span class="notCredited">待入账&nbsp;:&nbsp;{{ census?.notCredited || 0 }}元</span>
+      <span class="onlinePay">线上支付&nbsp;:&nbsp;{{ census?.onlinePay || 0 }}元</span>
+      <span class="cashPay">线下支付&nbsp;:&nbsp;{{ census?.cashPay || 0 }}元</span>
+      <span class="signedPay">签单/挂账&nbsp;:&nbsp;{{ census?.signedPay || 0 }}元</span>
+    </div>
     <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
       <el-table-column label="订单号" align="center" prop="orderNo"/>
       <el-table-column label="服务名称" align="center" prop="goodsTitle"/>
@@ -64,7 +72,7 @@
       </el-table-column>
       <el-table-column label="支付方式" align="center" prop="payType">
         <template v-slot="scope">
-          <dict-tag :type="DICT_TYPE.REPAIR_PAY_TYPE" :value="scope.row.payType" />
+          <dict-tag :type="DICT_TYPE.REPAIR_PAY_TYPE" :value="scope.row.payType"/>
         </template>
       </el-table-column>
       <el-table-column label="订单状态" align="center" prop="orderStatus">
@@ -75,12 +83,13 @@
       </el-table-column>
       <el-table-column label="操作" width="150" align="center" class-name="small-padding fixed-width">
         <template v-slot="scope">
-          <el-button v-if="scope.row.orderStatus === '0'" size="mini" type="text" icon="el-icon-edit" @click="toPay(scope.row)"
+          <el-button v-if="scope.row.orderStatus === '0'" size="mini" type="text" icon="el-icon-edit"
+                     @click="toPay(scope.row)"
                      v-hasPermi="['repair:order-info:update']">支付
           </el-button>
-<!--          <el-button size="mini" type="text" icon="el-icon-edit" @click="openForm(scope.row.id)"-->
-<!--                     v-hasPermi="['repair:order-info:update']">修改-->
-<!--          </el-button>-->
+          <!--          <el-button size="mini" type="text" icon="el-icon-edit" @click="openForm(scope.row.id)"-->
+          <!--                     v-hasPermi="['repair:order-info:update']">修改-->
+          <!--          </el-button>-->
           <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
                      v-hasPermi="['repair:order-info:delete']">删除
           </el-button>
@@ -90,7 +99,7 @@
     <!-- 展示形式：二维码 URL -->
     <el-dialog title="微信扫一扫" :visible.sync="qrCode.visible" width="700px" append-to-body
                :close-on-press-escape="false">
-      <qrcode-vue :value="qrCode.url" size="500" level="L" />
+      <qrcode-vue :value="qrCode.url" size="500" level="L"/>
     </el-dialog>
     <!-- 分页组件 -->
     <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@@ -104,6 +113,8 @@
 import * as OrderInfoApi from '@/api/repair/orderinfo';
 import OrderInfoForm from './OrderInfoForm.vue';
 import QrcodeVue from 'qrcode.vue'
+import {getOrderCensus} from "@/api/repair/orderinfo";
+
 export default {
   name: "OrderInfo",
   components: {
@@ -117,12 +128,12 @@ export default {
         title: '',
         visible: false,
       },
-      options:[{
-        value:'0',
-        label:'待支付'
-      },{
-        value:'1',
-        label:'已支付'
+      options: [{
+        value: '0',
+        label: '待支付'
+      }, {
+        value: '1',
+        label: '已支付'
       }],
       // 遮罩层
       loading: true,
@@ -149,12 +160,20 @@ export default {
         goodsType: null,
         cusName: null,
         payType: null,
-        orderStatus:null
+        orderStatus: null
       },
+      census: {
+        credited: null,
+        notCredited: null,
+        onlinePay: null,
+        cashPay: null,
+        signedPay: null
+      }
     };
   },
   created() {
     this.getList();
+    this.getCensus()
   },
   methods: {
     /** 查询列表 */
@@ -178,22 +197,22 @@ export default {
       this.resetForm("queryForm");
       this.handleQuery();
     },
-    async toPay(row){
-      if (row.payType == '01'){
+    async toPay(row) {
+      if (row.payType == '01') {
         const orderId = row.id
         let data = {
-          orderId:orderId
+          orderId: orderId
         }
         const res = await OrderInfoApi.toPay(data);
-        console.log(res,208)
+        console.log(res, 208)
         this.qrCode = {
           url: res.data.code_url,
           visible: true
         }
-      } else{
+      } else {
         await this.$modal.confirm('本订单为线下支付订单或挂账订单，点击确定前请确认客户是否已支付')
         let data = {
-          orderNo:row.orderNo,
+          orderNo: row.orderNo,
         }
         await OrderInfoApi.updateOrderInfo(data);
         this.$modal.msgSuccess("支付成功");
@@ -228,6 +247,44 @@ export default {
         this.exportLoading = false;
       }
     },
+    async getCensus() {
+      const res = await getOrderCensus()
+      console.log(res.data)
+      this.census = res.data
+    },
   }
 };
 </script>
+<style scoped lang="scss">
+.census {
+  display: flex;
+  justify-content: right;
+  font-weight: bold;
+  font-size: 16px;
+  margin: 1rem 1rem 1rem 0;
+}
+
+.census > span {
+  padding-left: 3rem;
+}
+
+.credited {
+  color: green;
+}
+
+.notCredited {
+  color: gray;
+}
+
+.onlinePay {
+  color: blue;
+}
+
+.cashPay {
+  color: goldenrod;
+}
+
+.signedPay {
+  color: orange;
+}
+</style>