bxs-tools-ui 1.0.21 → 1.0.25

package/packages/insure-calculate/index.vue

@@ -5,45 +5,25 @@
         <header class="bxt-component-header">
           <span class="bxt-component-header_title">{{ title }}</span>
           <span @click="closeInsureCalculate">
-            <bxs-icon
-              class="bxt-component-header_close"
-              name="close"
-            ></bxs-icon>
+            <bxs-icon class="bxt-component-header_close" name="close"></bxs-icon>
           </span>
         </header>
       </slot>
     </div>
-    <div
-      class="bxt-component-container"
-      :class="{ 'bxt-mb50': showFooter }"
-      v-if="widgets && widgets.length"
-    >
-      <div
-        v-for="(item, index) in widgets"
-        :key="item.label + item.riskCode + index"
-        class="bxt-insure-calculte"
-      >
+    <div class="bxt-component-container" :class="{ 'bxt-mb50': showFooter }" v-if="widgets && widgets.length">
+      <div v-for="(item, index) in widgets" :key="item.label + item.riskCode + index" class="bxt-insure-calculte">
         <!-- 自定义文本展示 -->
-        <div
-          v-if="item.type === 'v-text' && item.hidden === 0"
-          class="bxt-block bxt-text bxt-bb1"
-        >
+        <div v-if="item.type === 'v-text' && item.hidden === 0" class="bxt-block bxt-text bxt-bb1">
           <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
           <span class="bxt-fs13">{{ item.name }}</span>
         </div>
         <!-- 文本展示 -->
-        <div
-          v-if="item.type === 'text' && item.hidden === 0"
-          class="bxt-block bxt-text bxt-bb1"
-        >
+        <div v-if="item.type === 'text' && item.hidden === 0" class="bxt-block bxt-text bxt-bb1">
           <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
           <span class="bxt-fs13">{{ item.name }}</span>
         </div>
         <!-- checkbox选择项 -->
-        <div
-          v-if="item.type === 'select_checkbox' && item.hidden === 0"
-          class="bxt-block bxt-select-content"
-        >
+        <div v-if="item.type === 'select_checkbox' && item.hidden === 0" class="bxt-block bxt-select-content">
           <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
           <div class="bxt-select-content-box">
             <template v-for="(it, optsIndex) in item.opts[item.key]">
@@ -67,10 +47,7 @@
           </div>
         </div>
         <!-- 半浮层选择项 index -->
-        <div
-          class="bxt-block bxt-bb1"
-          v-if="item.type === 'select_picker' && item.hidden === 0"
-        >
+        <div class="bxt-block bxt-bb1" v-if="item.type === 'select_picker' && item.hidden === 0">
           <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
           <div class="bxt-flex-center" @click="openPicker(item)">
             <div class="bxt-select-text bxt-fs13">
@@ -82,10 +59,7 @@
         <div v-if="item.type === 'select_number_range' && item.hidden === 0">
           <div class="bxt-block bxt-bb1">
             <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
-            <div
-              class="bxt-flex-center"
-              @click="openSelectNumberRangePicker(item)"
-            >
+            <div class="bxt-flex-center" @click="openSelectNumberRangePicker(item)">
               <div class="bxt-select-text bxt-fs13">
                 {{ item.opts[item.key][item.index].name }}
               </div>
@@ -108,27 +82,15 @@
           </div>
         </div>
         <!-- 日历 -->
-        <div
-          class="bxt-block bxt-calendar bxt-bb1"
-          v-if="item.type === 'calendar' && item.hidden === 0"
-        >
+        <div class="bxt-block bxt-calendar bxt-bb1" v-if="item.type === 'calendar' && item.hidden === 0">
           <span class="bxt-mr15 bxt-flex1">{{ item.label }}</span>
-          <div
-            class="bxt-flex-center bxt-calendar-text bxt-fs13"
-            @click="openDatePicker(item)"
-          >
+          <div class="bxt-flex-center bxt-calendar-text bxt-fs13" @click="openDatePicker(item)">
             <div class="bxt-minwidth-70">{{ item.current.v }}</div>
-            <img
-              class="bxt-signin"
-              src="//media.winbaoxian.com/autoUpload/common/signin_0e67230840f371a.png"
-            />
+            <img class="bxt-signin" src="//media.winbaoxian.com/autoUpload/common/signin_0e67230840f371a.png" />
           </div>
         </div>
         <!-- 职业 -->
-        <div
-          class="bxt-block bxt-bb1"
-          v-if="item.type === 'profession' && item.hidden === 0"
-        >
+        <div class="bxt-block bxt-bb1" v-if="item.type === 'profession' && item.hidden === 0">
           <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
           <div class="bxt-flex-center bxt-fs13">
             <span class="bxt-color-3 bxt-mr15">{{ item.tv }}</span>
@@ -136,22 +98,14 @@
           </div>
         </div>
         <!-- 地址 -->
-        <div
-          class="bxt-block bxt-bb1"
-          v-if="item.type === 'address' && item.hidden === 0"
-        >
+        <div class="bxt-block bxt-bb1" v-if="item.type === 'address' && item.hidden === 0">
           <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
           <div class="bxt-flex-center bxt-fs13">
-            <span class="bxt-color-3 bxt-red" @click="showAddress(item)">{{
-              item.tv || '请选择投保地区'
-            }}</span>
+            <span class="bxt-color-3 bxt-red" @click="showAddress(item)">{{ item.tv || '请选择投保地区' }}</span>
           </div>
         </div>
         <!--输入框-->
-        <div
-          class="bxt-block bxt-input bxt-bb1"
-          v-if="item.type === 'input_number_range' && item.hidden === 0"
-        >
+        <div class="bxt-block bxt-input bxt-bb1" v-if="item.type === 'input_number_range' && item.hidden === 0">
           <span class="bxt-mr15 bxt-flex1 bxt-fs30">{{ item.label }}</span>
           <div class="bxt-fs13">
             <div class="bxt-input-box">
@@ -180,9 +134,7 @@
       >
         <div class="bxt-content bxt-bb1">
           <div class="bxt-block-term">
-            <span class="bxt-mr15 bxt-flex1 bxt-fs30 bxt-lh12">{{
-              item.name
-            }}</span>
+            <span class="bxt-mr15 bxt-flex1 bxt-fs30 bxt-lh12">{{ item.name }}</span>
             <div class="bxt-flex-center bxt-fs13">
               <span class="bxt-value">{{ item.termValue }}</span>
               <template v-if="!!item.content">
@@ -195,12 +147,7 @@
               </template>
             </div>
           </div>
-          <div
-            class="bxt-des"
-            v-show="item.toggle"
-            v-if="!!item.content"
-            v-html="item.content"
-          ></div>
+          <div class="bxt-des" v-show="item.toggle" v-if="!!item.content" v-html="item.content"></div>
         </div>
       </div>
     </template>
@@ -225,39 +172,19 @@
       :prevent-scroll-through="true"
     />
     <!-- bxs组件：地址查询 -->
-    <bxs-area
-      v-model="isShowArea"
-      :area-select="defaultArea"
-      :area-data="areaData"
-      @confirm="confirmArea"
-    >
-    </bxs-area>
+    <bxs-area v-model="isShowArea" :area-select="defaultArea" :area-data="areaData" @confirm="confirmArea"> </bxs-area>
   </div>
 </template>
 <script lang="ts">
 import { Component, Prop, Vue } from 'vue-property-decorator';
 import { parseTime } from '@src/js/utils.js';
-import {
-  Picker,
-  DatetimePicker,
-  ProfessionList,
-  Toast,
-  Icon,
-  Button,
-  Area,
-  Input
-} from 'bxs-ui-vue';
+import { Picker, DatetimePicker, ProfessionList, Toast, Icon, Button, Area, Input } from 'bxs-ui-vue';
 import 'bxs-ui-vue/lib/index.css';
 Vue.use(Picker);
 Vue.use(DatetimePicker);
 Vue.use(Toast);
 
-import {
-  insureCalculate,
-  hasPlanParams,
-  getUuid,
-  getAddress
-} from 'packages/bxs-utils/index.js';
+import { insureCalculate, hasPlanParams, getUuid, getAddress } from 'packages/bxs-utils/index.js';
 
 const defaultCalculateData: any = {
   widgets: [],
@@ -429,9 +356,7 @@ export default class InsureCalculate extends Vue {
     // 初始化试算
     this.hasInit = true;
     const postParams = {
-      current_data: this.hasCalculateData
-        ? this.calculateData.current_data
-        : null,
+      current_data: this.hasCalculateData ? this.calculateData.current_data : null,
       product_id: this.productId,
       scenario: 'h5Widget'
     };
@@ -555,9 +480,7 @@ export default class InsureCalculate extends Vue {
         vm.formateAreaData(vm.list);
         vm.isShowArea = true;
       } else {
-        vm.$toast(
-          addressData && addressData.message ? addressData.message : ''
-        );
+        vm.$toast(addressData && addressData.message ? addressData.message : '');
       }
     } catch (error) {
       vm.$toast(error && error.info ? error.info : '地址信息获取失败');
@@ -595,20 +518,12 @@ export default class InsureCalculate extends Vue {
     let orginTarget;
     if (currTarget.duty) {
       orginTarget = self.widgets.find(
-        item =>
-          item.riskCode === currTarget.riskCode &&
-          item.key === currTarget.key &&
-          item.duty === currTarget.duty
+        item => item.riskCode === currTarget.riskCode && item.key === currTarget.key && item.duty === currTarget.duty
       );
     } else {
-      orginTarget = this.widgets.find(
-        item =>
-          item.riskCode === currTarget.riskCode && item.key === currTarget.key
-      );
+      orginTarget = this.widgets.find(item => item.riskCode === currTarget.riskCode && item.key === currTarget.key);
     }
-    const defaultValue = item.index
-      ? [item.opts[item.key][item.index].name]
-      : [null];
+    const defaultValue = item.index ? [item.opts[item.key][item.index].name] : [null];
     self.$picker({
       title: item.label,
       valueKey: 'name',
@@ -632,13 +547,8 @@ export default class InsureCalculate extends Vue {
     console.log('openSelectNumberRangePicker', item);
     let self: any = this;
     const currTarget = item;
-    const orginTarget = self.widgets.find(
-      item =>
-        item.riskCode === currTarget.riskCode && item.key === currTarget.key
-    );
-    const defaultValue = item.index
-      ? [item.opts[item.key][item.index].name]
-      : [null];
+    const orginTarget = self.widgets.find(item => item.riskCode === currTarget.riskCode && item.key === currTarget.key);
+    const defaultValue = item.index ? [item.opts[item.key][item.index].name] : [null];
     self.$picker({
       title: item.label,
       valueKey: 'name',
@@ -678,12 +588,8 @@ export default class InsureCalculate extends Vue {
     console.log('openDatePicker', item);
     let self: any = this;
     const currTarget = item;
-    const orginTarget = self.widgets.find(
-      item =>
-        item.riskCode === currTarget.riskCode && item.key === currTarget.key
-    );
-    const defaultValue =
-      item.current && item.current.v ? new Date(item.current.v) : new Date();
+    const orginTarget = self.widgets.find(item => item.riskCode === currTarget.riskCode && item.key === currTarget.key);
+    const defaultValue = item.current && item.current.v ? new Date(item.current.v) : new Date();
     self.$datetime({
       title: item.label,
       value: defaultValue,
@@ -704,16 +610,10 @@ export default class InsureCalculate extends Vue {
     let orginTarget;
     if (currTarget.duty) {
       orginTarget = this.widgets.find(
-        item =>
-          item.riskCode === currTarget.riskCode &&
-          item.key === currTarget.key &&
-          item.duty === currTarget.duty
+        item => item.riskCode === currTarget.riskCode && item.key === currTarget.key && item.duty === currTarget.duty
       );
     } else {
-      orginTarget = this.widgets.find(
-        item =>
-          item.riskCode === currTarget.riskCode && item.key === currTarget.key
-      );
+      orginTarget = this.widgets.find(item => item.riskCode === currTarget.riskCode && item.key === currTarget.key);
     }
     orginTarget.current.v = currClickItem.value;
     this.handleSaveCalculate(item);
@@ -723,8 +623,7 @@ export default class InsureCalculate extends Vue {
     const currValue = Number(item.current.v);
     const self = this;
     if (currValue < item.minValue || currValue > item.maxValue) {
-      item.errorMessage =
-        '请输入' + item.minValue + '到' + item.maxValue + '之间的整数';
+      item.errorMessage = '请输入' + item.minValue + '到' + item.maxValue + '之间的整数';
     } else if (currValue % item.step !== 0) {
       item.errorMessage = '请输入' + item.step + '的倍数';
     } else {
@@ -772,40 +671,30 @@ export default class InsureCalculate extends Vue {
       // 增加current字段，保存current_data的数据
       if (item.duty) {
         item.current = current = currentData.find(
-          it =>
-            it.k === item.key && it.risk === item.riskCode && item.duty === it.d
+          it => it.k === item.key && it.risk === item.riskCode && item.duty === it.d
         );
       } else {
-        item.current = current = currentData.find(
-          it => it.k === item.key && it.risk === item.riskCode
-        );
+        item.current = current = currentData.find(it => it.k === item.key && it.risk === item.riskCode);
       }
-      if (
-        (item.type === 'select' || item.type === 'input') &&
-        item.opts &&
-        item.opts[item.key]
-      ) {
-        const isNumberRange = item.opts[item.key].some(
-          it => it.opt_type === 'number_range'
-        );
+      if ((item.type === 'select' || item.type === 'input') && item.opts && item.opts[item.key]) {
+        const isNumberRange = item.opts[item.key].some(it => it.opt_type === 'number_range');
         if (isNumberRange) {
           item.type = `${item.type}_number_range`;
         }
       }
       // 投保年龄是区间的修正
-      if (
-        item.type === 'select' &&
-        item.key === 'detail_age' &&
-        current &&
-        current.sv
-      ) {
+      if (item.type === 'select' && item.key === 'detail_age' && current && current.sv) {
         item.current.v = current.sv;
       }
       if (~item.key.indexOf('#')) {
         if (!item.opts) {
           item.opts = {};
+        } else if (!item.opts[item.key]) {
+          let key = item.key.split('#')[0];
+          if (item.opts[key]) {
+            item.opts[item.key] = item.opts[key];
+          }
         }
-        item.key = item.key.split('#')[0];
       }
       switch (item.type) {
         case 'v-text':
@@ -883,9 +772,7 @@ export default class InsureCalculate extends Vue {
           }
         });
       }
-      const curr = item.opts[item.key].find(
-        it => it.opt_type === 'number_range'
-      );
+      const curr = item.opts[item.key].find(it => it.opt_type === 'number_range');
       if (curr) {
         this.$set(item, 'showInput', true);
         this.$set(item, 'minValue', Number(curr.value.split('-')[0]));
@@ -923,9 +810,7 @@ export default class InsureCalculate extends Vue {
       this.defaultArea = current.v;
       const arrAddress = this.getArea(this.list, '', []);
       if (arrAddress && arrAddress.length) {
-        const currAddress = arrAddress.find(
-          item => String(item.areaCode) === String(current.v)
-        );
+        const currAddress = arrAddress.find(item => String(item.areaCode) === String(current.v));
         if (currAddress && currAddress.areaCode) {
           item.tv = currAddress.des;
         }
@@ -994,11 +879,7 @@ export default class InsureCalculate extends Vue {
     let cityCopy = [];
     if (hasCounty) {
       county.forEach(item => {
-        if (
-          this.returnClassify.findIndex(
-            v => v == item.classify || !item.classify
-          ) > -1
-        ) {
+        if (this.returnClassify.findIndex(v => v == item.classify || !item.classify) > -1) {
           countyCopy.push(item);
         }
       });
@@ -1008,11 +889,7 @@ export default class InsureCalculate extends Vue {
     } else {
       if (hasCity) {
         city.forEach(item => {
-          if (
-            this.returnClassify.findIndex(
-              v => v == item.classify || !item.classify
-            ) > -1
-          ) {
+          if (this.returnClassify.findIndex(v => v == item.classify || !item.classify) > -1) {
             cityCopy.push(item);
           }
         });
@@ -1058,10 +935,7 @@ export default class InsureCalculate extends Vue {
       this.widgets.forEach(item => {
         if (item.index === undefined) {
           currentData.push(item.current);
-        } else if (
-          (item.index || Number(item.index) === 0) &&
-          !item.showInput
-        ) {
+        } else if ((item.index || Number(item.index) === 0) && !item.showInput) {
           const temp = JSON.parse(JSON.stringify(item.current));
           temp.v = item.opts[item.key][item.index].value;
           currentData.push(temp);
@@ -1095,18 +969,13 @@ export default class InsureCalculate extends Vue {
       this.isDevelop = this.isDev;
     }
     if (this.isDevelop) {
-      this.getCalculateApi =
-        'https://insurance2a-api.wyins.net.cn/api/product/data/calculate';
-      this.getAreaCodeApi =
-        'https://insurance2a-api.wyins.net.cn/api/product/data/getAreaCode';
+      this.getCalculateApi = 'https://insurance2a-api.wyins.net.cn/api/product/data/calculate';
+      this.getAreaCodeApi = 'https://insurance2a-api.wyins.net.cn/api/product/data/getAreaCode';
       this.getUuidApi = 'http://app.winbaoxian.cn/planBook/common/currentUser';
     } else {
-      this.getCalculateApi =
-        'https://insurance2a-api.wyins.net/api/product/data/calculate';
-      this.getAreaCodeApi =
-        'https://insurance2a-api.wyins.net/api/product/data/getAreaCode';
-      this.getUuidApi =
-        'https://app.winbaoxian.com/planBook/common/currentUser';
+      this.getCalculateApi = 'https://insurance2a-api.wyins.net/api/product/data/calculate';
+      this.getAreaCodeApi = 'https://insurance2a-api.wyins.net/api/product/data/getAreaCode';
+      this.getUuidApi = 'https://app.winbaoxian.com/planBook/common/currentUser';
     }
   }
 }

package/packages/person-info/index.vue

@@ -1,11 +1,6 @@
 <template>
   <div class="bxt-person-info">
-    <bxs-form
-      class="bxt-person-info-form"
-      ref="personForm"
-      :model="personForm"
-      :is-content-vertical-alignment="false"
-    >
+    <bxs-form class="bxt-person-info-form" ref="personForm" :model="personForm" :is-content-vertical-alignment="false">
       <template v-for="ele in personData.eleOrderList">
         <template v-if="ele.componentName === 'cmCommonTitle'">
           <bxs-form-item :key="ele.key">
@@ -41,12 +36,7 @@
             </bxs-radio-group>
           </bxs-form-item>
         </template>
-        <template
-          v-if="
-            ele.componentName === 'cmCommonSelect' ||
-              ele.componentName === 'cmCommonDate'
-          "
-        >
+        <template v-if="ele.componentName === 'cmCommonSelect' || ele.componentName === 'cmCommonDate'">
           <bxs-form-item
             v-if="isCheckedPerson(personData) && !ele.isHide"
             :key="ele.key"
@@ -62,8 +52,14 @@
               :title="ele.label"
               :options="ele.options"
               :placeholder="ele.placeholder"
-              right-icon="arrow-right"
+              :right-icon="
+                ele.key === 'age' && personData.eleOrderList.find(ele => ele.key === 'birthday')
+                  ? 'calendar'
+                  : 'arrow-right'
+              "
+              :icon-color="ele.iconColor"
               @change="change(ele)"
+              @clickIcon="clickIcon"
             />
           </bxs-form-item>
         </template>
@@ -73,16 +69,14 @@
 </template>
 <script lang="ts">
 import Vue from 'vue';
-import {
-  convertEleOrderListToObj,
-  personDataHandler,
-  productDataHandler
-} from 'packages/bxs-utils/index.js';
+import { convertEleOrderListToObj, personDataHandler, productDataHandler } from 'packages/bxs-utils/index.js';
+import { parseTime } from '@src/js/utils.js';
 import { Component, Prop } from 'vue-property-decorator';
 import { Form, FormItem, Input, RadioGroup, Radio } from 'bxs-ui-vue';
 import SelectItem from 'packages/components/form-item/select-item.vue';
 import TitleItem from 'packages/components/form-item/title-item.vue';
 import 'bxs-ui-vue/esm/index.css';
+
 @Component({
   name: 'BxtPersonInfo',
   components: {
@@ -132,15 +126,35 @@ export default class BxtPersonInfo extends Vue {
         productGroupList.forEach(g => {
           g.prodOrderList &&
             g.prodOrderList.map(p => {
-              productDataHandler(p,
-                this.verifyData && this.verifyData[p.key],
-                allPersonsData);
+              productDataHandler(p, this.verifyData && this.verifyData[p.key], allPersonsData);
             });
         });
       }
     }
     this.$emit('change', this.personData, ele);
   }
+  clickIcon(ele): any {
+    let self: any = this;
+    if (ele.disabled) {
+      return 0;
+    }
+    if (ele.key === 'age') {
+      const birthday = self.personData.eleOrderList.find(ele => ele.key === 'birthday');
+      let defaultValue = birthday.value ? new Date(birthday.value) : birthday.defaulValue || new Date();
+      self.$datetime({
+        value: defaultValue,
+        type: 'date',
+        minDate: birthday.minDate,
+        maxDate: birthday.maxDate,
+        confirmButtonColor: '#508cee',
+        confirm(data) {
+          birthday.value = parseTime(data, '{y}/{m}/{d}');
+          self.change(birthday);
+        }
+      });
+      return;
+    }
+  }
 }
 </script>
 <style lang="postcss">

package/packages/planbook-input/components/footer.vue

@@ -13,8 +13,7 @@
         <div class="bxt-footer-info">
           <p class="bxt-info-title">首年总保费</p>
           <p class="bxt-info-baofei">
-            {{ totalBaoFei.toFixed(2).split('.')[0]
-            }}<em>.{{ totalBaoFei.toFixed(2).split('.')[1] }}元</em>
+            {{ totalBaoFei.toFixed(2).split('.')[0] }}<em>.{{ totalBaoFei.toFixed(2).split('.')[1] }}元</em>
           </p>
         </div>
       </li>

package/packages/planbook-input/components/product-table.vue

@@ -1,16 +1,8 @@
 <template>
-  <div
-    :class="['bxt-product-show', `bxt-product-id-${productData.key}`]"
-    v-if="productData"
-  >
+  <div :class="['bxt-product-show', `bxt-product-id-${productData.key}`]" v-if="productData">
     <div class="bxt-product-show-container" :key="productData.key">
       <header class="bxt-product-header">
-        <p
-          :class="[
-            'bxt-product-header-title',
-            isShowDeleteBtn() ? 'bxt-product-header-title--delete' : ''
-          ]"
-        >
+        <p :class="['bxt-product-header-title', isShowDeleteBtn() ? 'bxt-product-header-title--delete' : '']">
           {{ productData.titleName }}
         </p>
         <div class="bxt-product-header-btn">
@@ -139,11 +131,7 @@ export default class BxtProductTable extends Vue {
       this.groupData &&
       this.groupData.prodOrderList &&
       this.groupData.prodOrderList.findIndex(p => p.key === this.productKey);
-    return (
-      this.productData.hadChoice &&
-      !this.productData.required &&
-      index >= this.groupData.defNum
-    );
+    return this.productData.hadChoice && !this.productData.required && index >= this.groupData.defNum;
   }
   overlayClose() {
     // 单击确定按钮关闭时，不用还原数据
@@ -168,12 +156,14 @@ export default class BxtProductTable extends Vue {
     this.isShowProductSheet = true;
   }
   confirm(prod) {
-    this.$emit('confirm',
+    this.$emit(
+      'confirm',
       {
         groupKey: this.groupKey,
         productKey: this.productKey
       },
-      this);
+      this
+    );
   }
   close() {
     this.isCkConfirm = true;