feat: 详情查询，算价完成

src/api/detail.huagui.shouxian.js

@@ -4,7 +4,7 @@
  * @Description: 华贵大麦2020定期寿险
  * @Date: 2020-07-27 15:46:37
  * @LastEditors: gzw
- * @LastEditTime: 2020-08-05 19:24:06
+ * @LastEditTime: 2020-08-06 14:57:34
  */
 
 import goodsBg from "@/assets/images/goods/detail/shouxian/bg.png";
@@ -164,5 +164,35 @@ export default {
       title: "理赔付款",
       desc: `保险公司结案后，转账付款完成理赔。`
     }
+  ],
+  planInfo: [
+    {
+      title: "100种重大疾病保险金",
+      desc:
+        "<p>重大疾病包括恶性肿瘤、急性心肌梗塞、终末期肾病（或称慢性肾功能衰竭尿毒症期）等100种。在等待期（90天，意外伤害事故无等待期）后初次发生并经医院专科医生确诊罹患本合同约定的一种或多种重大疾病，保险人按照保险单中约定的重大疾病保险金额给付重大疾病保险金，同时在本保险合同项下对该被保险人的保险责任终止。</p>",
+      url: "查看100种重大疾病",
+      path: "http://mangguo-contract.qthbx.com/hua-tai-100chong-zhong-ji-v1/",
+      list: ""
+    },
+    {
+      title: "40种轻症疾病保险金",
+      desc:
+        "<p>轻症疾病包括冠状动脉介入手术、非危及生命的（极早期的）恶性病变、轻度中风后遗症等40种。在等待期（90天，意外伤害事故无等待期）后初次发生并经医院专科医生确诊罹患本合同约定的一种或多种轻症。保险人按照保险合同中约定的轻症保险金额给付轻症保险金，同时轻症责任终止。轻症保险金仅针对本保险合同约定的轻症进行给付，轻症疾病必须在生前诊断，对于任何身故后的尸检诊断不给付轻症疾病保险金。对于已经符合重大疾病保险金给付条件的，仅给付重大疾病保险金，不再给付轻症保险金。</p>",
+      url: "查看40种轻症疾病",
+      path: "http://mangguo-contract.qthbx.com/hua-tai-100chong-qing-zheng-v1/",
+      list: ""
+    },
+    {
+      title: "保额说明",
+      desc: `
+          <p><strong>重疾30万保额：</strong></p>
+          <p>30天~50周岁可投保，可逐年续保至99周岁。</p>
+          <p><strong>重疾20万保额：</strong></p>
+          <p>30天~60周岁可投保，可逐年续保至99周岁。</p>
+          <p><strong>重疾10万保额：</strong></p>
+          <p>
+          30天~60周岁可投保，可逐年续保至99周岁。</p>
+      `
+    }
   ]
 };

src/api/detail.taikang.yiliaobaozhang.js

@@ -4,7 +4,7 @@
  * @Description: 泰康600万医疗保障
  * @Date: 2020-07-27 15:46:37
  * @LastEditors: gzw
- * @LastEditTime: 2020-08-05 16:19:26
+ * @LastEditTime: 2020-08-06 11:46:46
  */
 
 import goodsBg from "@/assets/images/goods/detail/yiliaoxian/bg.png";

src/api/detail.zhongan.yiwai.js

@@ -4,7 +4,7 @@
  * @Description:众安50万意外险
  * @Date: 2020-07-27 15:46:37
  * @LastEditors: gzw
- * @LastEditTime: 2020-08-05 19:23:22
+ * @LastEditTime: 2020-08-06 14:22:44
  */
 
 import goodsBg from "@/assets/images/goods/detail/yiwaixian/bg.png";
@@ -104,10 +104,6 @@ export default {
     { label: "父母", value: "3" },
     { label: "子女", value: "4" }
   ],
-  paywayOptions: [
-    { label: "月缴<small style='color: #999;font-size: 11px'>（12期）</small>", value: "1" },
-    { label: "一次交清", value: "2" }
-  ],
   noticeCellInfo: {
     "10": [
       { title: "投保年龄", value: `18周岁~65周岁` },

src/components/PopupWithIframe.vue

@@ -119,10 +119,10 @@ export default {
     overflow: scroll;
     -webkit-overflow-scrolling: touch;
     &-wrap {
-      position: fixed;
-      bottom: 0;
-      left: 0;
-      z-index: 201;
+      // position: fixed;
+      // bottom: 0;
+      // left: 0;
+      // z-index: 201;
       height: 80vh;
       overflow: scroll;
       width: 100vw;

src/views/Goods/Detail/AIDetail.vue

 <template>
-  <div class="container">
+  <cr-form scroll-to-error @submit="onSubmit" @failed="onFailed" class="container">
     <nav-tab :nav-list="navBarOptions" />
-    <detail-header @click="goInsureState = true" :det="headerInfo" />
+    <detail-header :det="headerInfo" />
     <div class="det-body">
       <card title="保险计划" :option="['查看详情']" @option-click="openIframePupop(4)">
         <cr-radio-btn v-model="formData.planValue" :radio-data="planOptions" />
@@ -16,7 +16,7 @@
           @cell-click="openIframePupop"
         />
         <protocol-read
-          v-model="formData.pact"
+          v-model="formData.autoRenewPolicy"
           :cell-data="noticeCellData"
           :protocol-data="protocolData"
           @cell-click="openIframePupop"
@@ -53,9 +53,11 @@
       v-model="goInsureState"
       :title="headerInfo.title"
       :pay-data="goodBuyModalInfo"
+      @confirm="nextStep"
+      @read-protocol="openIframePupop"
       :protocol-data="protocolData"
     />
-  </div>
+  </cr-form>
 </template>
 
 <script>
@@ -85,7 +87,7 @@ import ProtocolRead from "./modules/ProtocolRead";
 import NavTab from "./modules/NavTab";
 
 import Detail from "@/api/detail.zhongan.yiwai";
-import { detail } from "@/api/product";
+import { detail, trail } from "@/api/product";
 
 export default {
   name: "GoodsDetail-AI",
@@ -115,19 +117,23 @@ export default {
   data() {
     return {
       ...Detail,
+      goodId: "",
       goodActionInfo: {},
       goodBuyModalInfo: [],
       popupShow: false,
       currentPupopIndex: null,
+      calTimer: null,
       formData: {
-        planValue: "10",
+        name: "",
+        idNo: "",
+        socialSecurity: "1",
         insured: "1",
-        payway: "1",
+        type: "1",
+        planValue: "10",
         auto: false,
-        pact: false
+        autoRenewPolicy: true
       },
-      goInsureState: false,
-      showLayer: false
+      goInsureState: false
     };
   },
   watch: {
@@ -136,7 +142,21 @@ export default {
       handler(val) {
         const { price } = val;
         this.goodActionInfo = { title: price };
-        this.goodBuyModalInfo = [{ title: `${price[2]}保费`, value: `${price[0]}${price[1]}` }];
+        this.goodBuyModalInfo = [{ title: `每年保费`, value: `${price[0]}元` }];
+      }
+    },
+    formDataCpu: {
+      deep: true,
+      handler(val, oldVal) {
+        if (this.calTimer) {
+          clearTimeout(this.calTimer);
+        }
+        const { name, idNo } = val;
+        const { name: oldName, idNo: oldNo } = oldVal;
+        if (name === oldName && idNo === oldNo) return;
+        this.calTimer = setTimeout(() => {
+          this.calFee({ name, idNo });
+        }, 600);
       }
     }
   },
@@ -161,6 +181,9 @@ export default {
         insuredOptions,
         paywayOptions
       };
+    },
+    formDataCpu() {
+      return JSON.parse(JSON.stringify(this.formData));
     }
   },
   mounted() {
@@ -175,6 +198,17 @@ export default {
       this.currentPupopIndex = index;
       this.popupShow = true;
     },
+    onSubmit() {
+      this.goInsureState = true;
+      sessionStorage.setItem("policyFormData", JSON.stringify(this.formData));
+    },
+    onFailed(errorInfo) {
+      const { errors } = errorInfo;
+      this.$notify({ type: "warning", message: errors[0].message });
+    },
+    nextStep() {
+      // 支付
+    },
     async getDetail() {
       this.goodId = this.$route.query.id;
       const res = await detail({ productNo: this.goodId });
@@ -182,6 +216,17 @@ export default {
         this.headerInfo.price[0] = res.price;
         this.headerInfo.company = res.companyName;
       }
+    },
+    async calFee({ name, idNo }) {
+      let { price } = this.headerInfo;
+      const res = await trail({ name, idNo, productNo: this.goodId });
+      if (res) {
+        price[0] = res.regularPrice;
+        this.goodActionInfo = {
+          title: price
+        };
+        this.goodBuyModalInfo = [{ title: `每年保费`, value: `${price[0]}元` }];
+      }
     }
   }
 };

src/views/Goods/Detail/CIIDetail.vue

 <template>
   <cr-form scroll-to-error @submit="onSubmit" @failed="onFailed" class="container">
     <nav-tab :nav-list="navBarOptions" />
-    <detail-header @click="goInsureState = true" :det="headerInfo" />
+    <detail-header :det="headerInfo" />
     <div class="det-body">
       <card title="保险计划" :option="['查看详情']" @option-click="openIframePupop(4)">
         <cr-radio-btn v-model="formData.planValue" :radio-data="planOptions" />
@@ -52,6 +52,8 @@
       v-model="goInsureState"
       :title="headerInfo.title"
       :pay-data="goodBuyModalInfo"
+      @confirm="nextStep"
+      @read-protocol="openIframePupop"
     />
   </cr-form>
 </template>
@@ -113,6 +115,7 @@ export default {
   data() {
     return {
       ...Detail,
+      goodId: "",
       calTimer: null,
       goodActionInfo: {},
       goodBuyModalInfo: [],
@@ -126,10 +129,9 @@ export default {
         type: "1",
         planValue: "3",
         auto: false,
-        autoRenewPolicy: false
+        autoRenewPolicy: true
       },
-      goInsureState: false,
-      showLayer: false
+      goInsureState: false
     };
   },
   watch: {
@@ -147,28 +149,17 @@ export default {
         ];
       }
     },
-    formData: {
+    formDataCpu: {
       deep: true,
       handler(val, oldVal) {
         if (this.calTimer) {
           clearTimeout(this.calTimer);
         }
-        const { name, idNo, socialSecurity, type } = val;
-        const {
-          name: oldName,
-          idNo: oldNo,
-          socialSecurity: oldSocialSecurity,
-          type: oldType
-        } = oldVal;
-        if (
-          name === oldName &&
-          idNo === oldNo &&
-          socialSecurity === oldSocialSecurity &&
-          type === oldType
-        )
-          return;
+        const { name, idNo, type } = val;
+        const { name: oldName, idNo: oldNo, type: oldType } = oldVal;
+        if (name === oldName && idNo === oldNo && type === oldType) return;
         this.calTimer = setTimeout(() => {
-          this.calFee({ name, idNo, socialSecurity, type });
+          this.calFee({ name, idNo, type });
         }, 600);
       }
     }
@@ -194,6 +185,9 @@ export default {
         insuredOptions,
         paywayOptions
       };
+    },
+    formDataCpu() {
+      return JSON.parse(JSON.stringify(this.formData));
     }
   },
   mounted() {
@@ -209,13 +203,15 @@ export default {
       this.popupShow = true;
     },
     onSubmit() {
+      this.goInsureState = true;
       sessionStorage.setItem("policyFormData", JSON.stringify(this.formData));
-      this.$router.push("/goods/inform");
     },
     onFailed(errorInfo) {
       const { errors } = errorInfo;
       this.$notify({ type: "warning", message: errors[0].message });
-      // this.goInsureState = true;
+    },
+    nextStep() {
+      this.$router.push("/goods/inform");
     },
     async getDetail() {
       this.goodId = this.$route.query.id;
@@ -226,9 +222,9 @@ export default {
         this.headerInfo.company = res.companyName;
       }
     },
-    async calFee({ name, idNo, socialSecurity, type }) {
+    async calFee({ name, idNo, type }) {
       let { price, subPrice } = this.headerInfo;
-      const res = await trail({ name, idNo, socialSecurity, type });
+      const res = await trail({ name, idNo, type, productNo: this.goodId });
       if (res) {
         price[0] = res.firstPrice;
         subPrice[0] = res.regularPrice;

src/views/Goods/Detail/LIDetail.vue

 <template>
-  <div class="container">
+  <cr-form scroll-to-error @submit="onSubmit" @failed="onFailed" class="container">
     <nav-tab :nav-list="navBarOptions" />
-    <detail-header @click="goInsureState = true" :det="headerInfo">
+    <detail-header :det="headerInfo">
       <div class="li-header">
         <plan-tip :tip-list="planTipOptions" />
         <cr-divider :hairline="false" :style="{ color: '#ECE9E9' }" />
@@ -46,7 +46,7 @@
           title="理赔须知"
           :options="[]"
           :text-bold="true"
-          v-model="formData.pact"
+          v-model="formData.autoRenewPolicy"
           :cell-data="noticeCellInfo"
           @cell-click="openIframePupop"
         >
@@ -71,20 +71,16 @@
     </div>
     <detail-footer :company-info="companyInfo" />
     <copyright />
-    <good-action
-      @click="$router.push('/policy/add')"
-      :content="goodActionInfo"
-      :class="{ 'cal-fee': currentPupopIndex === 6 }"
-    />
+    <good-action :content="goodActionInfo" :class="{ 'cal-fee': currentPupopIndex === 6 }" />
     <popup-with-iframe
       v-model="popupShow"
       :title="pupopData.title"
       :content="pupopData.content"
       :url="pupopData.url"
     >
-      <cal-insured-fee v-if="currentPupopIndex === 6" />
+      <cal-insured-fee v-model="formData" v-if="currentPupopIndex === 6" />
     </popup-with-iframe>
-  </div>
+  </cr-form>
 </template>
 
 <script>
@@ -110,7 +106,7 @@ import ProtocolRead from "./modules/ProtocolRead";
 import NavTab from "./modules/NavTab";
 
 import Detail from "@/api/detail.huagui.shouxian";
-import { detail } from "@/api/product";
+import { detail, trail } from "@/api/product";
 
 export default {
   name: "GoodsDetail-LI",
@@ -137,13 +133,13 @@ export default {
   data() {
     return {
       ...Detail,
+      goodId: "",
+      calTimer: null,
       goodActionInfo: {},
       popupShow: false,
       currentPupopIndex: null,
       formData: {
-        insured: "1",
-        payway: "1",
-        pact: false
+        autoRenewPolicy: false
       },
       showLayer: false
     };
@@ -158,12 +154,29 @@ export default {
         const { price } = val;
         this.goodActionInfo = { title: price };
       }
+    },
+    formDataCpu: {
+      deep: true,
+      handler(val, oldVal) {
+        if (this.calTimer) {
+          clearTimeout(this.calTimer);
+        }
+        const { autoRenewPolicy } = val;
+        const { autoRenewPolicy: oldAutoRenewPolicy } = oldVal;
+        if (autoRenewPolicy !== oldAutoRenewPolicy) return;
+        this.calTimer = setTimeout(() => {
+          this.calFee();
+        }, 600);
+      }
     }
   },
   computed: {
     pupopData() {
       const { popupArray, currentPupopIndex } = this;
       return popupArray[currentPupopIndex] || {};
+    },
+    formDataCpu() {
+      return JSON.parse(JSON.stringify(this.formData));
     }
   },
   mounted() {
@@ -178,6 +191,17 @@ export default {
       this.currentPupopIndex = index;
       this.popupShow = true;
     },
+    onSubmit() {
+      sessionStorage.setItem("policyFormData", JSON.stringify(this.formData));
+      this.nextStep();
+    },
+    onFailed(errorInfo) {
+      const { errors } = errorInfo;
+      this.$notify({ type: "warning", message: errors[0].message });
+    },
+    nextStep() {
+      this.$router.push("/policy/add");
+    },
     async getDetail() {
       this.goodId = this.$route.query.id;
       const res = await detail({ productNo: this.goodId });
@@ -185,6 +209,14 @@ export default {
         this.headerInfo.price[0] = res.price;
         this.headerInfo.company = res.companyName;
       }
+    },
+    async calFee() {
+      let { price } = this.headerInfo;
+      const res = await trail(Object.assign(this.formData, { productNo: this.goodId }));
+      if (res) {
+        price[0] = res.regularPrice;
+        this.goodActionInfo = { title: price };
+      }
     }
   }
 };

src/views/Goods/Detail/MIDetail.vue

 <template>
-  <div class="container">
+  <cr-form scroll-to-error @submit="onSubmit" @failed="onFailed" class="container">
     <nav-tab :nav-list="navBarOptions" />
-    <detail-header @click="goInsureState = true" :det="headerInfo" />
+    <detail-header :det="headerInfo" />
     <div class="det-body">
       <card title="保险计划" :option="['查看详情']" @option-click="openIframePupop(4)">
         <compactCellGroup :cell-data="planCellInfo" :text-bold="true" />
@@ -15,7 +15,7 @@
           @cell-click="openIframePupop"
         />
         <protocol-read
-          v-model="formData.pact"
+          v-model="formData.autoRenewPolicy"
           :cell-data="noticeCellInfo"
           @cell-click="openIframePupop"
         />
@@ -51,8 +51,10 @@
       v-model="goInsureState"
       :title="headerInfo.title"
       :pay-data="goodBuyModalInfo"
+      @confirm="nextStep"
+      @read-protocol="openIframePupop"
     />
-  </div>
+  </cr-form>
 </template>
 
 <script>
@@ -81,7 +83,7 @@ import AutoDeduct from "./modules/AutoDeduct";
 import ProtocolRead from "./modules/ProtocolRead";
 import NavTab from "./modules/NavTab";
 
-import { detail } from "@/api/product";
+import { detail, trail } from "@/api/product";
 import Detail from "@/api/detail.taikang.yiliaobaozhang";
 
 export default {
@@ -113,19 +115,23 @@ export default {
   data() {
     return {
       ...Detail,
+      goodId: "",
+      calTimer: null,
       goodActionInfo: {},
       goodBuyModalInfo: [],
       popupShow: false,
       currentPupopIndex: null,
       formData: {
+        name: "",
+        idNo: "",
+        socialSecurity: "1",
         insured: "1",
-        payway: "1",
-        medical: "1",
+        type: "1",
+        planValue: "3",
         auto: false,
-        pact: false
+        autoRenewPolicy: true
       },
-      goInsureState: false,
-      showLayer: false
+      goInsureState: false
     };
   },
   watch: {
@@ -142,6 +148,31 @@ export default {
           { title: `${subPrice[2]}保费`, value: `${subPrice[0]}${subPrice[1]}${subPrice[3]}` }
         ];
       }
+    },
+    formDataCpu: {
+      deep: true,
+      handler(val, oldVal) {
+        if (this.calTimer) {
+          clearTimeout(this.calTimer);
+        }
+        const { name, idNo, socialSecurity, type } = val;
+        const {
+          name: oldName,
+          idNo: oldNo,
+          socialSecurity: oldSocialSecurity,
+          type: oldType
+        } = oldVal;
+        if (
+          name === oldName &&
+          idNo === oldNo &&
+          socialSecurity === oldSocialSecurity &&
+          type === oldType
+        )
+          return;
+        this.calTimer = setTimeout(() => {
+          this.calFee({ name, idNo, socialSecurity, type });
+        }, 600);
+      }
     }
   },
   computed: {
@@ -156,6 +187,9 @@ export default {
         paywayOptions,
         medicalOptions
       };
+    },
+    formDataCpu() {
+      return JSON.parse(JSON.stringify(this.formData));
     }
   },
   mounted() {
@@ -170,6 +204,17 @@ export default {
       this.currentPupopIndex = index;
       this.popupShow = true;
     },
+    onSubmit() {
+      this.goInsureState = true;
+      // sessionStorage.setItem("policyFormData", JSON.stringify(this.formData));
+    },
+    onFailed(errorInfo) {
+      const { errors } = errorInfo;
+      this.$notify({ type: "warning", message: errors[0].message });
+    },
+    nextStep() {
+      // 支付
+    },
     async getDetail() {
       this.goodId = this.$route.query.id;
       const res = await detail({ productNo: this.goodId });
@@ -178,6 +223,22 @@ export default {
         this.headerInfo.subPrice[0] = res.price;
         this.headerInfo.company = res.companyName;
       }
+    },
+    async calFee({ name, idNo, socialSecurity, type }) {
+      let { price, subPrice } = this.headerInfo;
+      const res = await trail({ name, idNo, socialSecurity, type });
+      if (res) {
+        price[0] = res.firstPrice;
+        subPrice[0] = res.regularPrice;
+        this.goodActionInfo = {
+          title: price,
+          sub: subPrice
+        };
+        this.goodBuyModalInfo = [
+          { title: `${price[2]}保费`, value: `${price[0]}${price[1]}` },
+          { title: `${subPrice[2]}保费`, value: `${subPrice[0]}${subPrice[1]}${subPrice[3]}` }
+        ];
+      }
     }
   }
 };

src/views/Goods/Detail/modules/CalInsuredFee.vue

 <template>
-  <cr-form class="policy-form" scroll-to-error @submit="onFormSubmit" @failed="onFormFailed">
+  <cr-form ref="calFeeForm" class="policy-form" @submit="onFormSubmit">
     <cr-cell-group title="被保人年龄需满足18周岁~60周岁">
-      <cr-field v-model="formData.text" name="selfName" label="出生日期" readonly>
+      <cr-field
+        v-model="formData.birthday"
+        name="birthday"
+        label="出生日期"
+        :rules="[{ required: true, message: 'required' }]"
+      >
         <template #input>
-          <popup-date-picker v-model="formData.text" placeholder="请选择被保人出生日期" />
+          <popup-date-picker v-model="formData.birthday" placeholder="请选择被保人出生日期" />
         </template>
       </cr-field>
-      <cr-field name="selfName" label="保障额度">
+      <cr-field name="price" label="保障额度" :rules="[{ required: true, message: 'required' }]">
         <template #input>
-          <cr-radio-btn v-model="formData.planValue" :radio-data="countOptions" />
+          <cr-radio-btn v-model="formData.price" :radio-data="countOptions" />
         </template>
       </cr-field>
-      <cr-field v-model="formData.text" name="selfName" label="保险期限">
+      <cr-field name="term" label="保险期限" :rules="[{ required: true, message: 'required' }]">
         <template #input>
-          <cr-radio-btn v-model="formData.planValue" :radio-data="termOptions" />
+          <cr-radio-btn v-model="formData.term" :radio-data="termOptions" />
         </template>
       </cr-field>
-      <cr-field v-model="formData.text" name="selfName" label="交费年限">
+      <cr-field name="range" label="交费年限" :rules="[{ required: true, message: 'required' }]">
         <template #input>
-          <cr-radio-btn v-model="formData.planValue" :radio-data="benefitOptions" />
+          <cr-radio-btn v-model="formData.range" :radio-data="benefitOptions" />
         </template>
       </cr-field>
-      <cr-field v-model="formData.text" name="selfName" label="性别">
+      <cr-field name="sex" label="性别" :rules="[{ required: true, message: 'required' }]">
         <template #input>
-          <cr-radio-btn v-model="formData.planValue" :radio-data="sexOptions" />
+          <cr-radio-btn v-model="formData.sex" :radio-data="sexOptions" />
         </template>
       </cr-field>
-      <cr-field v-model="formData.text" name="selfName" label="交费方式">
+      <cr-field name="type" label="交费方式" :rules="[{ required: true, message: 'required' }]">
         <template #input>
-          <cr-radio-btn v-model="formData.planValue" :radio-data="paywayOptions" />
+          <cr-radio-btn v-model="formData.type" :radio-data="paywayOptions" />
         </template>
       </cr-field>
     </cr-cell-group>
@@ -38,6 +43,7 @@
 <script>
 import CrRadioBtn from "@/components/CrRadioBtn";
 import PopupDatePicker from "@/components/PopupDatePicker";
+const DATA_CHANGE_EVENT = "input";
 
 export default {
   name: "CalInsuredFee",
@@ -45,6 +51,14 @@ export default {
     CrRadioBtn,
     PopupDatePicker
   },
+  props: {
+    value: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
   data() {
     return {
       formData: {},
@@ -80,23 +94,24 @@ export default {
     };
   },
   watch: {
+    value: {
+      deep: true,
+      handler(val) {
+        this.formData = val;
+      }
+    },
     formData: {
       deep: true,
       handler() {
-        this.calFee();
+        this.$refs.calFeeForm.submit();
       }
     }
   },
   mounted() {},
   methods: {
-    onFormSubmit(values) {
-      console.log("submit", values);
-    },
-    onFormFailed(errorInfo) {
-      const { errors } = errorInfo;
-      this.$notify({ type: "warning", message: errors[0].message });
-    },
-    calFee() {}
+    onFormSubmit() {
+      this.$emit(DATA_CHANGE_EVENT, this.formData);
+    }
   }
 };
 </script>

src/views/Goods/Detail/modules/DetailHeader.vue

@@ -29,7 +29,7 @@
             {{ props.det.subPrice[2] || "" }}{{ props.det.subPrice[0] || "" }}{{ props.det.subPrice[1] || "" }}
           </small>
         </h5>
-        <cr-button type="warning" block @click="listeners.click" native-type="submit">
+        <cr-button type="warning" block native-type="submit">
           立即开启保障
         </cr-button>
         <div class="det-hd-insured-people">

src/views/Goods/Detail/modules/GoInsureDialog.vue

@@ -25,6 +25,8 @@
 import CompactCellGroup from "@/components/CompactCellGroup";
 import Modal from "@/components/Modal";
 const DIALOG_CHANGE_EVENT = "input";
+const DIALOG_CONFIRM_EVENT = "confirm";
+const READ_PROTOCOL_EVENT = "read-protocol";
 export default {
   name: "GoInsureDialog",
   components: {
@@ -70,10 +72,10 @@ export default {
   },
   methods: {
     openIframePupop(index) {
-      this.$parent.openIframePupop(index);
+      this.$emit(READ_PROTOCOL_EVENT, index);
     },
     go() {
-      this.$router.push("/goods/inform");
+      this.$emit(DIALOG_CONFIRM_EVENT);
     }
   }
 };
@@ -151,7 +153,7 @@ export default {
           width: 0;
           height: 12px;
           border-right: 1px @blue solid;
-          margin: 0 3px 0 1px;
+          margin: 0 0px 0 2px;
           vertical-align: -2px;
         }
         &:last-child::after {

src/views/Goods/Detail/modules/InsurePersonForm.vue

 <template>
-  <card title="请填写投保信息">
+  <card title="请填写投保信息" class="insure-card">
     <h6 class="insure-form-title">本人信息</h6>
     <cr-cell-group class="insure-form">
       <cr-field
@@ -71,7 +71,7 @@
           :radio-data="radioOptions.medicalOptions"
         />
       </cr-cell>
-      <cr-cell title="缴费方式" class="insure-form-item_nobg">
+      <cr-cell title="缴费方式" class="insure-form-item_nobg" v-if="radioOptions.paywayOptions">
         <cr-radio-btn
           name="type"
           v-model="formData.type"
@@ -158,6 +158,11 @@ export default {
 </script>
 <style lang="less" scoped>
 @import "../../../../style/var.less";
+.insure-card {
+  @{deep} .card-body {
+    padding-bottom: 10px;
+  }
+}
 .insure-form {
   &-title {
     font-size: @font-size-16;

src/views/Goods/Inform/index.less

@@ -40,8 +40,8 @@
       padding: 0;
       // background-color: @gray-1;
       // border-radius: @border-radius-md;
-      overflow: hidden;
       -webkit-overflow-scrolling: touch;
+      overflow: scroll;
       margin: 0 -15px;
       height: 72vh;
     }
@@ -62,9 +62,7 @@
     }
   }
   &-frame {
-    -webkit-overflow-scrolling: touch;
-    overflow: scroll;
-    width: 100%;
     height: 72vh;
+    width: 100%;
   }
 }

src/views/Policy/Add/index.vue

@@ -46,7 +46,6 @@
         <cr-field
           name="selfName"
           label="居住省市"
-          readonly
           :rules="[{ require: true, message: '请选择投保人居住省市' }]"
         >
           <template #input>
@@ -86,7 +85,6 @@
         <cr-field
           name="selfName"
           label="有效期至"
-          readonly
           :rules="[{ require: true, message: '请选择您的证件有效止期' }]"
         >
           <template #input>
@@ -163,7 +161,6 @@
         <cr-field
           name="selfName"
           label="居住省市"
-          readonly
           :rules="[{ require: true, message: '请选择投保人居住省市' }]"
         >
           <template #input>
@@ -203,7 +200,6 @@
         <cr-field
           name="selfName"
           label="有效期至"
-          readonly
           :rules="[{ require: true, message: '请选择您的证件有效止期' }]"
         >
           <template #input>
@@ -255,14 +251,12 @@
           v-model="formData.text"
           name="selfName"
           label="生效日期"
-          readonly
           :rules="[{ require: true, message: '请选择生效日期' }]"
         />
         <cr-field
           v-model="formData.text"
           name="selfName"
           label="受益人"
-          readonly
           :rules="[{ require: true, message: '请选择受益人' }]"
         />
       </cr-cell-group>