task#13641,在调度app的对账初，加一个“查看结算单”按钮

src/views/workOrder/settlementDetail.vue

@@ -0,0 +1,163 @@
+<template>
+<div class="wrap">
+  <div class="navBar">
+    <van-nav-bar
+        title="结算单详情"
+        left-arrow
+        left-arrow-color="#FFFFFF"
+        :border="false"
+        :fixed="true"
+        :safe-area-inset-top="true"
+        @click-left="goback"
+    />
+  </div>
+  <div class="baseInfo common">
+    <div class="title">结算单:</div>
+    <div class="line"></div>
+    <div class="item">
+      <span class="titleLeft">起步价：&nbsp;&nbsp;&nbsp;&nbsp;</span>
+      <span class="content">{{orderInfo.startPrice}}</span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">包含公里数：</span>
+      <span class="content" >{{ orderInfo.containMileage }}</span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">每公里单价：</span>
+      <span class="content" >{{ orderInfo.unitPrice }}</span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">基本总费用：</span>
+      <span class="content" >{{ orderInfo.supplierBasePrice }}</span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">路桥费：</span>
+      <span class="content">{{orderInfo.supplierBridgeAmountAb + '+' + orderInfo.supplierBridgeAmountBc + '+' + orderInfo.supplierBridgeAmountCa}} </span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">等候费：</span>
+      <span class="content">{{orderInfo.supplierWaitAmount}} </span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">辅助轮费：</span>
+      <span class="content">{{orderInfo.supplierTyreAmount}} </span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">困境费：</span>
+      <span class="content">{{orderInfo.supplierDilemmaAmount}} </span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">其他费用：</span>
+      <span class="content">{{orderInfo. supplierOtherAmount}} </span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">额外费用总计：</span>
+      <span class="content">{{orderInfo.supplierExtraPrice}} </span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">费用总计：</span>
+      <span class="content">{{orderInfo.supplierSettleAmount}}</span>
+    </div>
+    <div class="item">
+      <span class="titleLeft">出发段+背车段+回城段公里数：</span>
+      <span class="content">{{orderInfo.supplierSettleMileageAb + '+' + orderInfo.supplierSettleMileageBc + '+' + orderInfo.supplierSettleMileageCa}} </span>
+    </div>
+  </div>
+
+</div>
+</template>
+
+<script>
+import {myMixins} from "@/utils/myMixins"
+import {getAccountRecordDetail} from "@/api/mine"
+export default {
+  name: "settlementDetail",
+  mixins:[myMixins],
+  data(){
+    return{
+      id:'',
+      postfix:'',
+      orderInfo:{},
+      index:"",
+      queryTime:'',//记录工单对账选择的时间
+    }
+  },
+  async mounted() {
+    this.id=this.$route.params?.id;
+    this.postfix=this.$route.params?.postfix;
+    this.index=this.$route.params?.index;
+    this.queryTime = this.$route.params?.queryTime
+    await this.getDetail()
+  },
+  methods: {
+    goback(){
+      this.$router.push({
+        name:"accountingView",
+        params:{
+          id: this.id,                  // 参数对象的属性
+          postfix:this.postfix,
+          activeIndex:this.index,
+          queryTime:this.queryTime
+        }
+      })
+    },
+    async getDetail(){
+      let res= await getAccountRecordDetail({
+        id:this.id,
+        postfix:this.postfix
+      })
+      if(res.code === 200){
+        this.orderInfo=res.data
+        console.log(" this.orderInfo", this.orderInfo)
+      }
+    },
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import "@/styles/mixin.scss";
+@import "@/styles/common.scss";
+.wrap{
+  @include wh(100%,100%);
+  background-color: #F4F5F7;
+  overflow-y: auto;
+}
+.navBar{
+  margin-bottom: 46px;
+}
+.title{
+  @include fontWeightSize(bold,14px);
+  @include colorOpa(#323643,0.66);
+}
+.line{
+  @include wh(100%,2px);
+  opacity: 0.16;
+  border-top: 1px solid;
+  margin-top: 7px;
+  border-image: linear-gradient(270deg, rgba(217, 217, 217, 0.6), rgba(178, 178, 178, 1), rgba(178, 178, 178, 1), rgba(217, 217, 217, 0.6)) 1 1;
+}
+.item{
+  @include flexCenter;
+  font-size: 12px !important;
+  font-weight: 400 !important;
+  .titleLeft{
+    opacity: .5;
+    line-height: 27px;
+  }
+}
+img{
+  @include wh(35px,15px);
+  margin-left: 21px;
+}
+.common{
+  background-color: #FFFFFF;
+  padding: 11px 24px 14px;
+  box-sizing: border-box;
+  margin-bottom: 10px;
+}
+.baseInfo{
+  @include wh(100%,100%);
+
+}
+</style>