订单查看详情添加 手续费比例 手续费金额展示

src/views/Task/Complete.vue

@@ -251,8 +251,11 @@
         <div style="padding:20px;font-weight:bold;font-size:20px;">
           <span>总保费</span>
           <span style="color:#ff7612;">￥{{ orderInfo.sumpremium }}</span>
+          <span style="padding-left: 20px">总费用</span>
+          <span style="color:#ff7612;" v-if="orderInfo.queryOrderFeeVo">
+            ￥{{orderInfo.queryOrderFeeVo.totalFeePremium?orderInfo.queryOrderFeeVo.totalFeePremium:0 }}</span>
         </div>
-        <div class="headers headers_Custom" style="padding:20px;">
+        <div class="headers headers_Custom">
           <div v-show="orderInfo.jqpremium">
             交强险金额：
             <span>
@@ -260,27 +263,57 @@
                 orderInfo.jqpremium }}
             </span>
           </div>
-          <div v-show="orderInfo.sypremium">
-            商业险金额：
-            <span>￥{{ orderInfo.sypremium }}</span>
+          <div v-if="orderInfo.queryOrderFeeVo&&orderInfo.queryOrderFeeVo.jqCoderFeeVo&&orderInfo.queryOrderFeeVo.jqCoderFeeVo.costsProportion">
+            手续费比例：
+            <span>
+              {{
+                orderInfo.queryOrderFeeVo.jqCoderFeeVo.costsProportion  }}%
+            </span>
+          </div>
+          <div v-if="orderInfo.queryOrderFeeVo&&orderInfo.queryOrderFeeVo.jqCoderFeeVo&&orderInfo.queryOrderFeeVo.jqCoderFeeVo.costsPremiums">
+            手续费金额：
+            <span>
+              ￥{{orderInfo.queryOrderFeeVo.jqCoderFeeVo.costsPremiums }}
+            </span>
           </div>
           <div v-show="orderInfo.taxamount">
             车船税：
             <span>￥{{ orderInfo.taxamount }}</span>
           </div>
-          <div v-if="orderInfo.accidentInfo">
-            驾意险：
-            <span>￥{{ orderInfo.jypremium }}</span>
-          </div>
           <div v-show="orderInfo.jqstartdate">
             交强险起保日期：
             <span>{{ orderInfo.jqstartdate }}</span>
           </div>
+        </div>
+        <div class="headers headers_Custom" >
+          <div v-show="orderInfo.sypremium">
+            商业险金额：
+            <span>￥{{ orderInfo.sypremium }}</span>
+          </div>
+          <div v-if="orderInfo.queryOrderFeeVo&&orderInfo.queryOrderFeeVo.syCoderFeeVo&&orderInfo.queryOrderFeeVo.syCoderFeeVo.costsProportion">
+            手续费比例：
+            <span>
+              {{
+                orderInfo.queryOrderFeeVo.syCoderFeeVo.costsProportion  }}%
+            </span>
+          </div>
+          <div v-if="orderInfo.queryOrderFeeVo&&orderInfo.queryOrderFeeVo.syCoderFeeVo&&orderInfo.queryOrderFeeVo.syCoderFeeVo.costsPremiums">
+            手续费金额：
+            <span>
+              ￥{{orderInfo.queryOrderFeeVo.syCoderFeeVo.costsPremiums }}
+            </span>
+          </div>
           <div v-show="orderInfo.systartdate">
             商业险起保日期：
             <span>{{ orderInfo.systartdate }}</span>
           </div>
         </div>
+        <div class="headers headers_Custom" >
+          <div v-if="orderInfo.jypremium">
+            驾意险：
+            <span>￥{{ orderInfo.jypremium }}</span>
+          </div>
+        </div>
       </div>
       <div class="Enclosure" v-if="orderInfo.extendInfo">
         <div class="home flex j-s a-c back">
@@ -2650,7 +2683,7 @@
   /* 内容待定 */
   .headers_Custom {
     div {
-      padding: 20px 40px;
+      padding: 5px 30px;
       font-size: 16px;
 
       &>span {