Merge branch 'feature/detail' into 'master'

Feature/detail

See merge request !34

src/api/detail.bainian.zhongshen.js

+/* eslint-disable */
+/*
+ * //TODO 后期可以做成json文件，以减小包体积
+ * @Description: 百年终身寿险 - 第三方详情页
+ * @Date: 2020-07-27 15:46:37
+ * @LastEditors: gzw
+ * @LastEditTime: 2020-08-11 19:02:31
+ */
+
+export default {
+  type: "lcii",
+  productNo: "BNZJX001",
+  headerInfo: {
+    type: "bainian",
+    company: "",
+    title: "百年康惠保(2.0)重大疾病险",
+    price: [256, "元/年起"],
+    subPrice: [256, "元/年"],
+    insuredNum: 0,
+    stamp: false
+  },
+  paywayOptions: [
+    { label: "年缴", value: "1" }
+  ],
+  planCellInfo: [
+    { title: "100种重大疾病", value: "50万元" },
+    { title: "25种中症", value: "30万元" },
+    { title: "48种轻症", value: "赔3次，依次为20万/22.5万/25万" },
+    { title: "12种前症", value: "7.5万元" },
+    { title: "重症/中症/轻症/前症保费豁免", value: "免交后续保费" },
+    { title: "第二次恶性肿瘤", value: "60万" },
+    { title: "第二次心脑血管特定疾病（可选）", value: "60万" },
+    { title: "身故（可选）", value: "已交保费/基本保额" },
+    { title: "附加投保人保费豁免（可选）", value: "免交后续保费" }
+  ],
+  insuredAmountOptions: [
+    { label: "10万", value: "100000" },
+    { label: "15万", value: "150000" },
+    { label: "20万", value: "200000" },
+    { label: "25万", value: "250000" },
+    { label: "30万", value: "300000" },
+    { label: "35万", value: "350000" },
+    { label: "40万", value: "400000" },
+    { label: "45万", value: "450000" },
+    { label: "50万", value: "500000" },
+    { label: "55万", value: "550000" },
+    { label: "60万", value: "600000" },
+    { label: "70万", value: "700000" }
+  ],
+  benefitOptions: [
+    { label: "交5年", value: "1" },
+    { label: "交10年", value: "2" },
+    { label: "交15年", value: "3" },
+    { label: "交20年", value: "4" },
+    { label: "交30年", value: "5" }
+  ],
+  popupArray: [
+    {
+      title: "保险条款",
+      url: "http://mangguo-contract.qthbx.com/hua-gui-bao-xian-tiao-kuan-v1/"
+    },
+    {
+      title: "投保须知及声明",
+      url: "http://mangguo-contract.qthbx.com/huagui-tou-bao-xu-zhi-v1/"
+    },
+    {
+      title: "平台服务协议",
+      url: "http://mangguo-contract.qthbx.com/fu-wu-xie-yi-v1/"
+    }
+  ],
+  protocolData: [
+    { title: "保险条款", id: 0 },
+    { title: "投保须知与声明", id: 1 },
+    { title: "服务协议", id: 2 }
+  ],
+  additionalContract: {
+    twiceSpecialDisease: { title: "补充条款(二次)", value: false },
+    deathCompensation: { title: "身故保障金", value: false },
+    holderRemit: { title: "投保人豁免", value: false }
+  },
+  qaInfo: [
+    {
+      q: "这个产品的等待期是多久？",
+      a: "本产品的等待期为90天,意外及续保无等待期。"
+    },
+    {
+      q: "如果同时购买了其他重疾险，可以赔付2次吗？",
+      a: "本保险产品为一次性给付型产品，如果您购买的重疾险为一次性给付型或报销型产品，可以和本保险同时申请理赔，获得两份赔偿。如果出险，请拨打华泰财险24小时客服电话4006095509。"
+    },
+    {
+      q: "这款产品提供了哪些保障？",
+      a: "本产品对人一生中可能罹患的99%以上的100种重大疾病提供保障，同时还有40种轻症保障也包含在内。在保险期间内，被保险人因意外伤害或在等待期后因疾病初次确诊罹患本产品定义的重大疾病或轻症的，即可获得一笔保险补偿。"
+    },
+    {
+      q: "被保险人有哪些限制？",
+      a: "可以为出生满30天-60周岁（含）身体健康，且符合健康告知提及状况的本人、配偶、子女或父母投保。"
+    },
+    {
+      q: "理赔后是否可以续保？需要重新完成健康告知吗？",
+      a: "无理赔或者已理赔过轻症的第二年可以续保；已理赔过重症的第二年不可以续保；续保无需重新填写健康告知。"
+    },
+    {
+      q: "如何在华泰官网进行保单验真？",
+      a: "请登录投保成功短信中提示的华泰官网查询网http://agt.ehuatai.com/nonautoquery/。填写登录信息时，类别选择“家庭财产、意外伤害保险”，保单号在投保成功的短信中，密码填写被保险人身份证号，即可登录查询保单承保信息。"
+    }
+  ]
+};

src/api/detail.huagui.shouxian.js

@@ -4,7 +4,7 @@
  * @Description: 华贵大麦2020定期寿险
  * @Date: 2020-07-27 15:46:37
  * @LastEditors: gzw
- * @LastEditTime: 2020-08-11 17:03:21
+ * @LastEditTime: 2020-08-12 14:11:26
  */
 
 import goodsBg from "@/assets/images/goods/detail/shouxian/bg.png";

src/api/detail.taikang.yiliaobaozhang.js

@@ -4,7 +4,7 @@
  * @Description: 泰康600万医疗保障
  * @Date: 2020-07-27 15:46:37
  * @LastEditors: gzw
- * @LastEditTime: 2020-08-11 17:05:02
+ * @LastEditTime: 2020-08-12 14:09:59
  */
 
 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-11 17:05:56
+ * @LastEditTime: 2020-08-12 14:13:20
  */
 
 import goodsBg from "@/assets/images/goods/detail/yiwaixian/bg.png";

src/components/PopupWithIframe.vue

@@ -70,9 +70,9 @@ export default {
     popupShow(val) {
       this.$emit(CHANGE_EVENT, val);
       if (!val) {
+        this.pdfNumPages = null;
+        this.pdfUrl.destroyed = true;
         setTimeout(() => {
-          this.pdfNumPages = null;
-          this.pdfUrl = null;
           this.scrollRefresh = false;
         }, 300);
       }
@@ -99,6 +99,7 @@ export default {
       this.pdfUrl.promise
         .then(pdf => {
           this.pdfNumPages = pdf.numPages;
+          console.error(pdf);
         })
         .catch(err => {
           console.error(err);

src/views/Goods/Detail/AIDetail.vue

@@ -86,13 +86,14 @@ import AutoDeduct from "./modules/AutoDeduct";
 import ProtocolRead from "./modules/ProtocolRead";
 import NavTab from "./modules/NavTab";
 import detailPayMixin from "./modules/detailPay.mixin";
+import detailLoginMixin from "./modules/detailLogin.mixin";
 
 import Detail from "@/api/detail.zhongan.yiwai";
 import { trail, list } from "@/api/product";
 
 export default {
   name: "GoodsDetail-AI",
-  mixins: [detailPayMixin],
+  mixins: [detailPayMixin, detailLoginMixin],
   components: {
     DetailHeader,
     DetailFooter,
@@ -165,8 +166,8 @@ export default {
   },
   computed: {
     pupopData() {
-      const { popupArray, currentPupopIndex } = this;
-      return popupArray[currentPupopIndex] || {};
+      const { popupArray, currentPupopIndex, popupShow } = this;
+      return popupShow ? popupArray[currentPupopIndex] || {} : {};
     },
     planCellData() {
       const { planCellInfo } = this;
@@ -202,7 +203,10 @@ export default {
       this.popupShow = true;
     },
     onSubmit() {
-      this.goInsureState = true;
+      const { selfPhone, selfCode } = this.formData;
+      this.login(selfPhone, selfCode).then(() => {
+        this.goInsureState = true;
+      });
       // sessionStorage.setItem(
       //   "policyFormData",
       //   JSON.stringify(Object.assign(this.formData, { productNo: this.goodId }))

src/views/Goods/Detail/CIIDetail.vue

@@ -83,6 +83,7 @@ import InsurePersonForm from "./modules/InsurePersonForm";
 import AutoDeduct from "./modules/AutoDeduct";
 import ProtocolRead from "./modules/ProtocolRead";
 import NavTab from "./modules/NavTab";
+import detailLoginMixin from "./modules/detailLogin.mixin";
 
 import Detail from "@/api/detail.huatai.zhongjixian";
 import { trail, list } from "@/api/product";
@@ -112,6 +113,7 @@ export default {
     ProtocolRead,
     NavTab
   },
+  mixins: [detailLoginMixin],
   data() {
     return {
       ...Detail,
@@ -204,11 +206,14 @@ export default {
       this.popupShow = true;
     },
     onSubmit() {
-      this.goInsureState = true;
-      sessionStorage.setItem(
-        "policyFormData",
-        JSON.stringify(Object.assign(this.formData, { productNo: this.goodId }))
-      );
+      const { selfPhone, selfCode } = this.formData;
+      this.login(selfPhone, selfCode).then(() => {
+        this.goInsureState = true;
+        sessionStorage.setItem(
+          "policyFormData",
+          JSON.stringify(Object.assign(this.formData, { productNo: this.goodId }))
+        );
+      });
     },
     onFailed(errorInfo) {
       const { errors } = errorInfo;

src/views/Goods/Detail/LIDetail.vue

@@ -104,6 +104,7 @@ import CalInsuredFee from "./modules/CalInsuredFee";
 import PlanTip from "./modules/PlanTip";
 import ProtocolRead from "./modules/ProtocolRead";
 import NavTab from "./modules/NavTab";
+import detailLoginMixin from "./modules/detailLogin.mixin";
 
 import Detail from "@/api/detail.huagui.shouxian";
 import { trail, list } from "@/api/product";
@@ -130,6 +131,7 @@ export default {
     ProtocolRead,
     CalInsuredFee
   },
+  mixins: [detailLoginMixin],
   data() {
     return {
       ...Detail,
@@ -139,7 +141,7 @@ export default {
       popupShow: false,
       currentPupopIndex: null,
       formData: {
-        read: false
+        read: true
       },
       showLayer: false
     };
@@ -193,17 +195,17 @@ export default {
       this.popupShow = true;
     },
     onSubmit() {
-      sessionStorage.setItem(
-        "policyFormData",
-        JSON.stringify(Object.assign(this.formData, { productNo: this.goodId }))
-      );
-      this.nextStep();
+      this.showLoginPopup();
     },
     onFailed(errorInfo) {
       const { errors } = errorInfo;
       this.$notify({ type: "warning", message: errors[0].message });
     },
     nextStep() {
+      sessionStorage.setItem(
+        "policyFormData",
+        JSON.stringify(Object.assign(this.formData, { productNo: this.goodId }))
+      );
       this.$router.push("/policy/add");
     },
     async getDetail() {

src/views/Goods/Detail/MIDetail.vue

@@ -83,13 +83,14 @@ import AutoDeduct from "./modules/AutoDeduct";
 import ProtocolRead from "./modules/ProtocolRead";
 import NavTab from "./modules/NavTab";
 import detailPayMixin from "./modules/detailPay.mixin";
+import detailLoginMixin from "./modules/detailLogin.mixin";
 
 import { trail, list } from "@/api/product";
 import Detail from "@/api/detail.taikang.yiliaobaozhang";
 
 export default {
   name: "GoodsDetail-MI",
-  mixins: [detailPayMixin],
+  mixins: [detailPayMixin, detailLoginMixin],
   components: {
     DetailHeader,
     DetailFooter,
@@ -197,7 +198,10 @@ export default {
       this.popupShow = true;
     },
     onSubmit() {
-      this.goInsureState = true;
+      const { selfPhone, selfCode } = this.formData;
+      this.login(selfPhone, selfCode).then(() => {
+        this.goInsureState = true;
+      });
       // sessionStorage.setItem("policyFormData", JSON.stringify(this.formData));
     },
     onFailed(errorInfo) {

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

@@ -4,7 +4,13 @@
     :class="props.det.type"
     :style="{ backgroundImage: 'url(' + props.det.bgSrc + ')' }"
   >
-    <img src="../../../../assets/logo-top.png" alt="logo" class="det-hd-logo" />
+    <img
+      src="@/assets/images/goods/detail/shouxian/logo.png"
+      alt="logo"
+      class="det-hd-logo"
+      v-if="props.det.type === 'huagui'"
+    />
+    <img src="@/assets/logo-top.png" alt="logo" class="det-hd-logo" v-else />
     <div class="det-hd-recommend">
       <h2 class="det-hd-recommend-h2">智能产品官-小果</h2>
       <h1 class="det-hd-recommend-h1">为您优选推荐</h1>
@@ -193,4 +199,12 @@ export default {
     }
   }
 }
+.huagui {
+  .det-hd {
+    &-logo {
+      width: 173px;
+      height: 32px;
+    }
+  }
+}
 </style>

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

@@ -29,12 +29,15 @@
       <cr-field
         name="selfCode"
         v-model="formData.selfCode"
-        v-if="xyqbAuthState !== 4"
+        v-if="xyqbAuthState !== 4 || !mongoToken"
         placeholder="请输入短信验证码"
         label="验证码"
         :rules="[{ required: true, message: '请输入验证码' }]"
       >
-        <a href="javascript:;" slot="button">获取验证码</a>
+        <template v-slot:button>
+          <a href="javascript:;" @click="getCode" v-if="!showCount">获取验证码</a>
+          <span class="login-form-remain" v-else>{{ count }}s</span>
+        </template>
       </cr-field>
     </cr-cell-group>
     <h6 class="insure-form-title">为谁投保</h6>
@@ -86,7 +89,8 @@
 <script>
 import Card from "@/components/Card";
 import { mapState, mapActions } from "vuex";
-import { getFamilyList } from "@/api/user";
+import { getFamilyList, getCaptchaSms } from "@/api/user";
+import { isPhone } from "@/service/validation";
 import localStorage from "@/service/localStorage";
 import CrRadioBtn from "@/components/CrRadioBtn";
 const DATA_CHANGE_EVENT = "input";
@@ -114,6 +118,9 @@ export default {
     return {
       formData: {},
       familyList: [],
+      showCount: false,
+      count: "",
+      timer: null,
       mongoToken: localStorage.get("mongoToken"),
       xyqbAuthState: localStorage.get("xyqbAuthState")
     };
@@ -197,6 +204,29 @@ export default {
         this.familyList = res;
         this.showAuthXyqb && this.relationChange();
       }
+    },
+    async getCode() {
+      const TIME_COUNT = 60;
+      const { selfPhone } = this.formData;
+      if (this.timer) return;
+      if (!isPhone(selfPhone)) {
+        this.$notify({ type: "warning", message: "请填写正确的手机号码" });
+        return;
+      }
+      const res = await getCaptchaSms({ phoneNo: selfPhone });
+      if (res && !this.timer) {
+        this.count = TIME_COUNT;
+        this.showCount = true;
+        this.timer = setInterval(() => {
+          if (this.count > 0 && this.count <= TIME_COUNT) {
+            this.count--;
+          } else {
+            this.showCount = false;
+            clearInterval(this.timer);
+            this.timer = null;
+          }
+        }, 1000);
+      }
     }
   }
 };

src/views/Goods/Detail/modules/detailLogin.mixin.js

+import { loginByPhone } from "@/api/user";
+import { isWeixinBrower } from "@/service/validation";
+import { mapState, mapActions } from "vuex";
+import localStorage from "@/service/localStorage";
+
+export default {
+  computed: {
+    ...mapState(["isShowLogin"])
+  },
+  watch: {
+    isShowLogin(val) {
+      if (!val && localStorage.get("mongoToken")) {
+        this.nextStep();
+      }
+    }
+  },
+  methods: {
+    ...mapActions(["setIsShowLogin"]),
+    showLoginPopup() {
+      if (localStorage.get("mongoToken")) {
+        this.nextStep();
+      } else {
+        this.setIsShowLogin(true);
+      }
+    },
+    async login(phoneNo, verifyCode) {
+      let formData = {
+        loginChannel: isWeixinBrower ? 1 : 2,
+        openId: localStorage.get("openId") || null,
+        phoneNo,
+        verifyCode
+      };
+      const res = await loginByPhone(formData);
+      if (res) {
+        this.$notify("登录成功");
+        // localStorage.setItem("mongoToken", res.token);
+        // TODO 开发目前使用这个token
+        localStorage.set("mongoToken", "6ae7da7dd4c543f1a36c702c6f419f12");
+      }
+      return new Promise(resolve => {
+        resolve();
+      });
+    }
+  }
+};

src/views/Policy/Add/index.vue

@@ -13,7 +13,7 @@
       <cr-cell-group title="投保人信息">
         <cr-field
           v-model="formData.holderUserInfo.name"
-          name="holderUserInfo.name"
+          name="holderUserInfo_name"
           label="姓名"
           placeholder="请输入投保人姓名"
           :rules="[{ require: true, message: '请输入投保人姓名' }]"
@@ -21,7 +21,7 @@
         />
         <cr-field
           v-model="formData.holderUserInfo.idNo"
-          name="holderUserInfo.idNo"
+          name="holderUserInfo_idNo"
           label="身份证号"
           placeholder="请填写投保人身份证号"
           :rules="[{ require: true, message: '请填写投保人身份证号' }]"
@@ -29,7 +29,7 @@
         />
         <cr-field
           v-model="formData.holderUserInfo.phoneNo"
-          name="formData.holderUserInfo.phoneNo"
+          name="holderUserInfo_phoneNo"
           type="tel"
           label="手机号"
           placeholder="请填写投保人手机号"
@@ -38,7 +38,7 @@
         />
         <cr-field
           v-model="formData.holderUserInfo.email"
-          name="holderUserInfo.email"
+          name="holderUserInfo_email"
           type="email"
           label="电子邮箱"
           placeholder="用户接收电子保单"
@@ -46,7 +46,7 @@
         />
         <cr-field
           v-model="formData.holderUserInfo.annualIncome"
-          name="holderUserInfo.annualIncome"
+          name="holderUserInfo_annualIncome"
           label="年收入"
           type="digit"
           placeholder="请输入投保人年收入"
@@ -54,7 +54,7 @@
         />
         <cr-field
           v-model="formData.holderUserInfo.addressCode"
-          name="holderUserInfo.addressCode"
+          name="holderUserInfo_addressCode"
           label="居住省市"
           :rules="[{ require: true, message: '请选择投保人居住省市' }]"
         >
@@ -67,14 +67,14 @@
         </cr-field>
         <cr-field
           v-model="formData.holderUserInfo.addressDetail"
-          name="holderUserInfo.addressDetail"
+          name="holderUserInfo_addressDetail"
           label="详细地址"
           placeholder="请输入居住详细地址"
           :rules="[{ require: true, message: '请输入居住详细地址' }]"
         />
         <cr-field
           v-model="formData.holderUserInfo.occupation"
-          name="holderUserInfo.occupation"
+          name="holderUserInfo_occupation"
           label="职业"
           :rules="[{ require: true, message: '请选择投保人职业' }]"
         >
@@ -88,7 +88,7 @@
         </cr-field>
         <cr-field
           v-model="formData.holderUserInfo.longTerm"
-          name="holderUserInfo.longTerm"
+          name="holderUserInfo_longTerm"
           label="身份证有效期"
           :rules="[{ require: true, message: '请选择身份证有效期' }]"
         >
@@ -101,7 +101,7 @@
         </cr-field>
         <cr-field
           v-model="formData.holderUserInfo.validEnd"
-          name="holderUserInfo.validEnd"
+          name="holderUserInfo_validEnd"
           label="有效期至"
           :rules="[{ require: true, message: '请选择您的证件有效止期' }]"
         >
@@ -116,7 +116,7 @@
       <cr-cell-group title="被保人信息">
         <cr-field
           v-model="formData.insuredUserInfo.relation"
-          name="insuredUserInfo.relation"
+          name="insuredUserInfo_relation"
           label="为谁投保"
         >
           <template #input>
@@ -129,7 +129,7 @@
         </cr-field>
         <cr-field
           v-model="formData.insuredUserInfo.socialSecurity"
-          name="insuredUserInfo.socialSecurity"
+          name="insuredUserInfo_socialSecurity"
           label="有无社保"
           :rules="[{ require: true, message: '请选择社保状态' }]"
         >
@@ -142,7 +142,7 @@
         </cr-field>
         <cr-field
           v-model="formData.insuredUserInfo.height"
-          name="insuredUserInfo.height"
+          name="insuredUserInfo_height"
           label="身高"
           type="digit"
           placeholder="请填写被保人身高"
@@ -152,7 +152,7 @@
         </cr-field>
         <cr-field
           v-model="formData.insuredUserInfo.weight"
-          name="insuredUserInfo.weight"
+          name="insuredUserInfo_weight"
           label="体重"
           type="digit"
           placeholder="请填写被保人体重"
@@ -163,21 +163,21 @@
         <template v-if="formData.insuredUserInfo.relation !== '0'">
           <cr-field
             v-model="formData.insuredUserInfo.name"
-            name="insuredUserInfo.name"
+            name="insuredUserInfo_name"
             label="姓名"
             placeholder="请输入投保人姓名"
             :rules="[{ require: true, message: '请输入投保人姓名' }]"
           />
           <cr-field
             v-model="formData.insuredUserInfo.idNo"
-            name="insuredUserInfo.idNo"
+            name="insuredUserInfo_idNo"
             label="身份证号"
             placeholder="请填写投保人身份证号"
             :rules="[{ require: true, message: '请填写投保人身份证号' }]"
           />
           <cr-field
             v-model="formData.insuredUserInfo.phoneNo"
-            name="insuredUserInfo.phoneNo"
+            name="insuredUserInfo_phoneNo"
             label="手机号"
             type="tel"
             placeholder="请填写投保人手机号"
@@ -185,7 +185,7 @@
           />
           <cr-field
             v-model="formData.insuredUserInfo.annualIncome"
-            name="insuredUserInfo.annualIncome"
+            name="insuredUserInfo_annualIncome"
             label="年收入"
             type="digit"
             placeholder="请输入投保人年收入"
@@ -193,7 +193,7 @@
           />
           <cr-field
             v-model="formData.insuredUserInfo.addressCode"
-            name="insuredUserInfo.addressCode"
+            name="insuredUserInfo_addressCode"
             label="居住省市"
             :rules="[{ require: true, message: '请选择投保人居住省市' }]"
           >
@@ -206,14 +206,14 @@
           </cr-field>
           <cr-field
             v-model="formData.insuredUserInfo.addressDetail"
-            name="insuredUserInfo.weigaddressDetailht"
+            name="insuredUserInfo_weigaddressDetailht"
             label="详细地址"
             placeholder="请输入居住详细地址"
             :rules="[{ require: true, message: '请输入居住详细地址' }]"
           />
           <cr-field
             v-model="formData.insuredUserInfo.occupation"
-            name="insuredUserInfo.occupation"
+            name="insuredUserInfo_occupation"
             label="职业"
             :rules="[{ require: true, message: '请选择投保人职业' }]"
           >
@@ -227,7 +227,7 @@
           </cr-field>
           <cr-field
             v-model="formData.insuredUserInfo.longTerm"
-            name="insuredUserInfo.longTerm"
+            name="insuredUserInfo_longTerm"
             label="身份证有效期"
             :rules="[{ require: true, message: '请选择身份证有效期' }]"
           >
@@ -240,7 +240,7 @@
           </cr-field>
           <cr-field
             v-model="formData.insuredUserInfo.validEnd"
-            name="insuredUserInfo.validEnd"
+            name="insuredUserInfo_validEnd"
             label="有效期至"
             :rules="[{ require: true, message: '请选择您的证件有效止期' }]"
           >
@@ -256,7 +256,7 @@
       <cr-cell-group title="保障方案">
         <cr-field
           v-model="formData.productItem.insuredAmount"
-          name="productItem.insuredAmount"
+          name="productItem_insuredAmount"
           label="投保限额"
           :rules="[{ require: true, message: '请选择投保限额' }]"
         >
@@ -266,7 +266,7 @@
         </cr-field>
         <cr-field
           v-model="formData.productItem.policyPeriod"
-          name="productItem.policyPeriod"
+          name="productItem_policyPeriod"
           label="保险期限"
           :rules="[{ require: true, message: '请选择保险期限' }]"
         >
@@ -286,7 +286,7 @@
         </cr-field>
         <cr-field
           v-model="formData.productItem.paymentPeriod"
-          name="productItem.paymentPeriod"
+          name="productItem_paymentPeriod"
           label="交费期间"
           :rules="[{ require: true, message: '请选择交费期间' }]"
         >