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

src/api/reimbursementBatch.js

@@ -0,0 +1,29 @@
+import request from '@/utils/http'
+
+//待报销列表
+export function waitReimburseList(data) {
+    return request({
+        url: '/driverApp/reimburse/waitReimburseList',
+        method:'POST',
+        contentType: 'application/json',
+        data
+    })
+}
+// 提交报销批次
+export function submitReimburseBatch(data) {
+    return request({
+        url: '/driverApp/reimburse/submitReimburseBatch',
+        method:'POST',
+        contentType: 'application/json',
+        data
+    })
+}
+// 已报销/报销失败列表
+export function reimbursedList(data) {
+    return request({
+        url: '/driverApp/reimburse/reimbursedList',
+        method:'POST',
+        contentType: 'application/json',
+        data
+    })
+}

src/views/caseList/caseDetail.vue

@@ -65,10 +65,10 @@
        </div>
      </div>
      <div class="aduit">
-        <div class="itemWrap">
+        <div class="itemWrap aduitResult">
           <div>
             <span class="star">*</span>
-            <span>二次审核结果</span>
+            <span>{{firstSubmit == 1 ? '审核结果' : '二次审核结果'}}</span>
           </div>
           <div class="isJoin">
             <van-radio-group v-model="states" @change="isUse"  class="joinWrap">
@@ -81,7 +81,7 @@
                 >
               </van-radio>
               <van-radio :name="0" class="item">
-                报销失败
+                {{firstSubmit == 1 ? '不通过' : '报销失败'}}
                 <img
                     slot="icon"
                     slot-scope="props"
@@ -98,16 +98,16 @@
              <span>不通过原因</span>
            </div>
          </div>
-         <select id="mySelect" class="mySelect" v-model="drivingModel"  >
+         <select id="mySelect" class="mySelect" v-model="other" @change="getValue" >
-           <option value="A1">不通过原因1</option>
+           <option value="1">缺失凭证照片</option>
-           <option value="A2">不通过原因2</option>
+           <option value="2">申请金额与凭证不一致</option>
-           <option value="A3">不通过原因3</option>
+           <option value="3">非正常产生路桥费</option>
-           <option value="B1">不通过原因4</option>
+           <option value="4">其他</option>
          </select>
        </div>
-        <div>
+        <div v-show="other == 4">
           <div>其他原因</div>
-          <textarea v-model="supplierRemk" class="multipleTxt" placeholder="描述"></textarea>
+          <textarea v-model="otherReason" class="multipleTxt" placeholder="描述"></textarea>
         </div>
      </div>
       <div class="submitBtn">提交</div>
@@ -129,11 +129,15 @@ export default {
       states:'',
       activeIcon: require('@/assets/check.png'),
       inactiveIcon: require('@/assets/uncheck.png'),
-      supplierRemk:'',
+      otherReason:'',
-      drivingModel:''
+      other:'',
+      firstSubmit:2,
     }
   },
   methods:{
+    getValue(){
+      console.log("other",this.other)
+    },
     isUse(e){
       this.states=e
     },
@@ -260,6 +264,7 @@ export default {
       span:nth-child(2){
         @include fontWeightSize(600,22px);
         color: #FF5D2E;
+        margin: 0 3px 0 9px;
       }
       span:last-child{
         @include fontWeightSize(bold,10px);
@@ -270,7 +275,8 @@ export default {
   .aduit{
     width: 100%;
     background-color: #FFFFFF;
-    height: 201px;
+    //height: 201px;
+    line-height: 37px;
     border-radius: 6px;
     margin-bottom: 15px;
     box-sizing: border-box;
@@ -292,6 +298,13 @@ export default {
       backdrop-filter: blur(10px);
       margin-top: 3px;
     }
+    .aduitResult:after{
+      content: '该案件为二次提交，审核不通过后司机无法再次申请报销。';
+      color: red;
+      position: absolute;
+      line-height: 70px;
+      font-size: 10px;
+    }
   }
   .submitBtn{
     //position: absolute;

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">
+                  <img class="commonImg" :src="getStatus(item.state)">
-                  <div class="yelColor">待提交</div>
+                  <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">
+      <s v-show="activeIndex == 0"  class="submitBtn" @click="noMultipleClicks(submitHandle)">提交</s>
-        <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>
-
     </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){
+      await this.getList()
-        // this.trainingType =1
-      }else{
-        // this.trainingType=2
-      }
-      // 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:
+        case 2://审核通过
-          return require('@/assets/unpass.png')
+        case 7://已打款
-        case 3:
-          return require('@/assets/unSubmit.png')
-        case 4:
-          return require('@/assets/waitDakuan.png')
-        case 5:
           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);
 }