style: 抽离下一步按钮

src/views/ebiz/productFlowImprove/components/CalculatePremium.vue

@@ -374,12 +374,8 @@
     </div>
 
     <!--底部总保费计算-->
-    <div class="bottom-btn bg-white flex">
+    <total-premium @submit="nextStep" :money="firstTermTotalPremium" :btn-option="{disable : nextStepFlag, name: '立即投保'}"/>
-      <span> 首期总保费 ￥ {{ firstTermTotalPremium | moneyFormat }} 元 </span>
+
-      <van-button type="danger" size="large" @click="nextStep" :disabled="nextStepFlag" v-no-more-click="1000">
-        立即投保
-      </van-button>
-    </div>
     <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,

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>