bxs-tools-ui 2.0.7 → 3.0.0-1

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

@@ -108,7 +108,16 @@
         </table>
       </div>
     </div>
-    <CommonPopup v-model="popupConf.prodVisible" :title="popupConf.title" round closeable position="bottom" :z-index="100" @confirm="confirm(productData)">
+    <CommonPopup
+      v-model="popupConf.prodVisible"
+      :title="popupConf.title"
+      height="90%"
+      round
+      closeable
+      position="bottom"
+      :z-index="100"
+      @confirm="confirm(productData)"
+    >
       <ProductInfo
         ref="productInfo"
         :input-data="inputData"
@@ -126,6 +135,7 @@
     <CommonPopup
       v-model="takePopupConfig.visible"
       :title="takePopupConfig.title"
+      height="90%"
       round
       closeable
       position="bottom"
@@ -188,11 +198,13 @@ import { initAddAndTakePopupConfig } from 'packages/add-and-take/handler.ts';
 import { ADD_AND_TAKE_TITLE_MAP } from 'packages/add-and-take/constant.ts';
 import { convertInputDataToResultData } from './handler';
 
-import CommonPopup from 'packages/components/common-popup/index.vue';
+import CommonPopup from '@src/components/common/common-popup.vue';
 import ProductInfo from 'packages/product-info/index.vue';
 import AddAndTake from 'packages/add-and-take/index.vue';
 import AdjustBaoe from 'packages/adjust-baoe/index.vue';
 
+import './product-table.css';
+
 const { insuranceId } = QS.parse(`${location.href.split('?')[1]}`) || {};
 
 function initPopupConf() {
@@ -365,19 +377,32 @@ export default class BxtProductTable extends Vue {
         insuredAge: _get(resultData, 'personData.personOrderList[0].age'),
         periodNum: ins.periodNum,
         [name]: ins[name],
-        [name]: {
-          accountPart: 'addAndTake',
-          addAndTakeData: [
-            { key: 'add', adjustData: [[6, 6, 8000000, '']] },
-            {
-              key: 'take',
-              adjustData: [
-                [7, 7, 1000000, '风请小派送'],
-                [8, 8, 10000, '风派送']
+        [name]: isReduceBaof
+          ? {
+              accountPart: 'take',
+              addAndTakeData: [
+                {
+                  key: 'take',
+                  adjustData: [
+                    [7, 7, 1000000, '逐浪飞花有'],
+                    [8, 8, 10000, '逐浪飞花角']
+                  ]
+                }
               ]
             }
-          ]
-        },
+          : {
+              accountPart: 'addAndTake',
+              addAndTakeData: [
+                { key: 'add', adjustData: [[6, 6, 8000000, '']] },
+                {
+                  key: 'take',
+                  adjustData: [
+                    [7, 7, 1000000, '风请小派送'],
+                    [8, 8, 10000, '风派送']
+                  ]
+                }
+              ]
+            },
         [isReduceBaof ? 'reduceBaofInsuranceId' : 'accountInsuranceId']: ins.key,
         interestData: null
       };
@@ -496,6 +521,3 @@ export default class BxtProductTable extends Vue {
   }
 }
 </script>
-<style lang="postcss">
-@import './product-table.css';
-</style>

package/packages/planbook-input/index.css

@@ -1,8 +1,11 @@
 @import 'base.css';
+@import 'color.css';
 
 .bxt-planbook {
-	font-size: 15px;
+	min-height: 100vh;
+	font-size: 14px;
 	box-sizing: border-box;
+	background: var(--color-bg-primary);
 
 	&::after {
 		display: block;

package/packages/planbook-input/index.vue

@@ -6,12 +6,12 @@
           <PersonInfo
             :key="person.key"
             :input-data="inputData"
-            :verify-data="planbookData?.verifyData"
+            :verify-data="planbookData && planbookData.verifyData"
             :person-data="person"
             :is-show-crm-person="true"
             :params="{
-              brokerFlag: planbookData?.brokerFlag,
-              planbookId: planbookData?.pbId
+              brokerFlag: planbookData && planbookData.brokerFlag,
+              planbookId: planbookData && planbookData.pbId
             }"
             @change="changePersonInfo"
           />
@@ -26,13 +26,13 @@
             :key="p.key"
             :result-uuid="URL_PARAM.uuid"
             :input-data="inputData"
-            :verify-data="planbookData?.verifyData"
+            :verify-data="planbookData && planbookData.verifyData"
             :params="{
               planbookId: Number(URL_PARAM.planbookId),
               publicPbUuid: URL_PARAM.publicPbUuid,
               groupKey: g.key,
               productKey: p.key,
-              interestProductList: planbookData?.interestProductList
+              interestProductList: planbookData && planbookData.interestProductList
             }"
             @confirm="confirmProduct"
             @changePerson="changePersonInfo"
@@ -57,6 +57,7 @@ import { createMd5Token } from '@src/js/md5Token.js';
 import PersonInfo from '../person-info/index.vue';
 import ProductTable from './components/product-table.vue';
 import InputFooter from './components/footer.vue';
+import './index.css';
 
 Vue.use(Vant);
 @Component({
@@ -163,8 +164,13 @@ export default class BxtPlanbookInput extends Vue {
         console.log(err);
       });
   }
-  createPlanbook(planbookData: IPlanbookData): any {
+  createPlanbook(planbookData: IPlanbookData | null): any {
     const { URL_PARAM, inputData } = this;
+    if (!planbookData || !inputData) {
+      Toast('数据不完整');
+      return Promise.reject();
+    }
+
     const { pbType, planbookId, publicPbUuid, userUuid } = URL_PARAM;
     const options: any = {
       pbType,
@@ -206,6 +212,3 @@ export default class BxtPlanbookInput extends Vue {
   }
 }
 </script>
-<style lang="postcss">
-@import './index.css';
-</style>

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

@@ -8,6 +8,7 @@ import Vue from 'vue';
 import { Component } from 'vue-property-decorator';
 import QS from 'qs';
 import { PLANBOOK_API_HOSTNAME } from '@src/js/variables.js';
+import { get as _get } from 'lodash';
 import { initPageData } from '../../planbook-input/helper';
 import ProductInfo from '../index.vue';
 
@@ -26,6 +27,7 @@ export default class ProductInfoDemo extends Vue {
     if (!this.URL_PARAM.publicPbUuid) {
       this.URL_PARAM.publicPbUuid = '5d6499946bbb47bb8f6a286e9d4eee77';
     }
+    document.body.style.backgroundColor = '#f2f2f2';
     this.getPlanbookData();
   }
   getUrlParam() {
@@ -67,8 +69,8 @@ export default class ProductInfoDemo extends Vue {
       });
   }
   cgProduct(product, obj, inst) {
-    if (obj.type === 'change' && obj.ins && obj.ele) {
-      this.$toast(`${obj.ins.eleOrderList[0].labelName} -> ${obj.ele.labelName}: ${obj.ele.value}`);
+    if (obj.type === 'change') {
+      this.$toast(`${_get(obj, 'insData.eleOrderList[0].labelName')} -> ${_get(obj, 'eleData.labelName')}: ${_get(obj, 'eleData.value')}`);
     }
   }
 }

package/packages/product-info/index.css

@@ -1,4 +1,5 @@
 @import 'base.css';
+@import 'color.css';
 
 .bxt-product-info {
 	padding: 10px;
@@ -11,24 +12,22 @@
 		border-radius: 6px;
 
 		& .bxt-custom-result-title {
-			padding: 15px;
 			position: relative;
+			padding: 15px;
 
-			& .bxt-custom-result-title_desc {
+			& .bxt-desc {
 				& .icon-arrows_up,
 				& .icon-arrows_down {
 					color: var(--color-text-assist);
 				}
 			}
 
-			& .bx-switch-box {
-				@apply --vertical-center;
-
+			& .van-switch {
+				position: absolute;
+				top: 50%;
 				right: 15px;
-
-				& .bx-switch-circle {
-					pointer-events: none;
-				}
+				transform: translateY(-50%);
+				vertical-align: middle;
 			}
 		}
 
@@ -44,11 +43,16 @@
 		background: white;
 		margin-bottom: 9px;
 		border-radius: 6px;
+		overflow: hidden;
 
 		&:last-child {
 			margin-bottom: 0;
 		}
 
+		& .van-cell::after {
+			border-bottom: 0;
+		}
+
 		&.bxt-product-info-form-follow {
 			border-bottom-left-radius: 0;
 			border-bottom-right-radius: 0;
@@ -60,135 +64,157 @@
 			}
 		}
 
-		& .bx-form-item {
-			text-align: right;
+		& .bx-form-item__inner {
+			& .bx-form-item__content {
+				& input {
+					text-align: right;
+				}
+
+				& .bx-input-icon {
+					& .bx-icon,
+					& .icon-edit2 {
+						color: var(--color-text-minor) !important;
+					}
+				}
 
-			&::after {
-				height: 0;
+				& .bxt-titile-content {
+					font-size: 15px;
+				}
 			}
+		}
 
+		& .bxt-ins-form-radio-btn {
 			& .bx-form-item__inner {
 				& .bx-form-item__content {
-					& input {
-						text-align: right;
-					}
+					margin-right: -5px;
 
-					& .bx-input-icon {
-						& .bx-icon,
-						& .icon-edit2 {
-							color: var(--color-text-minor) !important;
-						}
+					& .bx-radio-warp {
+						padding: 10px 5px;
 					}
 
-					& .bxt-titile-content {
-						font-size: 15px;
+					& input {
+						text-align: right;
 					}
 				}
 			}
+		}
 
-			&.bxt-ins-form-radio-btn {
-				& .bx-form-item__inner {
-					& .bx-form-item__content {
-						margin-right: -5px;
+		& .bxt-ins-form-radio {
+			text-align: left;
 
-						& .bx-radio-warp {
-							padding: 10px 5px;
-						}
+			& .van-radio-group {
+				width: 100%;
 
-						& input {
-							text-align: right;
-						}
-					}
-				}
-			}
+				& .van-radio {
+					width: 100%;
+					align-items: flex-start;
 
-			&.bxt-ins-form-radio {
-				text-align: left;
+					& .icon-choose_none_line {
+						color: var(--color-text-patch);
+					}
 
-				& .bx-radio-warp {
-					padding-left: 0;
-					padding-right: 0;
-					margin-right: 15px;
-					text-align: left;
+					& .icon-multiple_choice {
+						color: var(--color-primary);
+					}
 
-					& .bx-radio-icon-warp {
-						vertical-align: middle;
+					& .van-radio__icon--disabled {
+						& .icon-choose_none_line,
+						& .icon-multiple_choice {
+							color: var(--color-text-disabled);
+						}
 					}
-				}
 
-				& .bxt-ins-form-radio-content {
-					display: inline-block;
-
-					& .bxt-ins-form-radio--code {
-						line-height: 1.45;
-						margin-right: 4px;
-						padding: 0 4px;
-						border-radius: 4px;
-						color: #ff703e;
-						border: 1px solid #ff703e;
-						font-size: 12px;
-						transform: scale(0.8334);
-						transform-origin: left center;
-						vertical-align: 1px;
+					& .bx-radio-warp {
+						padding-left: 0;
+						padding-right: 0;
+						margin-right: 15px;
+						text-align: left;
+
+						& .bx-radio-icon-warp {
+							vertical-align: middle;
+						}
 					}
 
-					& .bxt-ins-form-radio--tx {
+					& .bxt-ins-form-radio-content {
 						display: inline-block;
-						width: auto;
-						line-height: 1.45;
-						max-width: 15rem;
-						font-size: 14px;
-						vertical-align: top;
-
-						&.bxt-ins-form-radio--width {
-							max-width: 12rem;
+
+						& .bxt-ins-form-radio--code {
+							line-height: 20px;
+							margin-right: 4px;
+							padding: 0 4px;
+							border-radius: 4px;
+							color: #ff703e;
+							border: 1px solid #ff703e;
+							font-size: 12px;
+							transform: scale(0.8334);
+							transform-origin: left center;
+							vertical-align: top;
+						}
+
+						& .bxt-ins-form-radio--tx {
+							display: inline-block;
+							width: auto;
+							line-height: 20px;
+							max-width: 15rem;
+							font-size: 14px;
+							vertical-align: top;
+
+							&.bxt-ins-form-radio--width {
+								max-width: 12rem;
+							}
 						}
-					}
 
-					& .bxt-ins-form-radio--tag {
-						margin-left: 9px;
-						color: #f90;
-						font-size: 12px;
-						line-height: normal;
-						vertical-align: middle;
+						& .bxt-ins-form-radio--tag {
+							margin-left: 9px;
+							color: #f90;
+							font-size: 12px;
+							line-height: 20px;
+							vertical-align: top;
+						}
 					}
 				}
+
+				& .van-radio:not(:first-child) {
+					margin-top: 6px;
+				}
 			}
+		}
 
-			& .bxt-ins-unit-tips {
-				display: inline-block;
-				position: absolute;
-				top: 30px;
-				right: 55px;
-				margin-top: 11px;
-				line-height: normal;
+		& .bxt-ins-unit-tips {
+			position: absolute;
+			display: inline-block;
+			right: 50px;
+			margin-top: -12px;
+			line-height: normal;
+			text-align: right;
+			z-index: 1;
 
-				& em {
-					position: absolute;
-					top: -3px;
-					left: 50%;
-					display: inline-block;
-					width: 6px;
-					height: 6px;
-					background: #666;
-					transform: translateX(-50%) rotate(45deg);
-					content: ' ';
-				}
+			& em {
+				position: absolute;
+				top: -2px;
+				left: 50%;
+				display: inline-block;
+				width: 6px;
+				height: 6px;
+				background: #666;
+				transform: translateX(-50%) rotate(45deg);
+				content: ' ';
+			}
 
-				& span {
-					position: relative;
-					display: inline-block;
-					padding: 1px 12px;
-					line-height: normal;
-					background: #666;
-					color: white;
-					font-size: 12px;
-					border-radius: 4px;
-				}
+			& span {
+				position: relative;
+				display: inline-block;
+				padding: 1px 12px;
+				line-height: normal;
+				background: #666;
+				color: white;
+				font-size: 12px;
+				border-radius: 4px;
 			}
 		}
 
 		& .bxt-ins-recommend-values {
+			margin-top: -2px;
 			padding: 0 15px 18px 15px;
 			text-align: right;
 			white-space: nowrap;
@@ -208,19 +234,8 @@
 			}
 		}
 
-		& .bxt-ins-form-radio-btn {
-			& .bx-form-item__inner {
-				align-items: flex-start;
-			}
-		}
-
-		& .bx-form-item__input {
-			& .bx-form-item__inner {
-				align-items: flex-start;
-			}
-		}
 
-		& .bx-form-item__unit {
+		& .van-field-unit {
 			position: relative;
 			z-index: 1;
 		}