From b5bbda3d42758cdd7588dacb57a64f31474e4151 Mon Sep 17 00:00:00 2001
From: hz <3451701311@qq.com>
Date: Thu, 30 Oct 2025 11:49:21 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E6=8A=BD=E7=A6=BB=E4=B8=8B=E4=B8=80?=
 =?UTF-8?q?=E6=AD=A5=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/CalculatePremium.vue           | 10 ++---
 .../components/TotalPremium.vue               | 43 +++++++++++++++++++
 2 files changed, 47 insertions(+), 6 deletions(-)
 create mode 100644 src/views/ebiz/saleFlowProImprove/components/TotalPremium.vue

diff --git a/src/views/ebiz/productFlowImprove/components/CalculatePremium.vue b/src/views/ebiz/productFlowImprove/components/CalculatePremium.vue
index 9630e31c0..e034dbf33 100644
--- a/src/views/ebiz/productFlowImprove/components/CalculatePremium.vue
+++ b/src/views/ebiz/productFlowImprove/components/CalculatePremium.vue
@@ -374,12 +374,8 @@
     </div>
 
     <!--底部总保费计算-->
-    <div class="bottom-btn bg-white flex">
-      <span> 首期总保费 ￥ {{ firstTermTotalPremium | moneyFormat }} 元 </span>
-      <van-button type="danger" size="large" @click="nextStep" :disabled="nextStepFlag" v-no-more-click="1000">
-        立即投保
-      </van-button>
-    </div>
+    <total-premium @submit="nextStep" :money="firstTermTotalPremium" :btn-option="{disable : nextStepFlag, name: '立即投保'}"/>
+
     <van-action-sheet v-model="show" cancel-text="取消" :actions="policyInfo" @select="openDocument" />
 
     <!-- 字段选择 -->
@@ -446,6 +442,7 @@ import AddtionRiskList from '@/views/ebiz/commonFlowImprove/AddRiskList.vue'
 import { trial } from '@/api/ebiz/common/common'
 import { syncLocalstorageData } from '@/assets/js/syncLocalstorageData'
 import { validateRelationshipToInsured } from '@/views/ebiz/productFlowImprove/components/js/relationshipToInsured'
+import TotalPremium from '@/views/ebiz/saleFlowProImprove/components/TotalPremium.vue'
 
 const DUTY_DEFAULT_MUTIPLE = 1000
 const DUTY_DEFAULT_MIN = 10000
@@ -475,6 +472,7 @@ export default {
     }
   },
   components: {
+    TotalPremium,
     AddtionRiskList,
     [Tag.name]: Tag,
     [Icon.name]: Icon,
diff --git a/src/views/ebiz/saleFlowProImprove/components/TotalPremium.vue b/src/views/ebiz/saleFlowProImprove/components/TotalPremium.vue
new file mode 100644
index 000000000..0b65ac978
--- /dev/null
+++ b/src/views/ebiz/saleFlowProImprove/components/TotalPremium.vue
@@ -0,0 +1,43 @@
+<script>
+export default {
+  name: 'TotalPremium',
+  props: {
+    money: {
+      type: Number,
+      default: 0
+    },
+    btnOption: {
+      type: Object,
+      default: () => ({ disable: false, name: '下一步' })
+    }
+  },
+  methods: {
+    handleNextSubmit() {
+      this.$emit('submit')
+    }
+  }
+}
+</script>
+
+<template>
+  <div class="bottom-btn bg-white flex total-premium justify-content-s">
+    <span class="flex align-items-c ml25"> 首期总保费 ￥ {{ money | moneyFormat }} 元 </span>
+    <van-button type="danger" size="large" @click="handleNextSubmit" :disabled="btnOption.disable" v-no-more-click="1000">
+      {{ btnOption.name }}
+    </van-button>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.total-premium {
+  $width : 40%;
+
+  overflow: hidden;
+  span {
+    width: 100%-$width;
+  }
+  button {
+    width: $width;
+  }
+}
+</style>