task#10339,司机app路桥费列表获取

src/views/driverCaseList/driverCaseList.vue

@@ -18,38 +18,24 @@
       </div>
     </div>
     <div class="listWrap">
-      <div class="itemWrap" >
+      <div class="itemWrap" v-for="(item,index) in pageList" :key="index">
         <div class="contentWrap" @click="goDetail">
               <div class="line1">
-                <div><span>订单编号:</span><span>PC230626124283</span></div>
+                <div><span>订单编号:</span><span>{{item.userOrderCode}}</span></div>
                 <div class="right">
-                  <img class="commonImg" src="@/assets/waitSubmit.png">
-                  <div class="yelColor">待提交</div>
+                  <img class="commonImg" :src="getStatus(item.state)">
+                  <div :class="getStatusColor(item.state)">{{item.stateStr}}</div>
                   <img class="rightArrImg"  src="@/assets/list_rightArrow.png">
                 </div>
               </div>
-              <div><span>报销金额:</span><span>1238元</span></div>
+              <div><span>报销金额:</span><span>{{item.reimburseAmount}}</span></div>
+              <div v-show="activeIndex == 2"><span>审核备注:</span><span style="color: #FF5D2E">{{item.auditRemark}}</span></div>
+              <div v-show="activeIndex != 0"><span>审核人员:</span><span>{{item.auditUser}}</span></div>
+              <div v-show="activeIndex != 0"><span>审核时间:</span><span>{{item.auditTime}}</span></div>
         </div>
-        <img class="checkImg" @click="isCheck = !isCheck" :src="isCheck ? require('@/assets/baoxiao_check.png') : require('@/assets/baoxiao_uncheck.png')">
+        <img v-show="activeIndex == 0" class="checkImg" @click="toggleSelection(item)" :src="item.isSelected ? require('@/assets/baoxiao_check.png') : require('@/assets/baoxiao_uncheck.png')">
       </div>
-      <div class="itemWrap">
-        <div class="contentWrap">
-          <div class="line1">
-            <div><span>订单编号:</span><span>PC230626124283</span></div>
-            <div class="right">
-              <img class="commonImg" src="@/assets/unpass.png">
-              <div class="oraColor">不通过</div>
-              <img class="rightArrImg"  src="@/assets/list_rightArrow.png">
-            </div>
-          </div>
-          <div><span>报销金额:</span><span>1238元</span></div>
-          <div><span>审核备注:</span><span style="color: #FF5D2E">缺失凭证照片</span></div>
-          <div><span>审核人员:</span><span>张三</span></div>
-          <div><span>审核时间:</span><span>2024-01-24 00:00:00</span></div>
-        </div>
-        <img class="checkImg" @click="isCheck = !isCheck" :src="isCheck ? require('@/assets/baoxiao_check.png') : require('@/assets/baoxiao_uncheck.png')">
-      </div>
-
+      <s v-show="activeIndex == 0"  class="submitBtn" @click="noMultipleClicks(submitHandle)">提交</s>
     </div>
   </div>
 
@@ -57,9 +43,9 @@
 
 <script>
 import {myMixins} from "@/utils/myMixins";
-
+import { waitReimburseList ,submitReimburseBatch,reimbursedList} from '@/api/reimbursementBatch'
 export default {
-  name: "caseList",
+  name: "driverCaseList",
   mixins: [myMixins],
   data(){
     return{
@@ -69,39 +55,103 @@ export default {
       pageNum:1,
       pageSize:10,
       isCheck:false,
+      driverId: 78948,
+      submitData:[],
+      noClick:true,
+      loading:false,
     }
   },
+  mounted() {
+    this.getList()
+  },
   methods:{
+    toggleSelection(item) {
+      item.isSelected = !item.isSelected; // 切换 isSelected 属性的值
+      console.log("item",item)
+    },
+    async submitHandle(){
+      this.pageList.forEach((item)=>{
+        if(item.isSelected){
+          this.submitData.push({...item})
+        }
+      })
+      // try {
+        let res = await submitReimburseBatch({
+          driverId: this.driverId,
+          orderList: [...this.submitData]
+        })
+        console.log("res",res)
+        await this.getList()
+      // }
+    },
     async changeTab(index) {
       this.activeIndex = index
       this.pageNum = 1
       this.pageList = [];
-      if(this.activeIndex === 0){
-        // this.trainingType =1
-      }else{
-        // this.trainingType=2
-      }
-      // await this.getList()
+      await this.getList()
     },
     goDetail(){
 
+    },
+    async getList(){
+      let res=[]
+      if(this.activeIndex==0){
+        res=await waitReimburseList({
+          pageNum:this.pageNum,
+          pageSize:this.pageSize,
+          driverId:this.driverId,
+          type: this.activeIndex+1
+        })
+      }else{
+        res=await reimbursedList({
+          pageNum:this.pageNum,
+          pageSize:this.pageSize,
+          driverId:this.driverId,
+          type: this.activeIndex+1
+        })
+      }
+      this.pageList=res.data
+      if(this.activeIndex==0){
+        this.pageList.forEach(item => {
+          this.$set(item,'isSelected',false)
+        });
+      }
     },
     getStatus(i){
       switch (i){
-        case 1:
+        case 0://待提交
+        case 1://待审核
           return require('@/assets/waitSubmit.png')
-        case 2:
-          return require('@/assets/unpass.png')
-        case 3:
-          return require('@/assets/unSubmit.png')
-        case 4:
-          return require('@/assets/waitDakuan.png')
-        case 5:
+        case 2://审核通过
+        case 7://已打款
           return require('@/assets/dakuan.png')
+        case 3://审核不通过
+          return require('@/assets/unpass.png')
+        case 4://报销失败
+          return require('@/assets/unSubmit.png')
+        case 6://代打款
+          return require('@/assets/waitDakuan.png')
         default:
           return require('@/assets/waitSubmit.png')
       }
     },
+    getStatusColor(i){
+      switch (i){
+        case 0://待提交
+        case 1://待审核
+          return 'yelColor'
+        case 2://审核通过
+        case 6://代打款
+        case 7://已打款
+          return 'greColor'
+        case 3://审核不通过
+          return 'oraColor'
+        case 4://报销失败
+          return 'garyColor'
+        default:
+          return 'yelColor'
+      }
+    },
   }
 }
 </script>
@@ -150,6 +200,7 @@ export default {
   box-sizing: border-box;
   padding: 10px 7px 10px 8px;
   overflow-y: auto;
+  position: relative;
   .itemWrap{
     position: relative;
     width: 100%;
@@ -184,6 +235,16 @@ export default {
     }
   }
 }
+.submitBtn{
+  position: absolute;
+  bottom: 15px;
+  margin:20px 0 10px 6%;
+  border-radius: 4px;
+  text-align: center;
+  @include bgFontColor(#FFFFFF,#333333);
+  @include fontWeightSize(bold,15px);
+  @include whLin(88%,48px);
+}
 .commonImg{
   @include widHeiMar(13px,13px,4px);
 }