bxs-tools-ui 3.3.3 → 3.4.0

package/packages/planbook-input/helper.js

@@ -12,7 +12,6 @@ import {
   clearAddAndTakeAndAdjustBaoeData,
   convertProductData,
   verifyProductRules,
-  convertEleOrderListToObj,
   getExpressionParamMap
 } from '../bxs-utils/index'
 import { calcPlanbookProduct, uploadPlanBookResult, getUnderwriteEffectiveRules } from '../../src/api/index.js'
@@ -141,8 +140,6 @@ export function setPageDataBaseOnResult(inputData, exportData, policyInfo, optio
           // 已生成的计划书取回的产品数据，赋值到初始化中的产品对象中
           for (let k in prod) {
             if (k == 'mulInsOrderList') {
-              // 清除组合险
-              prod.mulInsOrderList = prod.mulInsOrderList.filter(ins => !ins.isGroup)
               // 已生成的计划书取回的险种数据，赋值到初始化中的险种对象中
               prod.mulInsOrderList.forEach(ins => {
                 const eInsuranceData = eProductData.mulInsOrderList.find(m => m.key === ins.key)
@@ -240,7 +237,8 @@ export async function createdProductDataToCalc(inputData, options = {}) {
               'shmInsData',
               'totalBaof',
               // 'calcResultExp', // 不能删除，后面有依赖
-              'revalidateFlag'
+              'revalidateFlag',
+              'deriveRequired'
             ].includes(k)
           ) {
             tempIns[k] = ins[k]
@@ -317,20 +315,6 @@ export function receiveProductData(inputData, rProductData, options = {}) {
       }
     })
 
-    productData.mulInsOrderList.forEach(ins => {
-      if (ins.isGroup) {
-        return
-      }
-      const groupInsData = convertEleOrderListToObj(ins)
-      const insuranceId = groupInsData.isCheckbox ? groupInsData.insuranceId[0] : groupInsData.insuranceId
-      const checkedIns = productData.mulInsOrderList.find(i => i.key === insuranceId)
-      for (const key in checkedIns) {
-        if (['allowSamePerson', 'code', 'eleOrderList', 'groupKey', 'groupName', 'huomian', 'key', 'name'].indexOf(key) === -1) {
-          ins[key] = checkedIns[key]
-        }
-      }
-    })
-
     const hasSomeCheckedIns = rProductData.mulInsOrderList.some(ins => ins.title)
     productData.hadChoice = hasSomeCheckedIns
     productData.totalBaof = hasSomeCheckedIns ? rProductData.totalBaof : null
@@ -786,13 +770,7 @@ export async function makePlanbook(inputData, options = {}) {
       clientVersion: appVersion,
       isIos
     })
-  ).then(({ success, data, info }) => {
-    if (!success || !data) {
-      Toast(info || '生成计划书失败')
-      return Promise.reject()
-    }
-    return Promise.resolve(data)
-  })
+  )
 }
 
 export function convertInputDataToResultData(inputData, options = {}) {
@@ -915,7 +893,7 @@ export function cleanNeedlessResultData(resultData) {
 // 获取产品险种标签；入参过滤与 findInsuranceTag().catch 与 compare3 fetchInsuranceSaleStatusMap 一致
 export async function getProductInsuranceTags(inputData, options = {}, key = 'salesStatus') {
   const product = getProductFromInputData(inputData, options)
-  const mulInsOrderList = (_get(product, 'mulInsOrderList') || []).filter(ins => !ins.isGroup)
+  const mulInsOrderList = _get(product, 'mulInsOrderList') || []
 
   if (!mulInsOrderList.length) {
     return {}

package/packages/product-info/components/product-insurance-form.md

@@ -0,0 +1,46 @@
+# ProductInsuranceForm
+
+## 说明
+
+单个险种表单：渲染 `ins.eleOrderList`（标题 + 选中后的输入/单选/下拉等）。供 `ProductInfo` 在普通险与组合子险中复用。
+
+非目标：组合险组头开关、组内互斥逻辑（由父组件处理）。
+
+## Props
+
+| 参数 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| `ins` | 必传，险种数据 | Object | — |
+| `ins-mode` | 场景：`normal` 普通险 / `groupSub` 组合子险（内部挂 `bxt-product-group-sub` 等 class，title 走 `title-change`） | String | `normal` |
+| `product-key` | 产品 key，用于 DOM id | Number / String | `null` |
+| `mul-ins-order-list` | 产品下全部险种（豁免标签等） | Array | `[]` |
+| `person-data` | 人员信息（豁免提示） | Object | `{}` |
+| `recommend-values` | 保额/保费推荐值 | Object | `{}` |
+| `insurance-sale-status` | 停售状态映射 | Object | `{}` |
+| `show-huomian-tips` | 是否展示豁免设置提示 | Boolean | `false` |
+| `is-follow` | 是否与上一险种紧贴 | Boolean | `false` |
+
+## Events
+
+| 事件 | 说明 | 参数 |
+|------|------|------|
+| `change` | 元素变更（普通险含 title；组合子险 title 除外） | `{ insData, eleData }` |
+| `title-change` | 仅 `insMode=groupSub`：标题勾选，由父做互斥后再 `onChange` | `{ insData, eleData }` |
+| `openCrmPerson` | 点击豁免提示 | — |
+
+## Methods
+
+| 方法 | 说明 |
+|------|------|
+| `validate` | 调用内部 `van-form.validate` |
+
+## 依赖
+
+- Vant：`van-form` / `van-field` / `van-radio` 等
+- `CommonTitle` / `CommonRadio` / `CommonSelect`
+
+## 埋点清单
+
+| 事件类型 | 触发节点 | statId | 备注 |
+|----------|----------|--------|------|
+| 点击 | 标题 / 单选 / 下拉 | `product_insurance_${ele.key}` | 声明式 `data-stat-id` |

package/packages/product-info/components/product-insurance-form.vue

@@ -0,0 +1,360 @@
+<template>
+  <van-form ref="insuranceForm" :class="formClassList" :show-error="false" @submit.native.prevent="closeKeyBoard()">
+    <template v-for="ele in ins.eleOrderList">
+      <van-field v-if="['cmCommonTitle'].includes(ele.componentName)" :key="ele.key" :name="ele.key" :rules="getElementRules(ele)">
+        <template #input>
+          <CommonTitle
+            v-model="ele.value"
+            :key="`${productKey}_${ins.key}_${ele.key}`"
+            :name="ele.key"
+            :code="ins.code"
+            :huomian-tag="getInsuranceTitleHmTag(ins)"
+            :status-tag="getInsuranceSaleStatusTag(ins)"
+            :huomian-tips="showHuomianTips && getHuomianTips(ins, ele)"
+            :label="ele.labelName"
+            :style="{
+              fontSize: '17px',
+              fontWeight: 'bold'
+            }"
+            :disabled="getElementDisabled(ele)"
+            :always-show-checkbox="isGroupSub"
+            :data-stat-id="`product_insurance_${ele.key}`"
+            @change="onTitleChange(ele)"
+            @openCrmPerson="$emit('openCrmPerson')"
+          />
+        </template>
+      </van-field>
+
+      <template v-if="isInsuranceChecked && !ele.isHide && ele.componentName !== 'cmCommonTitle'">
+        <van-field
+          v-if="['cmCommonInput'].includes(ele.componentName)"
+          v-model.number="ele.value"
+          :ref="ins.key + ele.key + 'item'"
+          :key="ins.key + ele.key"
+          :id="`id_${ins.key}_${ele.key}`"
+          :type="ele.inputType || 'tel'"
+          :class="{
+            'van-field-unit': activeInputKey === ins.key + ele.key && numberUnitStr
+          }"
+          :prop="ele.key"
+          :label="ele.labelName"
+          :placeholder="ele.placeholder"
+          :disabled="getElementDisabled(ele)"
+          :readonly="getElementDisabled(ele)"
+          :maxlength="ele.maxlength || 9"
+          :rules="getElementRules(ele)"
+          autocomplete="off"
+          input-align="right"
+          error-message-align="right"
+          clearable
+          :inputmode="ele.inputType || 'text'"
+          @focus="
+            activeInputKey = ins.key + ele.key
+            numberUnitStr = getAmountUnit(ele)
+          "
+          @blur="activeInputKey = ''"
+          @input="numberUnitStr = getAmountUnit(ele)"
+          @change="emitChange(ele)"
+          @clear="emitChange(ele)"
+        >
+          <template v-if="!ele.isDisabled" #right-icon>
+            <i class="icon iconfont icon-edit" style="font-size: 20px;" @click="onClickIcon(`id_${ins.key}_${ele.key}`)" />
+          </template>
+        </van-field>
+        <div v-if="activeInputKey === ins.key + ele.key && numberUnitStr" :key="ins.key + ele.key + 'unit'" class="bxt-ins-unit-tips">
+          <em />
+          <span>
+            {{ numberUnitStr }}
+          </span>
+        </div>
+        <div v-if="getRecommendValues(ele)" :key="ins.key + ele.key + 'recommend'" class="bxt-ins-recommend-values">
+          <span v-for="v in getRecommendValues(ele)" :key="v" @click="onClickRecommendValue(v, ele)">
+            {{ v }}
+          </span>
+        </div>
+
+        <CommonRadio
+          v-if="['cmCommonRadioBtn'].includes(ele.componentName)"
+          v-model="ele.value"
+          class="bxt-ins-form-radio-btn"
+          :key="ins.key + ele.key"
+          :name="ele.key"
+          :label="ele.labelName"
+          :disabled="getElementDisabled(ele)"
+          :readonly="getElementDisabled(ele)"
+          :rules="getElementRules(ele)"
+          :options="ele.opts.filter(o => !o.isHide && !o.isDisabled && !o.isInvalid)"
+          input-align="right"
+          border
+          :data-stat-id="`product_insurance_${ele.key}`"
+          @input="emitChange(ele)"
+        />
+
+        <van-field
+          v-if="['cmCommonRadio'].includes(ele.componentName)"
+          class="bxt-ins-form-radio"
+          :key="ins.key + ele.key"
+          :name="ele.key"
+          :label="ele.labelName"
+          :rules="getElementRules(ele)"
+        >
+          <template #input>
+            <van-radio-group v-model="ele.value" :disabled="getElementDisabled(ele)" @change="emitChange(ele)">
+              <van-radio
+                v-for="opt in ele.opts"
+                :id="`${productKey}_${ins.key}_${ele.key}_${opt.val}`"
+                :key="opt.val"
+                :name="typeof ele.value === 'number' && !isNaN(Number(opt.val)) ? opt.val * 1 : opt.val"
+                :disabled="opt.val != ele.value && opt.isDisabled"
+                :label-disabled="opt.val != ele.value && opt.isDisabled"
+              >
+                <template #icon="props">
+                  <van-icon v-if="props.checked" class-prefix="iconfont icon" name="multiple_choice" size="20px" />
+                  <van-icon v-else class-prefix="iconfont icon" name="choose_none_line" size="20px" />
+                </template>
+                <div class="bxt-ins-form-radio-content">
+                  <span v-if="opt.code" class="bxt-ins-form-radio--code">{{ opt.code }}</span>
+                  <span
+                    class="bxt-ins-form-radio--tx"
+                    :class="[genInsuranceHmTag(opt) || getInsuranceSaleStatusTagByKey(opt.val) ? 'bxt-ins-form-radio--width' : '']"
+                  >
+                    {{ opt.desc }}
+                  </span>
+                  <span v-if="getInsuranceSaleStatusTagByKey(opt.val)" class="bxt-ins-form-radio--sale-tag">
+                    {{ getInsuranceSaleStatusTagByKey(opt.val) }}
+                  </span>
+                  <span v-if="genInsuranceHmTag(opt)" class="bxt-ins-form-radio--tag">
+                    {{ genInsuranceHmTag(opt) }}
+                  </span>
+                </div>
+              </van-radio>
+            </van-radio-group>
+          </template>
+        </van-field>
+
+        <CommonSelect
+          v-if="['cmCommonSelect'].includes(ele.componentName)"
+          v-model="ele.value"
+          :key="ele.componentName + ins.key + ele.key"
+          :name="ele.key"
+          :label="ele.labelName"
+          :placeholder="ele.placeholder"
+          :disabled="getElementDisabled(ele)"
+          :readonly="getElementDisabled(ele)"
+          :rules="getElementRules(ele)"
+          :options="ele.opts.filter(o => !o.isHide && !o.isDisabled && !o.isInvalid)"
+          :right-icon="getElementDisabled(ele) ? '' : 'arrow'"
+          input-align="right"
+          border
+          :data-stat-id="`product_insurance_${ele.key}`"
+          @change="emitChange(ele)"
+        />
+
+        <div :key="`${ins.key}${ele.key}_note`" v-if="ele.note" class="bxt-form-item-label-note">
+          {{ ele.note }}
+        </div>
+      </template>
+    </template>
+  </van-form>
+</template>
+<script lang="ts">
+import Vue from 'vue'
+import { Component, Prop } from 'vue-property-decorator'
+import { get as _get } from 'lodash'
+import { convertEleOrderListToObj } from 'packages/bxs-utils/index'
+import CommonTitle from '../../../src/components/common/common-title.vue'
+import CommonRadio from '../../../src/components/common/common-radio.vue'
+import CommonSelect from '../../../src/components/common/common-select.vue'
+
+@Component({
+  name: 'ProductInsuranceForm',
+  components: {
+    CommonTitle,
+    CommonRadio,
+    CommonSelect
+  }
+})
+export default class ProductInsuranceForm extends Vue {
+  activeInputKey = ''
+  numberUnitStr = ''
+
+  @Prop({ required: true })
+  ins!: any
+
+  /** 险种表单场景：normal 普通险 | groupSub 组合子险 */
+  @Prop({ default: 'normal' })
+  insMode!: string
+
+  @Prop({ default: null })
+  productKey!: number | string
+
+  @Prop({ default: () => [] })
+  mulInsOrderList!: any[]
+
+  @Prop({ default: () => ({}) })
+  personData!: any
+
+  @Prop({ default: () => ({}) })
+  recommendValues!: any
+
+  @Prop({ default: () => ({}) })
+  insuranceSaleStatus!: any
+
+  @Prop({ default: false })
+  showHuomianTips!: boolean
+
+  @Prop({ default: false })
+  isFollow!: boolean
+
+  /** 组合险 locked：其他子险 title 不可点 */
+  @Prop({ default: false })
+  lockTitleClick!: boolean
+
+  get isGroupSub() {
+    return this.insMode === 'groupSub'
+  }
+
+  get formClassList() {
+    return [
+      'bxt-product-info-form',
+      `bxt-product-insurance-id-${this.ins.key}`,
+      this.isGroupSub ? 'bxt-product-group-sub' : '',
+      this.isGroupSub ? 'bxt-product-insurance-type-group' : '',
+      this.isFollow ? 'bxt-product-info-form-follow' : ''
+    ]
+  }
+
+  get isInsuranceChecked() {
+    const titleEle = (this.ins.eleOrderList || []).find(e => e.key === 'title')
+    return this.ins.key === 'common' || (!!titleEle && titleEle.value)
+  }
+
+  validate() {
+    const form: any = this.$refs.insuranceForm
+    return form && form.validate ? form.validate() : Promise.resolve()
+  }
+
+  emitChange(ele) {
+    this.$emit('change', { insData: this.ins, eleData: ele })
+  }
+  onTitleChange(ele) {
+    if (this.isGroupSub) {
+      this.$emit('title-change', { insData: this.ins, eleData: ele })
+    } else {
+      this.emitChange(ele)
+    }
+  }
+  onClickIcon(id) {
+    const inputDom: any = document.querySelector(`#${id}`)
+    if (inputDom) {
+      inputDom.focus()
+    }
+  }
+  closeKeyBoard() {
+    const activeElement: any = document.activeElement
+    if (!activeElement) {
+      return false
+    }
+    activeElement.blur()
+    return false
+  }
+  getElementRules(ele) {
+    let _rules = ele.rules || []
+    if (ele.isIgnoreValidate) {
+      _rules = []
+    }
+    return _rules
+  }
+  getElementDisabled(ele) {
+    if (ele.key === 'title' && this.lockTitleClick) {
+      return true
+    }
+    const opts = (ele.opts || []).filter(o => !o.isHide && !o.isDisabled && !o.isInvalid)
+    return ele.isDisabled || (opts.length === 1 && _get(opts, '[0].val') === ele.value)
+  }
+  genInsuranceHmTag(opt) {
+    const refInsurance = (this.mulInsOrderList || []).find(ins => ins.key === opt.val)
+    if (!refInsurance || !refInsurance.huomian) {
+      return ''
+    }
+    if (refInsurance.huomian === 'beiHuomian') {
+      return '被保人'
+    }
+    return '投保人'
+  }
+  getInsuranceTitleHmTag(insurance) {
+    if (!insurance.huomian) {
+      return ''
+    }
+    if (insurance.huomian === 'beiHuomian') {
+      return '被保人'
+    }
+    return '投保人'
+  }
+  getInsuranceSaleStatusTagByKey(key: string | number) {
+    const map = this.insuranceSaleStatus
+    if (!map || typeof map !== 'object' || key === undefined || key === null) {
+      return ''
+    }
+    const status = map[key] ?? map[String(key)]
+    if (status === undefined || status === null) {
+      return ''
+    }
+    return Number(status) === 2 ? '停' : ''
+  }
+  getInsuranceSaleStatusTag(insurance) {
+    return this.getInsuranceSaleStatusTagByKey(insurance.key)
+  }
+  getHuomianTips(insurance, element) {
+    const personOrderList = _get(this.personData, 'personOrderList') || []
+    const applicationInfo = personOrderList.find(p => p.key === 'applicantInfo')
+    const applicationTitle = _get(applicationInfo, 'eleOrderList', []).find(e => e.key === 'title')
+    const applicationSame = _get(applicationInfo, 'eleOrderList', []).find(e => e.key === 'applicantAndInsuredSame')
+    if (!(['touHuomian', 'shuangHuomian'].includes(insurance.huomian) && element.isDisabled)) {
+      return ''
+    }
+    if (!_get(applicationTitle, 'value')) {
+      return '<em>设置</em>投保人信息后选择'
+    }
+    if (_get(applicationSame, 'value') && !insurance.allowSamePerson) {
+      return '投被保人为同一人，<em>修改</em>投保人信息后选择'
+    }
+    return '当前投保人不能加该险种，<em>修改</em>投保人信息后选择'
+  }
+  getAmountUnit(ele) {
+    let digits = isNaN(ele.value * 1) ? 0 : Math.floor(Math.log10(ele.value) + 1)
+    switch (digits) {
+      case 5:
+        return '万'
+      case 6:
+        return '十万'
+      case 7:
+        return '百万'
+      case 8:
+        return '千万'
+      case 9:
+        return '亿'
+      default:
+        return ''
+    }
+  }
+  getRecommendValues(ele) {
+    if (!['baoe', 'baof'].includes(ele.key) || ele.isDisabled) {
+      return null
+    }
+    const insurance = convertEleOrderListToObj(this.ins)
+    return this.recommendValues && this.recommendValues[insurance.key]
+  }
+  onClickRecommendValue(value, ele) {
+    ele.value = value
+    this.emitChange(ele)
+    this.$nextTick(() => {
+      const ref: any = this.$refs[this.ins.key + ele.key + 'item']
+      const ref0 = Array.isArray(ref) ? ref[0] : ref
+      if (ref0 && ref0.validate) {
+        ref0.validate()
+      }
+    })
+  }
+}
+</script>

package/packages/product-info/demo/index.vue

@@ -6,6 +6,7 @@
 <script lang="ts">
 import Vue from 'vue'
 import { Component } from 'vue-property-decorator'
+import { Toast } from 'vant'
 import QS from 'qs'
 import { getPlanbookData } from '../../../src/api/planbook.js'
 import { get as _get } from 'lodash'
@@ -56,7 +57,7 @@ export default class ProductInfoDemo extends Vue {
   }
   cgProduct(product, obj, inst) {
     if (obj.type === 'change') {
-      this.$toast(`${_get(obj, 'insData.eleOrderList[0].labelName')} -> ${_get(obj, 'eleData.labelName')}: ${_get(obj, 'eleData.value')}`)
+      Toast(`${_get(obj, 'insData.eleOrderList[0].labelName')} -> ${_get(obj, 'eleData.labelName')}: ${_get(obj, 'eleData.value')}`)
     }
   }
 }