bxs-tools-ui 3.2.0 → 3.3.0

package/packages/planbook-input/components/handler.js

@@ -1,19 +1,11 @@
-import { convertPersonData, convertProductData, calcTotalBaof, deepCopy } from 'packages/bxs-utils/index';
+import { cloneDeep } from 'lodash'
+import { convertPersonData, convertProductData, calcTotalBaof } from 'packages/bxs-utils/index'
 
 export function convertInputDataToResultData(inputData, options = {}) {
-  let resultData = null;
+  let resultData = null
   if (inputData) {
-    const {
-      title,
-      theme,
-      categorySort,
-      displayFormatSort,
-      commonData,
-      personData,
-      productGroupList,
-      addedServiceList = []
-    } = deepCopy(inputData);
-    const { planbookId, pbType, planName, userUuid } = options;
+    const { title, theme, categorySort, displayFormatSort, commonData, personData, productGroupList, addedServiceList = [] } = cloneDeep(inputData)
+    const { planbookId, pbType, planName, userUuid } = options
     resultData = {
       insuranceTypeId: planbookId,
       pbType,
@@ -28,70 +20,67 @@ export function convertInputDataToResultData(inputData, options = {}) {
       personData: convertPersonData(personData),
       productGroupList: [],
       totalBaof: null
-    };
+    }
 
-    const _productGroupList = productGroupList.filter(g => (g.prodOrderList || []).some(p => p.hadChoice && !p.hide));
+    const _productGroupList = productGroupList.filter(g => (g.prodOrderList || []).some(p => p.hadChoice && !p.hide))
     if (_productGroupList.length) {
       _productGroupList.forEach(g => {
-        g.prodOrderList = g.prodOrderList.filter(p => p.hadChoice && !p.hide);
-      });
+        g.prodOrderList = g.prodOrderList.filter(p => p.hadChoice && !p.hide)
+      })
       // 是否有产品支持多被保人
-      const hasMultipleInsured = _productGroupList.some(g => g.prodOrderList.some(p => p.multipleInsured));
+      const hasMultipleInsured = _productGroupList.some(g => g.prodOrderList.some(p => p.multipleInsured))
       if (!hasMultipleInsured) {
-        resultData.personData.personOrderList = resultData.personData.personOrderList.filter(
-          p => p.key !== 'insured2Info'
-        );
+        resultData.personData.personOrderList = resultData.personData.personOrderList.filter(p => p.key !== 'insured2Info')
       }
 
       _productGroupList.forEach(group => {
         const _productGroup = {
           key: group.key,
           prodOrderList: []
-        };
+        }
         group.prodOrderList.forEach(prod => {
-          const mainInsurance = prod.mulInsOrderList.find(ins => ins.key !== 'common');
+          const mainInsurance = prod.mulInsOrderList.find(ins => ins.key !== 'common')
           prod.mulInsOrderList.forEach((ins, i, arr) => {
             if (Array.isArray(ins.eleOrderList)) {
               // 用于结果页控制字段显示顺序
-              const eleOrderInResult = [];
+              const eleOrderInResult = []
               // refInsuranceId: -1-主险 -2-险种自身
-              const _refId = Number(ins.refInsuranceId);
-              let refInsuranceData = null;
+              const _refId = Number(ins.refInsuranceId)
+              let refInsuranceData = null
               if (_refId && _refId !== -2) {
-                refInsuranceData = _refId === -1 ? mainInsurance : arr.find(e => e.key === _refId);
+                refInsuranceData = _refId === -1 ? mainInsurance : arr.find(e => e.key === _refId)
               }
 
-              const _refEleOrderList =
-                refInsuranceData && refInsuranceData.eleOrderList ? refInsuranceData.eleOrderList : [];
+              const _refEleOrderList = refInsuranceData && refInsuranceData.eleOrderList ? refInsuranceData.eleOrderList : []
               ins.eleOrderList
                 .filter(e => !['title', 'calMethod', 'customRate', 'company'].includes(e.key))
                 .forEach(e => {
-                  const _refElementData = _refEleOrderList.find(e => e.key === e.key);
+                  const _refElementData = _refEleOrderList.find(e => e.key === e.key)
                   if (!e.isHide || (e.isHide && !e.isDisabled && _refElementData && !_refElementData.isHide)) {
                     eleOrderInResult.push({
                       value: e.key,
                       label: e.labelName
-                    });
+                    })
                   }
-                });
-              ins.eleOrderInResult = eleOrderInResult;
+                })
+              ins.eleOrderInResult = eleOrderInResult
             }
-          });
+          })
 
-          const productData = convertProductData(prod);
+          const productData = convertProductData(prod)
           // 双豁免险种处理
           productData.mulInsOrderList.forEach(ins => {
-            const { huomian, shmInsData } = ins;
+            const { huomian, shmInsData } = ins
             if (huomian === 'shuangHuomian' && shmInsData && shmInsData.title) {
-              productData.mulInsOrderList.push(shmInsData);
+              productData.mulInsOrderList.push(shmInsData)
             }
-          });
-          _productGroup.prodOrderList.push(productData);
-        });
-        resultData.productGroupList.push(_productGroup);
-      });
-      resultData.totalBaof = calcTotalBaof(_productGroupList);
+          })
+          _productGroup.prodOrderList.push(productData)
+        })
+        resultData.productGroupList.push(_productGroup)
+      })
+      resultData.totalBaof = calcTotalBaof(_productGroupList)
     }
   }
-  return resultData;
+  return resultData
 }

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

@@ -0,0 +1,235 @@
+@import (reference) 'variables.less';
+
+.bxt-product-show {
+  & .bxt-product-show-container {
+    padding: 12px;
+    background: #fff;
+    border-radius: 6px;
+
+    & .bxt-product-header {
+      position: relative;
+      font-size: 15px;
+      font-weight: bold;
+
+      & .bx-button {
+        line-height: normal;
+      }
+
+      & .bxt-product-header-title {
+        .bxt-nowrap();
+
+        width: 80%;
+
+        &.\--delete {
+          width: 63%;
+        }
+      }
+
+      & .bxt-product-header-btn {
+        position: absolute;
+        top: 50%;
+        right: 0;
+        transform: translateY(-50%);
+
+        & .bxt-button-delete {
+          margin-right: 5px;
+        }
+      }
+    }
+
+    & .bxt-product-body {
+      & .bxt-product-baof {
+        line-height: 32px;
+        font-size: 13px;
+        font-weight: normal;
+        color: var(--bxt-text-minor);
+      }
+
+      & .bxt-product-table {
+        width: 100%;
+        margin-top: 12px;
+        font-size: 14px;
+        color: var(--bxt-text-patch);
+        border-spacing: 0;
+
+        & tr {
+          & td {
+            padding: 6px 6px;
+            border-top: 1px solid var(--bxt-line-split);
+            border-left: 1px solid var(--bxt-line-split);
+            min-width: 3rem;
+            text-align: center;
+
+            &:first-child {
+              width: 7rem;
+              text-align: justify;
+            }
+
+            &:last-child {
+              width: 3rem;
+              border-right: 1px solid var(--bxt-line-split);
+            }
+          }
+
+          &:first-child {
+            & td {
+              text-align: center;
+            }
+          }
+
+          &:last-child {
+            & td {
+              border-bottom: 1px solid var(--bxt-line-split);
+            }
+          }
+        }
+      }
+    }
+  }
+
+  & .bxt-product-aat-container {
+    & .bxt-product-aat-table {
+      width: 100%;
+      margin-top: 9px;
+      border-collapse: collapse;
+      font-size: 14px;
+
+      & .bxt-product-aat-caption {
+        display: flex;
+        position: relative;
+        line-height: normal;
+        padding: 8px;
+        border: 1px solid var(--bxt-line-split);
+        text-align: left;
+
+        & span {
+          & em,
+          & .icon-more_circle {
+            font-style: normal;
+            margin-left: 5px;
+            vertical-align: middle;
+          }
+        }
+
+        & span:first-child {
+          .bxt-nowrap();
+
+          flex: 1;
+          font-weight: bold;
+        }
+
+        & span:last-child {
+          font-weight: normal;
+          font-size: 14px;
+          color: var(--bxt-primary);
+          text-align: right;
+        }
+
+        & h5 {
+          .bxt-nowrap();
+
+          width: 65%;
+          display: inline-block;
+          vertical-align: middle;
+          font-size: 14px;
+        }
+
+        & .bxt-product-aat-modify {
+          vertical-align: middle;
+          color: var(--bxt-primary);
+
+          & span {
+            margin-left: 16px;
+          }
+        }
+      }
+
+      & tbody {
+        & tr {
+          & td {
+            min-width: 24px;
+            padding: 8px 8px 5px;
+            border-bottom: 1px solid var(--bxt-line-split);
+            border-left: 1px solid var(--bxt-line-split);
+            text-align: center;
+            color: var(--bxt-text-patch);
+            vertical-align: middle;
+
+            &.first-child {
+              width: 50px;
+            }
+
+            &.second-child {
+              width: 110px;
+            }
+
+            &:last-child {
+              border-right: 1px solid var(--bxt-line-split);
+            }
+          }
+        }
+      }
+    }
+  }
+
+  & .bxt-product-ade-container {
+    margin-top: 1rem;
+    text-align: left;
+    font-size: 14px;
+    overflow: auto;
+
+    & table {
+      width: 100%;
+      border-collapse: collapse;
+
+      & caption {
+        position: relative;
+        padding: 12px 8px 10px;
+        border: 1px solid var(--bxt-line-split);
+        text-align: left;
+
+        & h5 {
+          .bxt-nowrap();
+
+          width: 15rem;
+          font-size: 14px;
+        }
+
+        & .bxt-product-ade-button {
+          .bxt-vertical-center();
+
+          display: inline-block;
+          color: var(--bxt-primary);
+          right: 8px;
+        }
+      }
+
+      & thead,
+      & tbody {
+        text-align: center;
+
+        & tr {
+          display: table-row;
+
+          & td {
+            position: relative;
+            border-bottom: 1px solid var(--bxt-line-split);
+            border-left: 1px solid var(--bxt-line-split);
+            min-width: 36px;
+            color: var(--bxt-text-patch);
+            vertical-align: middle;
+            padding: 10px 8px 8px;
+
+            &:first-child {
+              width: 36px;
+            }
+
+            &:last-child {
+              border-right: 1px solid var(--bxt-line-split);
+            }
+          }
+        }
+      }
+    }
+  }
+}