@tuya-miniapp/smart-ui 2.6.4-beta-8 → 2.6.4-beta-9

package/dist/common/utils.d.ts

@@ -22,4 +22,3 @@ export declare function replacePlaceholders(template: any, values: any): any;
 export declare const getSafeAreaInsetMin: () => number;
 export declare function getSafeBottomOffset(): number;
 export declare const getDateString: (date: Date) => string | undefined;
-export declare function generateRangeArray(start: number, end: number): number[];

package/dist/common/utils.js

@@ -111,10 +111,3 @@ export const getDateString = (date) => {
     const formattedDate = `${year}/${month}/${day}`;
     return formattedDate;
 };
-export function generateRangeArray(start, end) {
-    const resultArray = [];
-    for (let i = start; i < end; i++) {
-        resultArray.push(i);
-    }
-    return resultArray;
-}

package/dist/datetime-picker/index.js

@@ -199,7 +199,8 @@ SmartComponent({
                     unit: locale === null || locale === void 0 ? void 0 : locale[column.type],
                     style: columnStyles === null || columnStyles === void 0 ? void 0 : columnStyles[column.type],
                     fontStyle: fontStyles === null || fontStyles === void 0 ? void 0 : fontStyles[column.type],
-                    activeIndex,
+                    activeIndex: activeIndex === -1 ? 0 : activeIndex,
+                    loop: !['12HourClock', 'year'].includes(column.type),
                 };
             });
             return this.setData({ columns: results });
@@ -393,7 +394,6 @@ SmartComponent({
             }
             else {
                 const originColumns = this.getOriginColumns();
-                const indexes = picker.getIndexes();
                 const values = indexes.map((value, index) => originColumns[index].values[value]);
                 const year = getTrueValue(values[0]);
                 const month = getTrueValue(values[1]);

package/dist/image/index.js

@@ -36,7 +36,7 @@ SmartComponent({
         },
         showLoading: {
             type: Boolean,
-            value: true,
+            value: false,
         },
         tintColor: {
             type: String,

package/dist/picker/index.css

@@ -1 +1 @@
-@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{align-items:center;display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}

package/dist/picker/index.js

@@ -8,12 +8,14 @@ SmartComponent({
         }, toolbarPosition: {
             type: String,
             value: 'top',
+        }, fullHeight: {
+            type: Boolean,
+            value: false,
         }, defaultIndex: {
             type: Number,
             value: 0,
         }, activeIndex: {
-            type: Number,
-            value: -1,
+            type: null,
         }, unit: {
             type: String,
             value: '',
@@ -35,6 +37,11 @@ SmartComponent({
             get: () => this.selectAllComponents('.smart-picker__column') || [],
         });
     },
+    mounted() {
+        if (![3, 5, 7, 9].includes(this.data.visibleItemCount)) {
+            console.error('visibleItemCount 的值必须为 3, 5, 7, 9');
+        }
+    },
     methods: {
         noop() { },
         setColumns() {
@@ -93,7 +100,7 @@ SmartComponent({
         },
         // get column option index by column index
         getColumnIndex(columnIndex) {
-            return (this.getColumn(columnIndex) || {}).data.currentIndex;
+            return (this.getColumn(columnIndex) || {}).data.activeIndex;
         },
         // set column option index by column index
         setColumnIndex(columnIndex, optionIndex) {
@@ -134,7 +141,7 @@ SmartComponent({
         },
         // get indexes of all columns
         getIndexes() {
-            return this.children.map(child => child.data.currentIndex);
+            return this.children.map(child => child.data.activeIndex === null ? child.data.defaultIndex : child.data.activeIndex);
         },
         // set indexes of all columns
         setIndexes(indexes) {

package/dist/picker/index.wxml

@@ -9,7 +9,7 @@
 
   <view
     class="smart-picker__columns"
-    style="{{ computed.columnsStyle({ itemHeight, visibleItemCount }) }}"
+    style="{{ computed.columnsStyle({ itemHeight, visibleItemCount, fullHeight }) }}"
     catch:touchmove="noop"
   >
     <picker-column
@@ -22,14 +22,15 @@
       value-key="{{ valueKey }}"
       style="order: {{ item.order }}; {{ computed.style(item.style) }}"
       active-style="{{ activeStyle }}"
-      font-style="{{computed.style(item.fontStyle)}}"
+      font-style="{{fontStyle ? fontStyle + ';' + computed.style(item.fontStyle): computed.style(item.fontStyle)}}"
       options="{{ item.values }}"
       disabled="{{ item.disabled || false }}"
       unit="{{ item.unit || unit }}"
       changeAnimation="{{ changeAnimation }}"
       default-index="{{ item.defaultIndex || defaultIndex }}"
-      active-index="{{ item.activeIndex || activeIndex }}"
+      active-index="{{ item.activeIndex === null ? activeIndex : item.activeIndex }}"
       item-height="{{ itemHeight }}"
+      loop="{{ loop || item.loop || false }}"
       visible-item-count="{{ visibleItemCount }}"
       active-class="active-class"
       bind:change="onChange"

package/dist/picker/index.wxs

@@ -5,7 +5,7 @@ var array = require('../wxs/array.wxs');
 
 function columnsStyle(data) {
   return style({
-    height: addUnit(data.itemHeight * data.visibleItemCount),
+    height: addUnit(data.itemHeight * data.visibleItemCount * (data.fullHeight ? 1 : 0.9)),
   });
 }
 

package/dist/picker/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{align-items:center;display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}

package/dist/picker/shared.d.ts

@@ -10,6 +10,9 @@ export declare const pickerProps: {
         type: StringConstructor;
         value: string;
     };
+    /**
+     * 可见的选项个数 3 5 7 9
+     */
     visibleItemCount: {
         type: NumberConstructor;
         value: number;
@@ -30,4 +33,12 @@ export declare const pickerProps: {
         type: StringConstructor;
         value: string;
     };
+    fontStyle: {
+        type: StringConstructor;
+        value: string;
+    };
+    loop: {
+        type: BooleanConstructor;
+        value: boolean;
+    };
 };

package/dist/picker/shared.js

@@ -10,6 +10,9 @@ export const pickerProps = {
         type: String,
         value: 'Confirm',
     },
+    /**
+     * 可见的选项个数 3 5 7 9
+     */
     visibleItemCount: {
         type: Number,
         value: 5,
@@ -30,4 +33,12 @@ export const pickerProps = {
         type: String,
         value: '',
     },
+    fontStyle: {
+        type: String,
+        value: '',
+    },
+    loop: {
+        type: Boolean,
+        value: false,
+    },
 };

package/dist/picker-column/index.css

@@ -1 +1 @@
-@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker-column{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);text-align:center}.smart-picker-column,.smart-picker-column__offset{position:relative;width:100%}.smart-picker-column__visual{position:absolute;top:0;width:100%}.smart-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--picker-option-selected-font-weight-bold,var(--font-weight-bold,700))}.smart-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__mask{background:transparent;display:flex;flex-direction:column;height:100%;position:absolute;top:0;width:100%;z-index:10}.smart-picker-column__mask__item{flex:1}.smart-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.smart-picker-column__unit_text{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px);left:100%;margin-left:var(--picker-option-unit-mid-size,4px);position:absolute;text-align:left;top:50%;transform:translateY(-50%);white-space:nowrap}.smart-picker-column__max-text{color:transparent;font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);position:relative}.smart-picker-column--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.smart-picker-column__item_0 .smart-picker-column__item__text:after{content:var(--picker-item-content_0,"")}.smart-picker-column__item_1 .smart-picker-column__item__text:after{content:var(--picker-item-content_1,"")}.smart-picker-column__item_2 .smart-picker-column__item__text:after{content:var(--picker-item-content_2,"")}.smart-picker-column__item_3 .smart-picker-column__item__text:after{content:var(--picker-item-content_3,"")}.smart-picker-column__item_4 .smart-picker-column__item__text:after{content:var(--picker-item-content_4,"")}.smart-picker-column__item_5 .smart-picker-column__item__text:after{content:var(--picker-item-content_5,"")}.smart-picker-column__item_6 .smart-picker-column__item__text:after{content:var(--picker-item-content_6,"")}.smart-picker-column__item_7 .smart-picker-column__item__text:after{content:var(--picker-item-content_7,"")}.smart-picker-column__item_8 .smart-picker-column__item__text:after{content:var(--picker-item-content_8,"")}.smart-picker-column__item_9 .smart-picker-column__item__text:after{content:var(--picker-item-content_9,"")}.smart-picker-column__item_10 .smart-picker-column__item__text:after{content:var(--picker-item-content_10,"")}.smart-picker-column__item_11 .smart-picker-column__item__text:after{content:var(--picker-item-content_11,"")}.smart-picker-column__item_12 .smart-picker-column__item__text:after{content:var(--picker-item-content_12,"")}.smart-picker-column__item_13 .smart-picker-column__item__text:after{content:var(--picker-item-content_13,"")}.smart-picker-column__item_14 .smart-picker-column__item__text:after{content:var(--picker-item-content_14,"")}.smart-picker-column__item_15 .smart-picker-column__item__text:after{content:var(--picker-item-content_15,"")}.smart-picker-column__item_16 .smart-picker-column__item__text:after{content:var(--picker-item-content_16,"")}.smart-picker-column__item_17 .smart-picker-column__item__text:after{content:var(--picker-item-content_17,"")}.smart-picker-column__item_18 .smart-picker-column__item__text:after{content:var(--picker-item-content_18,"")}.smart-picker-column__item_19 .smart-picker-column__item__text:after{content:var(--picker-item-content_19,"")}.smart-picker-column__item_20 .smart-picker-column__item__text:after{content:var(--picker-item-content_20,"")}
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker-column{backface-visibility:hidden;-webkit-backface-visibility:hidden;color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);perspective:900px;position:relative;text-align:center;transform:translateZ(0);width:100%;will-change:transform}.smart-picker-column__offset{cursor:-webkit-grab;cursor:grab;height:100%;overflow:visible;position:relative;touch-action:none;transform:rotateX(-108deg);transform-origin:center center;transform-style:preserve-3d;width:100%}.smart-picker-column__visual{position:absolute;top:0;width:100%}.smart-picker-column__item{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;justify-content:center;left:50%;position:absolute;top:50%;transform-origin:center center;width:100%}.smart-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--picker-option-selected-font-weight-bold,var(--font-weight-bold,700))}.smart-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__mask{background:transparent;display:flex;flex-direction:column;height:100%;position:absolute;top:0;width:100%;z-index:10}.smart-picker-column__mask__item{flex:1}.smart-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.smart-picker-column__unit_text{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px);left:100%;margin-left:var(--picker-option-unit-mid-size,4px);position:absolute;text-align:left;top:50%;transform:translateY(-50%);white-space:nowrap}.smart-picker-column__max-text{color:transparent;font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);position:relative}.smart-picker-column--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__item_0:after{content:var(--picker-item-content_0,"")}.smart-picker-column__item_1:after{content:var(--picker-item-content_1,"")}.smart-picker-column__item_2:after{content:var(--picker-item-content_2,"")}.smart-picker-column__item_3:after{content:var(--picker-item-content_3,"")}.smart-picker-column__item_4:after{content:var(--picker-item-content_4,"")}.smart-picker-column__item_5:after{content:var(--picker-item-content_5,"")}.smart-picker-column__item_6:after{content:var(--picker-item-content_6,"")}.smart-picker-column__item_7:after{content:var(--picker-item-content_7,"")}.smart-picker-column__item_8:after{content:var(--picker-item-content_8,"")}.smart-picker-column__item_9:after{content:var(--picker-item-content_9,"")}.smart-picker-column__item_10:after{content:var(--picker-item-content_10,"")}.smart-picker-column__item_11:after{content:var(--picker-item-content_11,"")}.smart-picker-column__item_12:after{content:var(--picker-item-content_12,"")}.smart-picker-column__item_13:after{content:var(--picker-item-content_13,"")}.smart-picker-column__item_14:after{content:var(--picker-item-content_14,"")}.smart-picker-column__item_15:after{content:var(--picker-item-content_15,"")}.smart-picker-column__item_16:after{content:var(--picker-item-content_16,"")}.smart-picker-column__item_17:after{content:var(--picker-item-content_17,"")}.smart-picker-column__item_18:after{content:var(--picker-item-content_18,"")}.smart-picker-column__item_19:after{content:var(--picker-item-content_19,"")}.smart-picker-column__item_20:after{content:var(--picker-item-content_20,"")}.smart-picker-column__item_21:after{content:var(--picker-item-content_21,"")}.smart-picker-column__item_22:after{content:var(--picker-item-content_22,"")}.smart-picker-column__item_23:after{content:var(--picker-item-content_23,"")}.smart-picker-column__item_24:after{content:var(--picker-item-content_24,"")}.smart-picker-column__item_25:after{content:var(--picker-item-content_25,"")}.smart-picker-column__item_26:after{content:var(--picker-item-content_26,"")}.smart-picker-column__item_27:after{content:var(--picker-item-content_27,"")}.smart-picker-column__item_28:after{content:var(--picker-item-content_28,"")}.smart-picker-column__item_29:after{content:var(--picker-item-content_29,"")}.smart-picker-column__item_30:after{content:var(--picker-item-content_30,"")}.smart-picker-column__item_31:after{content:var(--picker-item-content_31,"")}.smart-picker-column__item_32:after{content:var(--picker-item-content_32,"")}.smart-picker-column__item_33:after{content:var(--picker-item-content_33,"")}.smart-picker-column__item_34:after{content:var(--picker-item-content_34,"")}

package/dist/picker-column/index.js

@@ -1,7 +1,8 @@
 import { SmartComponent } from '../common/component';
-import { generateRangeArray, range } from '../common/utils';
+import { range } from '../common/utils';
 import { isObj } from '../common/validator';
 import ty from '../common/ty';
+const DEFAULT_DURATION = 400;
 const compIdList = [];
 const getId = () => {
     const id = 'smart-picker-column-' + compIdList.length;
@@ -26,8 +27,8 @@ SmartComponent({
             observer(value) {
                 if (!this.data.isInit)
                     return;
-                this.updateViewOptions();
                 this.updateUint(value);
+                this.checkIndexUpdateList();
             },
         },
         defaultIndex: {
@@ -36,19 +37,18 @@ SmartComponent({
         },
         changeAnimation: {
             type: Boolean,
-            value: true,
+            value: false,
         },
         fontStyle: {
             type: String,
             value: '',
         },
         activeIndex: {
-            type: Number,
-            value: -1,
+            type: null,
             observer() {
                 if (!this.data.isInit)
                     return;
-                this.updateViewOptions();
+                this.checkIndexUpdateList();
             },
         },
         unit: {
@@ -65,85 +65,74 @@ SmartComponent({
         },
     },
     data: {
-        startY: 0,
-        offset: 0,
-        duration: 0,
-        startOffset: 0,
-        optionsV: [],
-        currentIndex: -1,
-        renderNum: 0,
-        renderStart: 0,
-        animate: false,
-        playing: false,
         isInit: false,
         maxText: '',
-        instanceId: '',
-        timer: null,
-        preOffsetList: [],
-        viewOptions: [],
+        optionsVIndexList: [],
+        offsetActiveIndex: 0,
+        endTimer: null,
+        offsetList: [],
+        moving: false,
+        movingDirection: 'down',
+        startY: 0,
+        offsetting: 0,
+        animationIndex: 0,
+        isDestroy: false,
     },
     created() {
         this.setData({
             instanceId: getId(),
         });
-        this.checkIndex();
-        this.updateViewOptions();
-        const { options } = this.data;
-        this.updateUint(options);
+        this.updateUint(this.data.options);
+        this.checkIndexUpdateList();
         this.setData({
             isInit: true,
         });
     },
+    destroyed() {
+        this.setData({
+            isDestroy: true,
+        });
+    },
     methods: {
-        checkIndex() {
-            const { activeIndex } = this.data;
-            const index = this.adjustIndex(activeIndex);
-            if (activeIndex === index)
-                return;
+        checkIndexUpdateList() {
+            const { activeIndex, defaultIndex } = this.data;
+            const count = this.data.options.length;
+            const currIndex = activeIndex !== null ? activeIndex : defaultIndex;
+            let animationIndex = this.getAnimationIndex(currIndex);
+            animationIndex = this.adjustIndex(animationIndex);
+            let currActiveIndex = this.data.loop ? ((animationIndex + 1) % count) - 1 : animationIndex;
+            if (currActiveIndex < 0) {
+                currActiveIndex += count;
+            }
+            const optionsVIndexList = this.getVisibleOptions(animationIndex);
             this.setData({
-                activeIndex: index,
+                activeIndex: currActiveIndex,
+                animationIndex: animationIndex,
+                optionsVIndexList: optionsVIndexList,
             });
+            // if (currActiveIndex !== activeIndex) {
+            //   this.$emit('change', currActiveIndex);
+            // }
         },
-        adjustIndex(index) {
-            const { data } = this;
-            const count = this.data.options.length;
-            index = range(index, 0, count);
-            for (let i = index; i < count; i++) {
-                if (!this.isDisabled(data.options[i]))
-                    return i;
-            }
-            for (let i = index - 1; i >= 0; i--) {
-                if (!this.isDisabled(data.options[i]))
-                    return i;
+        getAnimationIndex(activeIndex) {
+            const { animationIndex } = this.data;
+            const length = this.data.options.length || 1;
+            if (this.data.loop) {
+                const newAnimationIndex = this.getNewAnimationIndex(animationIndex, activeIndex, length, this.data.loop);
+                return newAnimationIndex;
             }
+            return activeIndex;
         },
-        isDisabled(option) {
-            return isObj(option) && option.disabled;
+        getCount() {
+            return this.data.options.length;
         },
-        updateViewOptions() {
-            const currActiveIndex = this.data.activeIndex < 0 ? 0 : this.data.activeIndex;
-            let partNum = Math.floor(currActiveIndex / 10);
-            const lastNum = this.data.activeIndex - partNum * 10;
-            if (lastNum < 5 && partNum > 0) {
-                partNum -= 1;
+        vibrateShort(count, time = DEFAULT_DURATION) {
+            if (this.data.vibrateTimer) {
+                clearInterval(this.data.vibrateTimer);
+                this.setData({
+                    vibrateTimer: null,
+                });
             }
-            const part2Times = Math.floor(partNum / 2);
-            const part2Percent = partNum % 2;
-            const onePartOffset = part2Percent + part2Times;
-            const twoPartOffset = part2Times;
-            const isReverse = onePartOffset > twoPartOffset;
-            const startPart = twoPartOffset + onePartOffset;
-            const viewIndexList = !isReverse
-                ? generateRangeArray(startPart * 10, startPart * 10 + 20)
-                : [
-                    ...generateRangeArray(startPart * 10 + 10, startPart * 10 + 20),
-                    ...generateRangeArray(startPart * 10, startPart * 10 + 10),
-                ];
-            this.setData({
-                viewOptions: viewIndexList,
-            });
-        },
-        vibrateShort(count, time) {
             if (!count) {
                 ty.vibrateShort({ type: 'light' });
                 return;
@@ -155,8 +144,11 @@ SmartComponent({
                     return;
                 }
                 has++;
-                this.vibrateShort();
-            }, (time || this.data.animationTime) / count - 20);
+                ty.vibrateShort({ type: 'light' });
+            }, time / count - 20);
+            this.setData({
+                vibrateTimer: timer,
+            });
         },
         updateUint(options) {
             const { unit, valueKey } = this.data;
@@ -172,6 +164,115 @@ SmartComponent({
                 this.setData({ maxText });
             }
         },
+        getVisibleOptions(currentIndex) {
+            let animationIndex = Math.round(currentIndex !== undefined ? currentIndex : this.data.animationIndex);
+            const vOptionLength = this.data.visibleItemCount * 4 - 2;
+            const rotateAngle = 360 / vOptionLength;
+            const partCount = Math.floor(this.data.visibleItemCount / 2) + 3;
+            const newArr = new Array(vOptionLength).fill('');
+            const newValueArr = new Array(partCount * 2 + 1).fill('');
+            if (this.data.loop) {
+                // 循环模式：根据 options 首尾填充 newValueArr 数组
+                const optionsLength = this.data.options.length;
+                if (optionsLength === 0) {
+                    // 如果没有选项，填充空值
+                    newValueArr.fill('');
+                }
+                else {
+                    newValueArr.forEach((item, index) => {
+                        // 计算相对于中心的偏移量
+                        const offset = index - partCount;
+                        // 计算目标索引，支持循环
+                        const targetAnimationIndex = animationIndex + offset;
+                        let targetIndex = ((targetAnimationIndex + 1) % optionsLength) - 1;
+                        if (targetIndex < 0) {
+                            targetIndex += optionsLength;
+                        }
+                        newValueArr[index] = targetIndex;
+                    });
+                }
+            }
+            else {
+                if (animationIndex < 0) {
+                    animationIndex = 0;
+                }
+                if (animationIndex > this.data.options.length - 1) {
+                    animationIndex = this.data.options.length - 1;
+                }
+                newValueArr.forEach((item, index) => {
+                    const valueIndex = animationIndex - partCount + index >= 0
+                        ? animationIndex - partCount + index
+                        : undefined;
+                    if (valueIndex === undefined) {
+                        return;
+                    }
+                    newValueArr[index] = valueIndex;
+                });
+            }
+            let rotate = (animationIndex * rotateAngle) % 360;
+            if (rotate < 0) {
+                rotate += 360;
+            }
+            const rotateIndex = Math.round(rotate / rotateAngle);
+            // 环形结构填充：以rotateIndex为中心，向两边扩展填充newValueArr
+            const centerIndex = rotateIndex; // 中心位置
+            const halfLength = Math.floor(newValueArr.length / 2); // newValueArr的一半长度
+            // 从中心位置开始，向两边填充
+            for (let i = 0; i < newValueArr.length; i++) {
+                const targetIndex = (centerIndex - halfLength + i + vOptionLength) % vOptionLength; // 确保索引在0-17范围内
+                newArr[targetIndex] = newValueArr[i];
+            }
+            return newArr;
+        },
+        getNewAnimationIndex(animationIndex, activeIndex, length, loop) {
+            const curOptionsNewIndex = Math.floor((animationIndex + 1) / length) * length + activeIndex;
+            const preOptionsNewIndex = curOptionsNewIndex - length;
+            const afterOptionsNewIndex = curOptionsNewIndex + length;
+            const newAnimationIndex = !loop
+                ? activeIndex
+                : Math.abs(preOptionsNewIndex - animationIndex) >
+                    Math.abs(curOptionsNewIndex - animationIndex)
+                    ? Math.abs(curOptionsNewIndex - animationIndex) >
+                        Math.abs(afterOptionsNewIndex - animationIndex)
+                        ? afterOptionsNewIndex
+                        : curOptionsNewIndex
+                    : Math.abs(preOptionsNewIndex - animationIndex) >
+                        Math.abs(afterOptionsNewIndex - animationIndex)
+                        ? afterOptionsNewIndex
+                        : preOptionsNewIndex;
+            return newAnimationIndex;
+        },
+        adjustIndex(index) {
+            const { data } = this;
+            const count = this.getCount();
+            if (this.data.loop) {
+                for (let i = 0; i < count; i++) {
+                    const targetIndex = index + i;
+                    let optionIndex = ((targetIndex + 1) % count) - 1;
+                    if (optionIndex < 0) {
+                        optionIndex += count;
+                    }
+                    if (!this.isDisabled(data.options[optionIndex]) &&
+                        data.options[optionIndex] !== undefined) {
+                        return targetIndex;
+                    }
+                }
+                return 0;
+            }
+            const activeIndex = range(index, 0, count);
+            for (let i = activeIndex; i < count; i++) {
+                if (!this.isDisabled(data.options[i]) && data.options[i] !== undefined)
+                    return i;
+            }
+            for (let i = activeIndex - 1; i >= 0; i--) {
+                if (!this.isDisabled(data.options[i]) && data.options[i] !== undefined)
+                    return i;
+            }
+            return 0;
+        },
+        isDisabled(option) {
+            return isObj(option) && option.disabled;
+        },
         getOptionText(option) {
             const { data } = this;
             return isObj(option) && data.valueKey in option ? option[data.valueKey] : option;
@@ -186,29 +287,43 @@ SmartComponent({
             return Promise.resolve();
         },
         setIndex(index) {
+            let activeIndex = ((index + 1) % this.data.options.length) - 1;
+            if (activeIndex < 0) {
+                activeIndex += this.data.options.length;
+            }
             this.setData({
-                activeIndex: index,
+                activeIndex: activeIndex,
+                animationIndex: index,
             });
         },
         getValue() {
             const { data } = this;
-            return data.options[data.activeIndex < 0 ? 0 : data.activeIndex];
-        },
-        viewOptionsChange(list) {
-            this.setData({
-                viewOptions: list,
-            });
+            return isObj(data.options[data.activeIndex])
+                ? data.options[data.activeIndex][data.valueKey]
+                : data.options[data.activeIndex];
         },
         activeIndexChange(index) {
+            let activeIndex = ((index + 1) % this.data.options.length) - 1;
+            if (activeIndex < 0) {
+                activeIndex += this.data.options.length;
+            }
+            const isSame = activeIndex === this.data.activeIndex;
             this.setData({
-                activeIndex: index,
+                activeIndex: activeIndex,
+                animationIndex: index,
             });
-            this.$emit('change', index);
+            !isSame && this.$emit('change', index);
         },
         animationIndexChange(index) {
             this.setData({
                 animationIndex: index,
             });
         },
+        animationStart() {
+            this.$emit('animation-start');
+        },
+        animationEnd() {
+            this.$emit('animation-end');
+        },
     },
 });