Hooke / swx_weapp

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
038ab233 1 parent 28a4a0b6

更新vant-weapp版本到v1.11.7

Expand all
Inline Side-by-side
Showing 98 changed files with 1045 additions and 323 deletions
import { VantComponent } from '../common/component';
import { button } from '../mixins/button';
VantComponent({
classes: ['list-class'],
mixins: [button],
props: {
show: Boolean,
......@@ -35,6 +36,10 @@ VantComponent({
type: Boolean,
value: true,
},
rootPortal: {
type: Boolean,
value: false,
},
},
methods: {
onSelect(event) {
......
......@@ -6,9 +6,10 @@
round="{{ round }}"
z-index="{{ zIndex }}"
overlay="{{ overlay }}"
custom-class="van-action-sheet"
custom-class="van-action-sheet custom-class"
safe-area-inset-bottom="{{ safeAreaInsetBottom }}"
close-on-click-overlay="{{ closeOnClickOverlay }}"
root-portal="{{ rootPortal }}"
bind:close="onClickOverlay"
>
<view wx:if="{{ title }}" class="van-action-sheet__header">
......@@ -22,7 +23,7 @@
<view wx:if="{{ description }}" class="van-action-sheet__description van-hairline--bottom">
{{ description }}
</view>
<view wx:if="{{ actions && actions.length }}">
<view wx:if="{{ actions && actions.length }}" class="list-class">
<!-- button外包一层view，防止actions动态变化，导致渲染时button被打散 -->
<button
wx:for="{{ actions }}"
......
......@@ -2,10 +2,10 @@
<wxs src="./index.wxs" module="computed" />
<button
id="{{ id }}"
id="{{ id || buttonId }}"
data-detail="{{ dataset }}"
class="custom-class {{ utils.bem('button', [type, size, { block, round, plain, square, loading, disabled, hairline, unclickable: disabled || loading }]) }} {{ hairline ? 'van-hairline--surround' : '' }}"
hover-class="van-button--active hover-class"
hover-class="{{ disabled || loading ? '' : 'van-button--active hover-class'}}"
lang="{{ lang }}"
form-type="{{ formType }}"
style="{{ computed.rootStyle({ plain, color, customStyle }) }}"
......@@ -22,9 +22,12 @@
bindgetuserinfo="onGetUserInfo"
bindcontact="onContact"
bindgetphonenumber="onGetPhoneNumber"
bindgetrealtimephonenumber="onGetRealTimePhoneNumber"
bindagreeprivacyauthorization="onAgreePrivacyAuthorization"
binderror="onError"
bindlaunchapp="onLaunchApp"
bindopensetting="onOpenSetting"
bindchooseavatar="onChooseAvatar"
>
<block wx:if="{{ loading }}">
<van-loading
......
<wxs src="./index.wxs" module="computed" />
<wxs src="../wxs/utils.wxs" module="utils" />
<view class="van-calendar">
<header
title="{{ title }}"
......@@ -54,12 +56,12 @@
type="danger"
color="{{ color }}"
custom-class="van-calendar__confirm"
disabled="{{ computed.getButtonDisabled(type, currentDate) }}"
disabled="{{ computed.getButtonDisabled(type, currentDate, minRange) }}"
nativeType="text"
bind:click="onConfirm"
>
{{
computed.getButtonDisabled(type, currentDate)
computed.getButtonDisabled(type, currentDate, minRange)
? confirmDisabledText
: confirmText
}}
......
......@@ -40,6 +40,7 @@ VantComponent({
},
defaultDate: {
type: null,
value: getToday().getTime(),
observer(val) {
this.setData({ currentDate: val });
this.scrollIntoView();
......@@ -103,17 +104,33 @@ VantComponent({
type: null,
value: null,
},
minRange: {
type: Number,
value: 1,
},
firstDayOfWeek: {
type: Number,
value: 0,
},
readonly: Boolean,
rootPortal: {
type: Boolean,
value: false,
},
},
data: {
subtitle: '',
currentDate: null,
scrollIntoView: '',
},
watch: {
minDate() {
this.initRect();
},
maxDate() {
this.initRect();
},
},
created() {
this.setData({
currentDate: this.getInitialDate(this.data.defaultDate),
......@@ -127,7 +144,7 @@ VantComponent({
},
methods: {
reset() {
this.setData({ currentDate: this.getInitialDate() });
this.setData({ currentDate: this.getInitialDate(this.data.defaultDate) });
this.scrollIntoView();
},
initRect() {
......@@ -159,15 +176,19 @@ VantComponent({
return date;
},
getInitialDate(defaultDate = null) {
const { type, minDate, maxDate } = this.data;
const { type, minDate, maxDate, allowSameDay } = this.data;
if (!defaultDate)
return [];
const now = getToday().getTime();
if (type === 'range') {
if (!Array.isArray(defaultDate)) {
defaultDate = [];
}
const [startDay, endDay] = defaultDate || [];
const start = this.limitDateRange(startDay || now, minDate, getPrevDay(new Date(maxDate)).getTime());
const end = this.limitDateRange(endDay || now, getNextDay(new Date(minDate)).getTime());
const startDate = getTime(startDay || now);
const start = this.limitDateRange(startDate, minDate, allowSameDay ? startDate : getPrevDay(new Date(maxDate)).getTime());
const date = getTime(endDay || now);
const end = this.limitDateRange(date, allowSameDay ? date : getNextDay(new Date(minDate)).getTime());
return [start, end];
}
if (type === 'multiple') {
......@@ -184,6 +205,8 @@ VantComponent({
scrollIntoView() {
requestAnimationFrame(() => {
const { currentDate, type, show, poppable, minDate, maxDate } = this.data;
if (!currentDate)
return;
// @ts-ignore
const targetDate = type === 'single' ? currentDate : currentDate[0];
const displayed = show || !poppable;
......@@ -240,7 +263,7 @@ VantComponent({
this.select([date, null]);
}
else if (allowSameDay) {
this.select([date, date]);
this.select([date, date], true);
}
}
else {
......
......@@ -12,6 +12,8 @@
position="{{ position }}"
closeable="{{ showTitle || showSubtitle }}"
close-on-click-overlay="{{ closeOnClickOverlay }}"
safe-area-inset-bottom="{{ safeAreaInsetBottom }}"
root-portal="{{ rootPortal }}"
bind:enter="onOpen"
bind:close="onClose"
bind:after-enter="onOpened"
......
......@@ -15,7 +15,7 @@ function getMonths(minDate, maxDate) {
return months;
}
function getButtonDisabled(type, currentDate) {
function getButtonDisabled(type, currentDate, minRange) {
if (currentDate == null) {
return true;
}
......@@ -25,7 +25,7 @@ function getButtonDisabled(type, currentDate) {
}
if (type === 'multiple') {
return !currentDate.length;
return currentDate.length < minRange;
}
return !currentDate;
......
@import '../common/index.wxss';.van-calendar{background-color:var(--calendar-background-color,#fff);display:flex;flex-direction:column;height:var(--calendar-height,100%)}.van-calendar__close-icon{top:11px}.van-calendar__popup--bottom,.van-calendar__popup--top{height:var(--calendar-popup-height,80%)}.van-calendar__popup--left,.van-calendar__popup--right{height:100%}.van-calendar__body{-webkit-overflow-scrolling:touch;flex:1;overflow:auto}.van-calendar__footer{flex-shrink:0;padding:0 var(--padding-md,16px)}.van-calendar__footer--safe-area-inset-bottom{padding-bottom:env(safe-area-inset-bottom)}.van-calendar__footer+.van-calendar__footer,.van-calendar__footer:empty{display:none}.van-calendar__footer:empty+.van-calendar__footer{display:block!important}.van-calendar__confirm{height:var(--calendar-confirm-button-height,36px)!important;line-height:var(--calendar-confirm-button-line-height,34px)!important;margin:var(--calendar-confirm-button-margin,7px 0)!important}
\ No newline at end of file
@import '../common/index.wxss';.van-calendar{background-color:var(--calendar-background-color,#fff);display:flex;flex-direction:column;height:var(--calendar-height,100%)}.van-calendar__close-icon{top:11px}.van-calendar__popup--bottom,.van-calendar__popup--top{height:var(--calendar-popup-height,90%)}.van-calendar__popup--left,.van-calendar__popup--right{height:100%}.van-calendar__body{-webkit-overflow-scrolling:touch;flex:1;overflow:auto}.van-calendar__footer{flex-shrink:0;padding:0 var(--padding-md,16px)}.van-calendar__footer--safe-area-inset-bottom{padding-bottom:env(safe-area-inset-bottom)}.van-calendar__footer+.van-calendar__footer,.van-calendar__footer:empty{display:none}.van-calendar__footer:empty+.van-calendar__footer{display:block!important}.van-calendar__confirm{height:var(--calendar-confirm-button-height,36px)!important;line-height:var(--calendar-confirm-button-line-height,34px)!important;margin:var(--calendar-confirm-button-margin,7px 0)!important}
\ No newline at end of file
......
export declare const ROW_HEIGHT = 64;
export declare function formatMonthTitle(date: Date): string;
export declare function compareMonth(date1: Date | number, date2: Date | number): 1 | -1 | 0;
export declare function compareDay(day1: Date | number, day2: Date | number): 1 | -1 | 0;
export declare function compareMonth(date1: Date | number, date2: Date | number): 0 | 1 | -1;
export declare function compareDay(day1: Date | number, day2: Date | number): 0 | 1 | -1;
export declare function getDayByOffset(date: Date, offset: number): Date;
export declare function getPrevDay(date: Date): Date;
export declare function getNextDay(date: Date): Date;
......
import { VantComponent } from '../common/component';
var FieldName;
(function (FieldName) {
FieldName["TEXT"] = "text";
FieldName["VALUE"] = "value";
FieldName["CHILDREN"] = "children";
})(FieldName || (FieldName = {}));
const defaultFieldNames = {
text: FieldName.TEXT,
value: FieldName.VALUE,
children: FieldName.CHILDREN,
};
VantComponent({
props: {
title: String,
value: {
type: String,
},
placeholder: {
type: String,
value: '请选择',
},
activeColor: {
type: String,
value: '#1989fa',
},
options: {
type: Array,
value: [],
},
swipeable: {
type: Boolean,
value: false,
},
closeable: {
type: Boolean,
value: true,
},
ellipsis: {
type: Boolean,
value: true,
},
showHeader: {
type: Boolean,
value: true,
},
closeIcon: {
type: String,
value: 'cross',
},
fieldNames: {
type: Object,
value: defaultFieldNames,
observer: 'updateFieldNames',
},
useTitleSlot: Boolean,
},
data: {
tabs: [],
activeTab: 0,
textKey: FieldName.TEXT,
valueKey: FieldName.VALUE,
childrenKey: FieldName.CHILDREN,
innerValue: '',
},
watch: {
options() {
this.updateTabs();
},
value(newVal) {
this.updateValue(newVal);
},
},
created() {
this.updateTabs();
},
methods: {
updateValue(val) {
if (val !== undefined) {
const values = this.data.tabs.map((tab) => tab.selected && tab.selected[this.data.valueKey]);
if (values.indexOf(val) > -1) {
return;
}
}
this.innerValue = val;
this.updateTabs();
},
updateFieldNames() {
const { text = 'text', value = 'value', children = 'children', } = this.data.fieldNames || defaultFieldNames;
this.setData({
textKey: text,
valueKey: value,
childrenKey: children,
});
},
getSelectedOptionsByValue(options, value) {
for (let i = 0; i < options.length; i++) {
const option = options[i];
if (option[this.data.valueKey] === value) {
return [option];
}
if (option[this.data.childrenKey]) {
const selectedOptions = this.getSelectedOptionsByValue(option[this.data.childrenKey], value);
if (selectedOptions) {
return [option, ...selectedOptions];
}
}
}
},
updateTabs() {
const { options } = this.data;
const { innerValue } = this;
if (!options.length) {
return;
}
if (innerValue !== undefined) {
const selectedOptions = this.getSelectedOptionsByValue(options, innerValue);
if (selectedOptions) {
let optionsCursor = options;
const tabs = selectedOptions.map((option) => {
const tab = {
options: optionsCursor,
selected: option,
};
const next = optionsCursor.find((item) => item[this.data.valueKey] === option[this.data.valueKey]);
if (next) {
optionsCursor = next[this.data.childrenKey];
}
return tab;
});
if (optionsCursor) {
tabs.push({
options: optionsCursor,
selected: null,
});
}
this.setData({
tabs,
});
wx.nextTick(() => {
this.setData({
activeTab: tabs.length - 1,
});
});
return;
}
}
this.setData({
tabs: [
{
options,
selected: null,
},
],
activeTab: 0,
});
},
onClose() {
this.$emit('close');
},
onClickTab(e) {
const { index: tabIndex, title } = e.detail;
this.$emit('click-tab', { title, tabIndex });
this.setData({
activeTab: tabIndex,
});
},
// 选中
onSelect(e) {
const { option, tabIndex } = e.currentTarget.dataset;
if (option && option.disabled) {
return;
}
const { valueKey, childrenKey } = this.data;
let { tabs } = this.data;
tabs[tabIndex].selected = option;
if (tabs.length > tabIndex + 1) {
tabs = tabs.slice(0, tabIndex + 1);
}
if (option[childrenKey]) {
const nextTab = {
options: option[childrenKey],
selected: null,
};
if (tabs[tabIndex + 1]) {
tabs[tabIndex + 1] = nextTab;
}
else {
tabs.push(nextTab);
}
wx.nextTick(() => {
this.setData({
activeTab: tabIndex + 1,
});
});
}
this.setData({
tabs,
});
const selectedOptions = tabs.map((tab) => tab.selected).filter(Boolean);
const value = option[valueKey];
const params = {
value,
tabIndex,
selectedOptions,
};
this.innerValue = value;
this.$emit('change', params);
if (!option[childrenKey]) {
this.$emit('finish', params);
}
},
},
});
{
"component": true,
"usingComponents": {
"van-icon": "../icon/index",
"van-tab": "../tab/index",
"van-tabs": "../tabs/index"
}
}
\ No newline at end of file
<wxs src="./index.wxs" module="utils" />
<view wx:if="{{ showHeader }}" class="van-cascader__header">
<slot name="title" wx:if="{{ useTitleSlot }}"></slot>
<text class="van-cascader__title" wx:else>{{ title }}</text>
<van-icon
wx:if="{{ closeable }}"
name="{{ closeIcon }}"
class="van-cascader__close-icon"
bind:tap="onClose"
/>
</view>
<van-tabs
active="{{ activeTab }}"
custom-class="van-cascader__tabs"
wrap-class="van-cascader__tabs-wrap"
tab-class="van-cascader__tab"
color="{{ activeColor }}"
border="{{ false }}"
swipeable="{{ swipeable }}"
ellipsis="{{ ellipsis }}"
bind:click="onClickTab"
>
<van-tab
wx:for="{{ tabs }}"
wx:for-item="tab"
wx:for-index="tabIndex"
wx:key="tabIndex"
title="{{ tab.selected ? tab.selected[textKey] : placeholder }}"
style="width: 100%;"
title-style="{{ !tab.selected ? 'color: #969799;font-weight:normal;' : '' }}"
>
<!-- 暂不支持 -->
<!-- <slot name="options-top"></slot> -->
<view class="van-cascader__options">
<view
wx:for="{{ tab.options }}"
wx:for-item="option"
wx:key="index"
class="{{ option.className }} {{ utils.optionClass(tab, valueKey, option) }}"
style="{{ utils.optionStyle({ tab, valueKey, option, activeColor }) }}"
data-option="{{ option }}"
data-tab-index="{{ tabIndex }}"
bind:tap="onSelect"
>
<text>{{ option[textKey] }}</text>
<van-icon wx:if="{{ utils.isSelected(tab, valueKey, option) }}" name="success" size="18" />
</view>
</view>
<!-- 暂不支持 -->
<!-- <slot name="options-bottom"></slot> -->
</van-tab>
</van-tabs>
var utils = require('../wxs/utils.wxs');
var style = require('../wxs/style.wxs');
function isSelected(tab, valueKey, option) {
return tab.selected && tab.selected[valueKey] === option[valueKey]
}
function optionClass(tab, valueKey, option) {
return utils.bem('cascader__option', { selected: isSelected(tab, valueKey, option), disabled: option.disabled })
}
function optionStyle(data) {
var color = data.option.color || (isSelected(data.tab, data.valueKey, data.option) ? data.activeColor : undefined);
return style({
color
});
}
module.exports = {
isSelected: isSelected,
optionClass: optionClass,
optionStyle: optionStyle,
};
\ No newline at end of file
@import '../common/index.wxss';.van-cascader__header{align-items:center;display:flex;height:48px;justify-content:space-between;padding:0 16px}.van-cascader__title{font-size:16px;font-weight:600;line-height:20px}.van-cascader__close-icon{color:#c8c9cc;font-size:22px;height:22px}.van-cascader__tabs-wrap{height:48px!important;padding:0 8px}.van-cascader__tab{color:#323233!important;flex:none!important;font-weight:600!important;padding:0 8px!important}.van-cascader__tab--unselected{color:#969799!important;font-weight:400!important}.van-cascader__option{align-items:center;cursor:pointer;display:flex;font-size:14px;justify-content:space-between;line-height:20px;padding:10px 16px}.van-cascader__option:active{background-color:#f2f3f5}.van-cascader__option--selected{color:#1989fa;font-weight:600}.van-cascader__option--disabled{color:#c8c9cc;cursor:not-allowed}.van-cascader__option--disabled:active{background-color:initial}.van-cascader__options{-webkit-overflow-scrolling:touch;box-sizing:border-box;height:384px;overflow-y:auto;padding-top:6px}
\ No newline at end of file
/// <reference types="miniprogram-api-typings" />
declare type CanvasContext = WechatMiniprogram.CanvasContext;
type CanvasContext = WechatMiniprogram.CanvasContext;
export declare function adaptor(ctx: CanvasContext & Record<string, unknown>): CanvasContext;
export {};
......
......@@ -93,6 +93,8 @@ VantComponent({
const { color, size } = this.data;
if (isObj(color)) {
return this.getContext().then((context) => {
if (!context)
return;
const LinearColor = context.createLinearGradient(size, 0, 0, 0);
Object.keys(color)
.sort((a, b) => parseFloat(a) - parseFloat(b))
......@@ -134,6 +136,8 @@ VantComponent({
drawCircle(currentValue) {
const { size } = this.data;
this.getContext().then((context) => {
if (!context)
return;
context.clearRect(0, 0, size, size);
this.renderLayerCircle(context);
const formatValue = format(currentValue);
......
......@@ -24,6 +24,7 @@ VantComponent({
},
data: {
expanded: false,
parentBorder: true,
},
mounted() {
this.updateExpanded();
......@@ -34,7 +35,7 @@ VantComponent({
if (!this.parent) {
return;
}
const { value, accordion } = this.parent.data;
const { value, accordion, border } = this.parent.data;
const { children = [] } = this.parent;
const { name } = this.data;
const index = children.indexOf(this);
......@@ -45,7 +46,7 @@ VantComponent({
if (expanded !== this.data.expanded) {
setContentAnimate(this, expanded, this.mounted);
}
this.setData({ index, expanded });
this.setData({ index, expanded, parentBorder: border });
},
onClick() {
if (this.data.disabled) {
......
<wxs src="../wxs/utils.wxs" module="utils" />
<view class="van-collapse-item custom-class {{ index !== 0 ? 'van-hairline--top' : '' }}">
<view class="van-collapse-item custom-class {{ index !== 0 && parentBorder ? 'van-hairline--top' : '' }}">
<van-cell
size="{{ size }}"
title="{{ title }}"
......
......@@ -11,6 +11,7 @@ function VantComponent(vantOptions) {
mapKeys(vantOptions, options, {
data: 'data',
props: 'properties',
watch: 'observers',
mixins: 'behaviors',
methods: 'methods',
beforeCreate: 'created',
......
/// <reference types="miniprogram-api-typings" />
declare type TrivialInstance = WechatMiniprogram.Component.TrivialInstance;
type TrivialInstance = WechatMiniprogram.Component.TrivialInstance;
export declare function useParent(name: string, onEffect?: (this: TrivialInstance) => void): {
relations: {
[x: string]: WechatMiniprogram.Component.RelationOption;
......
/// <reference types="miniprogram-api-typings" />
/// <reference types="node" />
/// <reference types="miniprogram-api-typings" />
/// <reference types="miniprogram-api-typings" />
/// <reference types="miniprogram-api-typings" />
/// <reference types="miniprogram-api-typings" />
export { isDef } from './validator';
export { getSystemInfoSync } from './version';
export declare function range(num: number, min: number, max: number): number;
export declare function nextTick(cb: (...args: any[]) => void): void;
export declare function getSystemInfoSync(): WechatMiniprogram.SystemInfo;
export declare function addUnit(value?: string | number): string | undefined;
export declare function requestAnimationFrame(cb: () => void): NodeJS.Timeout | WechatMiniprogram.NodesRef;
export declare function requestAnimationFrame(cb: () => void): NodeJS.Timeout;
export declare function pickExclude(obj: unknown, keys: string[]): {};
export declare function getRect(context: WechatMiniprogram.Component.TrivialInstance, selector: string): Promise<WechatMiniprogram.BoundingClientRectCallbackResult>;
export declare function getAllRect(context: WechatMiniprogram.Component.TrivialInstance, selector: string): Promise<WechatMiniprogram.BoundingClientRectCallbackResult[]>;
export declare function groupSetData(context: WechatMiniprogram.Component.TrivialInstance, cb: () => void): void;
export declare function toPromise(promiseLike: Promise<unknown> | unknown): Promise<unknown>;
export declare function addNumber(num1: any, num2: any): number;
export declare const clamp: (num: any, min: any, max: any) => number;
export declare function getCurrentPage<T>(): T & WechatMiniprogram.OptionalInterface<WechatMiniprogram.Page.ILifetime> & WechatMiniprogram.Page.InstanceProperties & WechatMiniprogram.Page.InstanceMethods<WechatMiniprogram.IAnyObject> & WechatMiniprogram.Page.Data<WechatMiniprogram.IAnyObject> & WechatMiniprogram.IAnyObject;
export declare const isPC: boolean;
export declare const isWxWork: boolean;
......
import { isDef, isNumber, isPlainObject, isPromise } from './validator';
import { canIUseGroupSetData, canIUseNextTick } from './version';
import { canIUseGroupSetData, canIUseNextTick, getSystemInfoSync, } from './version';
export { isDef } from './validator';
export { getSystemInfoSync } from './version';
export function range(num, min, max) {
return Math.min(Math.max(num, min), max);
}
......@@ -14,13 +15,6 @@ export function nextTick(cb) {
}, 1000 / 30);
}
}
let systemInfo;
export function getSystemInfoSync() {
if (systemInfo == null) {
systemInfo = wx.getSystemInfoSync();
}
return systemInfo;
}
export function addUnit(value) {
if (!isDef(value)) {
return undefined;
......@@ -29,19 +23,9 @@ export function addUnit(value) {
return isNumber(value) ? `${value}px` : value;
}
export function requestAnimationFrame(cb) {
const systemInfo = getSystemInfoSync();
if (systemInfo.platform === 'devtools') {
return setTimeout(() => {
cb();
}, 1000 / 30);
}
return wx
.createSelectorQuery()
.selectViewport()
.boundingClientRect()
.exec(() => {
cb();
});
}
export function pickExclude(obj, keys) {
if (!isPlainObject(obj)) {
......@@ -86,7 +70,17 @@ export function toPromise(promiseLike) {
}
return Promise.resolve(promiseLike);
}
// 浮点数精度处理
export function addNumber(num1, num2) {
const cardinal = Math.pow(10, 10);
return Math.round((num1 + num2) * cardinal) / cardinal;
}
// 限制value在[min, max]之间
export const clamp = (num, min, max) => Math.min(Math.max(num, min), max);
export function getCurrentPage() {
const pages = getCurrentPages();
return pages[pages.length - 1];
}
export const isPC = ['mac', 'windows'].includes(getSystemInfoSync().platform);
// 是否企业微信
export const isWxWork = getSystemInfoSync().environment === 'wxwork';
......
/// <reference types="miniprogram-api-typings" />
interface WxWorkSystemInfo extends WechatMiniprogram.SystemInfo {
environment?: 'wxwork';
}
interface SystemInfo extends WxWorkSystemInfo, WechatMiniprogram.SystemInfo {
}
export declare function getSystemInfoSync(): SystemInfo;
export declare function canIUseModel(): boolean;
export declare function canIUseFormFieldButton(): boolean;
export declare function canIUseAnimate(): boolean;
......@@ -5,3 +12,4 @@ export declare function canIUseGroupSetData(): boolean;
export declare function canIUseNextTick(): boolean;
export declare function canIUseCanvas2d(): boolean;
export declare function canIUseGetUserProfile(): boolean;
export {};
......
import { getSystemInfoSync } from './utils';
let systemInfo;
export function getSystemInfoSync() {
if (systemInfo == null) {
systemInfo = wx.getSystemInfoSync();
}
return systemInfo;
}
function compareVersion(v1, v2) {
v1 = v1.split('.');
v2 = v2.split('.');
......@@ -38,7 +44,12 @@ export function canIUseGroupSetData() {
return gte('2.4.0');
}
export function canIUseNextTick() {
try {
return wx.canIUse('nextTick');
}
catch (e) {
return gte('2.7.1');
}
}
export function canIUseCanvas2d() {
return gte('2.9.0');
......
export declare type TimeData = {
export type TimeData = {
days: number;
hours: number;
minutes: number;
......
......@@ -97,30 +97,7 @@ VantComponent({
return this.picker;
},
updateColumns() {
// const { formatter = defaultFormatter } = this.data;
let { formatter } = this.data;
if (defaultFormatter) {
formatter = defaultFormatter;
}
// 默认写死配置
formatter = (type, value) => {
if (type === 'year') {
return `${value}年`;
}
if (type === 'month') {
return `${value}月`;
}
if (type === 'day') {
return `${value}日`;
}
if (type === 'hour') {
return `${value}时`;
}
if (type === 'minute') {
return `${value}分`;
}
return value;
}
const { formatter = defaultFormatter } = this.data;
const results = this.getOriginColumns().map((column) => ({
values: column.values.map((value) => formatter(column.type, value)),
}));
......@@ -285,26 +262,7 @@ VantComponent({
updateColumnValue(value) {
let values = [];
const { type } = this.data;
let formatter = this.data.formatter || defaultFormatter;
// 默认写死配置
formatter = (type, value) => {
if (type === 'year') {
return `${value}年`;
}
if (type === 'month') {
return `${value}月`;
}
if (type === 'day') {
return `${value}日`;
}
if (type === 'hour') {
return `${value}时`;
}
if (type === 'minute') {
return `${value}分`;
}
return value;
}
const formatter = this.data.formatter || defaultFormatter;
const picker = this.getPicker();
if (type === 'time') {
const pair = value.split(':');
......
......@@ -4,8 +4,9 @@ interface VantComponentInstance {
children: WechatMiniprogram.Component.TrivialInstance[];
index: number;
$emit: (name: string, detail?: unknown, options?: WechatMiniprogram.Component.TriggerEventOption) => void;
setView: (value: Record<string, any>, callback?: () => void) => void;
}
export declare type VantComponentOptions<Data extends WechatMiniprogram.Component.DataOption, Props extends WechatMiniprogram.Component.PropertyOption, Methods extends WechatMiniprogram.Component.MethodOption> = {
export type VantComponentOptions<Data extends WechatMiniprogram.Component.DataOption, Props extends WechatMiniprogram.Component.PropertyOption, Methods extends WechatMiniprogram.Component.MethodOption> = {
data?: Data;
field?: boolean;
classes?: string[];
......@@ -15,6 +16,7 @@ export declare type VantComponentOptions<Data extends WechatMiniprogram.Componen
relations: Record<string, WechatMiniprogram.Component.RelationOption>;
mixin: string;
};
watch?: Record<string, (...args: any[]) => any>;
methods?: Methods;
beforeCreate?: () => void;
created?: () => void;
......
/// <reference types="miniprogram-api-typings" />
export declare type Action = 'confirm' | 'cancel' | 'overlay';
/// <reference types="miniprogram-api-typings" />
export type Action = 'confirm' | 'cancel' | 'overlay';
type DialogContext = WechatMiniprogram.Page.TrivialInstance | WechatMiniprogram.Component.TrivialInstance;
interface DialogOptions {
lang?: string;
show?: boolean;
......@@ -7,11 +9,14 @@ interface DialogOptions {
width?: string | number | null;
zIndex?: number;
theme?: string;
context?: WechatMiniprogram.Page.TrivialInstance | WechatMiniprogram.Component.TrivialInstance;
context?: (() => DialogContext) | DialogContext;
message?: string;
overlay?: boolean;
selector?: string;
ariaLabel?: string;
/**
* @deprecated use custom-class instead
*/
className?: string;
customStyle?: string;
transition?: string;
......
......@@ -30,7 +30,9 @@ function getContext() {
const Dialog = (options) => {
options = Object.assign(Object.assign({}, currentOptions), options);
return new Promise((resolve, reject) => {
const context = options.context || getContext();
const context = (typeof options.context === 'function'
? options.context()
: options.context) || getContext();
const dialog = context.selectComponent(options.selector);
delete options.context;
delete options.selector;
......
......@@ -4,6 +4,7 @@ import { GRAY, RED } from '../common/color';
import { toPromise } from '../common/utils';
VantComponent({
mixins: [button],
classes: ['cancle-button-class', 'confirm-button-class'],
props: {
show: {
type: Boolean,
......@@ -17,14 +18,17 @@ VantComponent({
type: String,
value: 'default',
},
useSlot: Boolean,
confirmButtonId: String,
className: String,
customStyle: String,
asyncClose: Boolean,
messageAlign: String,
beforeClose: null,
overlayStyle: String,
useSlot: Boolean,
useTitleSlot: Boolean,
useConfirmButtonSlot: Boolean,
useCancelButtonSlot: Boolean,
showCancelButton: Boolean,
closeOnClickOverlay: Boolean,
confirmButtonOpenType: String,
......@@ -61,6 +65,10 @@ VantComponent({
type: String,
value: 'scale',
},
rootPortal: {
type: Boolean,
value: false,
},
},
data: {
loading: {
......@@ -81,13 +89,15 @@ VantComponent({
},
close(action) {
this.setData({ show: false });
wx.nextTick(() => {
this.closeAction = action;
},
onAfterLeave() {
const { closeAction: action } = this;
this.$emit('close', action);
const { callback } = this.data;
if (callback) {
callback(action, this);
}
});
},
stopLoading() {
this.setData({
......
......@@ -5,11 +5,13 @@
z-index="{{ zIndex }}"
overlay="{{ overlay }}"
transition="{{ transition }}"
custom-class="van-dialog van-dialog--{{ theme }} {{ className }}"
custom-class="van-dialog van-dialog--{{ theme }}{{ className }} custom-class"
custom-style="width: {{ utils.addUnit(width) }};{{ customStyle }}"
overlay-style="{{ overlayStyle }}"
close-on-click-overlay="{{ closeOnClickOverlay }}"
root-portal="{{ rootPortal }}"
bind:close="onClickOverlay"
bind:after-leave="onAfterLeave"
>
<view
wx:if="{{ title || useTitleSlot }}"
......@@ -33,7 +35,7 @@
size="large"
loading="{{ loading.cancel }}"
class="van-dialog__button van-hairline--right"
custom-class="van-dialog__cancel"
custom-class="van-dialog__cancel cancle-button-class"
custom-style="color: {{ cancelButtonColor }}"
bind:click="onCancel"
>
......@@ -44,9 +46,9 @@
size="large"
class="van-dialog__button"
loading="{{ loading.confirm }}"
custom-class="van-dialog__confirm"
custom-class="van-dialog__confirm confirm-button-class"
custom-style="color: {{ confirmButtonColor }}"
button-id="{{ confirmButtonId }}"
open-type="{{ confirmButtonOpenType }}"
lang="{{ lang }}"
business-id="{{ businessId }}"
......@@ -56,7 +58,8 @@
send-message-img="{{ sendMessageImg }}"
show-message-card="{{ showMessageCard }}"
app-parameter="{{ appParameter }}"
bindagreeprivacyauthorization="onAgreePrivacyAuthorization"
bindgetRealTimePhoneNumber="onGetRealTimePhoneNumber"
bind:click="onConfirm"
bindgetuserinfo="onGetUserInfo"
bindcontact="onContact"
......@@ -69,26 +72,34 @@
</van-goods-action-button>
</van-goods-action>
<view wx:else class="van-hairline--top van-dialog__footer">
<view wx:elif="{{ showCancelButton || showConfirmButton }}" class="van-hairline--top van-dialog__footer">
<block wx:if="{{ showCancelButton }}">
<slot wx:if="{{ useCancelButtonSlot }}" name="cancel-button" />
<van-button
wx:if="{{ showCancelButton }}"
wx:else
size="large"
loading="{{ loading.cancel }}"
class="van-dialog__button van-hairline--right"
custom-class="van-dialog__cancel"
custom-class="van-dialog__cancel cancle-button-class"
custom-style="color: {{ cancelButtonColor }}"
bind:click="onCancel"
>
{{ cancelButtonText }}
</van-button>
</block>
<block wx:if="{{ showConfirmButton }}">
<slot wx:if="{{ useConfirmButtonSlot }}" name="confirm-button" />
<van-button
wx:if="{{ showConfirmButton }}"
wx:else
size="large"
class="van-dialog__button"
loading="{{ loading.confirm }}"
custom-class="van-dialog__confirm"
custom-class="van-dialog__confirm confirm-button-class"
custom-style="color: {{ confirmButtonColor }}"
button-id="{{ confirmButtonId }}"
open-type="{{ confirmButtonOpenType }}"
lang="{{ lang }}"
business-id="{{ businessId }}"
......@@ -98,7 +109,8 @@
send-message-img="{{ sendMessageImg }}"
show-message-card="{{ showMessageCard }}"
app-parameter="{{ appParameter }}"
bindagreeprivacyauthorization="onAgreePrivacyAuthorization"
bindgetRealTimePhoneNumber="onGetRealTimePhoneNumber"
bind:click="onConfirm"
bindgetuserinfo="onGetUserInfo"
bindcontact="onContact"
......@@ -109,5 +121,6 @@
>
{{ confirmButtonText }}
</van-button>
</block>
</view>
</van-popup>
......
@import '../common/index.wxss';.van-dialog{background-color:var(--dialog-background-color,#fff);border-radius:var(--dialog-border-radius,16px);font-size:var(--dialog-font-size,16px);overflow:hidden;top:45%!important;width:var(--dialog-width,320px)}@media (max-width:321px){.van-dialog{width:var(--dialog-small-screen-width,90%)}}.van-dialog__header{font-weight:var(--dialog-header-font-weight,500);line-height:var(--dialog-header-line-height,24px);padding-top:var(--dialog-header-padding-top,24px);text-align:center}.van-dialog__header--isolated{padding:var(--dialog-header-isolated-padding,24px 0)}.van-dialog__message{-webkit-overflow-scrolling:touch;font-size:var(--dialog-message-font-size,14px);line-height:var(--dialog-message-line-height,20px);max-height:var(--dialog-message-max-height,60vh);overflow-y:auto;padding:var(--dialog-message-padding,24px);text-align:center}.van-dialog__message-text{word-wrap:break-word}.van-dialog__message--hasTitle{color:var(--dialog-has-title-message-text-color,#646566);padding-top:var(--dialog-has-title-message-padding-top,8px)}.van-dialog__message--round-button{color:#323233;padding-bottom:16px}.van-dialog__message--left{text-align:left}.van-dialog__message--right{text-align:right}.van-dialog__footer{display:flex}.van-dialog__footer--round-button{padding:8px 24px 16px!important;position:relative!important}.van-dialog__button{flex:1}.van-dialog__cancel,.van-dialog__confirm{border:0!important}.van-dialog-bounce-enter{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-dialog-bounce-leave-active{opacity:0;transform:translate3d(-50%,-50%,0) scale(.9)}
\ No newline at end of file
@import '../common/index.wxss';.van-dialog{background-color:var(--dialog-background-color,#fff);border-radius:var(--dialog-border-radius,16px);font-size:var(--dialog-font-size,16px);overflow:hidden;top:45%!important;width:var(--dialog-width,320px)}@media (max-width:321px){.van-dialog{width:var(--dialog-small-screen-width,90%)}}.van-dialog__header{font-weight:var(--dialog-header-font-weight,500);line-height:var(--dialog-header-line-height,24px);padding-top:var(--dialog-header-padding-top,24px);text-align:center}.van-dialog__header--isolated{padding:var(--dialog-header-isolated-padding,24px 0)}.van-dialog__message{-webkit-overflow-scrolling:touch;font-size:var(--dialog-message-font-size,14px);line-height:var(--dialog-message-line-height,20px);max-height:var(--dialog-message-max-height,60vh);overflow-y:auto;padding:var(--dialog-message-padding,24px);text-align:center}.van-dialog__message-text{word-wrap:break-word}.van-dialog__message--hasTitle{color:var(--dialog-has-title-message-text-color,#646566);padding-top:var(--dialog-has-title-message-padding-top,8px)}.van-dialog__message--round-button{color:#323233;padding-bottom:16px}.van-dialog__message--left{text-align:left}.van-dialog__message--right{text-align:right}.van-dialog__message--justify{text-align:justify}.van-dialog__footer{display:flex}.van-dialog__footer--round-button{padding:8px 24px 16px!important;position:relative!important}.van-dialog__button{flex:1}.van-dialog__cancel,.van-dialog__confirm{border:0!important}.van-dialog-bounce-enter{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-dialog-bounce-leave-active{opacity:0;transform:translate3d(-50%,-50%,0) scale(.9)}
\ No newline at end of file
......
import { useParent } from '../common/relation';
import { VantComponent } from '../common/component';
VantComponent({
classes: ['item-title-class'],
field: true,
relation: useParent('dropdown-menu', function () {
this.updateDataFromParent();
......@@ -25,12 +26,21 @@ VantComponent({
observer: 'rerender',
},
popupStyle: String,
useBeforeToggle: {
type: Boolean,
value: false,
},
rootPortal: {
type: Boolean,
value: false,
},
},
data: {
transition: true,
showPopup: false,
showWrapper: false,
displayTitle: '',
safeAreaTabBar: false,
},
methods: {
rerender() {
......@@ -41,13 +51,14 @@ VantComponent({
},
updateDataFromParent() {
if (this.parent) {
const { overlay, duration, activeColor, closeOnClickOverlay, direction, } = this.parent.data;
const { overlay, duration, activeColor, closeOnClickOverlay, direction, safeAreaTabBar, } = this.parent.data;
this.setData({
overlay,
duration,
activeColor,
closeOnClickOverlay,
direction,
safeAreaTabBar,
});
}
},
......@@ -76,7 +87,6 @@ VantComponent({
}
},
toggle(show, options = {}) {
var _a;
const { showPopup } = this.data;
if (typeof show !== 'boolean') {
show = !showPopup;
......@@ -84,6 +94,11 @@ VantComponent({
if (show === showPopup) {
return;
}
this.onBeforeToggle(show).then((status) => {
var _a;
if (!status) {
return;
}
this.setData({
transition: !options.immediate,
showPopup: show,
......@@ -97,6 +112,19 @@ VantComponent({
else {
this.rerender();
}
});
},
onBeforeToggle(status) {
const { useBeforeToggle } = this.data;
if (!useBeforeToggle) {
return Promise.resolve(true);
}
return new Promise((resolve) => {
this.$emit('before-toggle', {
status,
callback: (value) => resolve(value),
});
});
},
},
});
......
......@@ -2,7 +2,7 @@
<view
wx:if="{{ showWrapper }}"
class="{{ utils.bem('dropdown-item', direction) }}"
class="{{ utils.bem('dropdown-item', direction) }} custom-class"
style="{{ wrapperStyle }}"
>
<van-popup
......@@ -12,7 +12,9 @@
overlay="{{ overlay }}"
position="{{ direction === 'down' ? 'top' : 'bottom' }}"
duration="{{ transition ? duration : 0 }}"
safe-area-tab-bar="{{ safeAreaTabBar }}"
close-on-click-overlay="{{ closeOnClickOverlay }}"
rootPortal="{{ rootPortal }}"
bind:enter="onOpen"
bind:leave="onClose"
bind:close="toggle"
......@@ -30,7 +32,7 @@
>
<view
slot="title"
class="van-dropdown-item__title"
class="van-dropdown-item__title item-title-class"
style="{{ item.value === value ? 'color:' + activeColor : '' }}"
>
{{ item.text }}
......
......@@ -4,6 +4,7 @@ import { addUnit, getRect, getSystemInfoSync } from '../common/utils';
let ARRAY = [];
VantComponent({
field: true,
classes: ['title-class'],
relation: useChildren('dropdown-item', function () {
this.updateItemListData();
}),
......@@ -31,6 +32,10 @@ VantComponent({
value: 'down',
observer: 'updateChildrenData',
},
safeAreaTabBar: {
type: Boolean,
value: false,
},
closeOnClickOverlay: {
type: Boolean,
value: true,
......
......@@ -10,7 +10,7 @@
bind:tap="onTitleTap"
>
<view
class="{{ item.titleClass }} {{ utils.bem('dropdown-menu__title', { active: item.showPopup, down: item.showPopup === (direction === 'down') }) }}"
class="{{ item.titleClass }} {{ utils.bem('dropdown-menu__title', { active: item.showPopup, down: item.showPopup === (direction === 'down') }) }} title-class"
style="{{ item.showPopup ? 'color:' + activeColor : '' }}"
>
<view class="van-ellipsis">
......
@import '../common/index.wxss';.van-dropdown-menu{background-color:var(--dropdown-menu-background-color,#fff);box-shadow:var(--dropdown-menu-box-shadow,0 2px 12px hsla(210,1%,40%,.12));display:flex;height:var(--dropdown-menu-height,50px);-webkit-user-select:none;user-select:none}.van-dropdown-menu__item{align-items:center;display:flex;flex:1;justify-content:center;min-width:0}.van-dropdown-menu__item:active{opacity:.7}.van-dropdown-menu__item--disabled:active{opacity:1}.van-dropdown-menu__item--disabled .van-dropdown-menu__title{color:var(--dropdown-menu-title-disabled-text-color,#969799)}.van-dropdown-menu__title{box-sizing:border-box;color:var(--dropdown-menu-title-text-color,#323233);font-size:var(--dropdown-menu-title-font-size,15px);line-height:var(--dropdown-menu-title-line-height,18px);max-width:100%;padding:var(--dropdown-menu-title-padding,0 8px);position:relative}.van-dropdown-menu__title:after{border-color:transparent transparent currentcolor currentcolor;border-style:solid;border-width:3px;content:"";margin-top:-5px;opacity:.8;position:absolute;right:-4px;top:50%;transform:rotate(-45deg)}.van-dropdown-menu__title--active{color:var(--dropdown-menu-title-active-text-color,#ee0a24)}.van-dropdown-menu__title--down:after{margin-top:-1px;transform:rotate(135deg)}
\ No newline at end of file
@import '../common/index.wxss';.van-dropdown-menu{background-color:var(--dropdown-menu-background-color,#fff);box-shadow:var(--dropdown-menu-box-shadow,0 2px 12px hsla(210,1%,40%,.12));display:flex;height:var(--dropdown-menu-height,50px);-webkit-user-select:none;user-select:none}.van-dropdown-menu__item{align-items:center;display:flex;flex:1;justify-content:center;min-width:0}.van-dropdown-menu__item:active{opacity:.7}.van-dropdown-menu__item--disabled:active{opacity:1}.van-dropdown-menu__item--disabled .van-dropdown-menu__title{color:var(--dropdown-menu-title-disabled-text-color,#969799)}.van-dropdown-menu__title{box-sizing:border-box;color:var(--dropdown-menu-title-text-color,#323233);font-size:var(--dropdown-menu-title-font-size,15px);line-height:var(--dropdown-menu-title-line-height,18px);max-width:100%;padding:var(--dropdown-menu-title-padding,0 24px 0 8px);position:relative}.van-dropdown-menu__title:after{border-color:transparent transparent currentcolor currentcolor;border-style:solid;border-width:3px;content:"";margin-top:-5px;opacity:.8;position:absolute;right:11px;top:50%;transform:rotate(-45deg)}.van-dropdown-menu__title--active{color:var(--dropdown-menu-title-active-text-color,#ee0a24)}.van-dropdown-menu__title--down:after{margin-top:-1px;transform:rotate(135deg)}
\ No newline at end of file
......
......@@ -22,22 +22,45 @@ VantComponent({
}, clearIcon: {
type: String,
value: 'clear',
}, extraEventParams: {
type: Boolean,
value: false,
} }),
data: {
focused: false,
innerValue: '',
showClear: false,
},
watch: {
value(value) {
if (value !== this.value) {
this.setData({ innerValue: value });
this.value = value;
this.setShowClear();
}
},
clearTrigger() {
this.setShowClear();
},
},
created() {
this.value = this.data.value;
this.setData({ innerValue: this.value });
},
methods: {
formatValue(value) {
const { maxlength } = this.data;
if (maxlength !== -1 && value.length > maxlength) {
return value.slice(0, maxlength);
}
return value;
},
onInput(event) {
const { value = '' } = event.detail || {};
this.value = value;
const formatValue = this.formatValue(value);
this.value = formatValue;
this.setShowClear();
this.emitChange();
return this.emitChange(Object.assign(Object.assign({}, event.detail), { value: formatValue }));
},
onFocus(event) {
this.focused = true;
......@@ -60,7 +83,7 @@ VantComponent({
this.value = '';
this.setShowClear();
nextTick(() => {
this.emitChange();
this.emitChange({ value: '' });
this.$emit('clear', '');
});
},
......@@ -76,7 +99,7 @@ VantComponent({
if (value === '') {
this.setData({ innerValue: '' });
}
this.emitChange();
this.emitChange({ value });
},
onLineChange(event) {
this.$emit('linechange', event.detail);
......@@ -84,12 +107,20 @@ VantComponent({
onKeyboardHeightChange(event) {
this.$emit('keyboardheightchange', event.detail);
},
emitChange() {
this.setData({ value: this.value });
nextTick(() => {
this.$emit('input', this.value);
this.$emit('change', this.value);
});
onBindNicknameReview(event) {
this.$emit('nicknamereview', event.detail);
},
emitChange(detail) {
const { extraEventParams } = this.data;
this.setData({ value: detail.value });
let result;
const data = extraEventParams
? Object.assign(Object.assign({}, detail), { callback: (data) => {
result = data;
} }) : detail.value;
this.$emit('input', data);
this.$emit('change', data);
return result;
},
setShowClear() {
const { clearable, readonly, clearTrigger } = this.data;
......@@ -100,7 +131,7 @@ VantComponent({
const trigger = clearTrigger === 'always' || (clearTrigger === 'focus' && focused);
showClear = hasValue && trigger;
}
this.setData({ showClear });
this.setView({ showClear });
},
noop() { },
},
......
......@@ -13,12 +13,12 @@
title-style="margin-right: 12px;"
custom-style="{{ customStyle }}"
arrow-direction="{{ arrowDirection }}"
custom-class="van-field"
custom-class="custom-class van-field"
>
<slot name="left-icon" slot="icon" />
<view wx:if="{{ label }}" class="label-class {{ utils.bem('field__label', { disabled }) }}" slot="title">
<label for="{{ name }}" wx:if="{{ label }}" class="label-class {{ utils.bem('field__label', { disabled }) }}" slot="title">
{{ label }}
</view>
</label>
<slot wx:else name="label" slot="title" />
<view class="{{ utils.bem('field__body', [type]) }}">
<view class="{{ utils.bem('field__control', [inputAlign, 'custom']) }}" bindtap="onClickInput">
......@@ -47,10 +47,10 @@
<slot name="button" />
</view>
</view>
<view wx:if="{{ showWordLimit && maxlength }}" class="van-field__word-limit">
<label for="{{ name }}" wx:if="{{ showWordLimit && maxlength }}" class="van-field__word-limit">
<view class="{{ utils.bem('field__word-num', { full: value.length >= maxlength }) }}">{{ value.length >= maxlength ? maxlength : value.length }}</view>/{{ maxlength }}
</view>
<view wx:if="{{ errorMessage }}" class="{{ utils.bem('field__error-message', [errorMessageAlign, { disabled, error }]) }}">
</label>
<label for="{{ name }}" wx:if="{{ errorMessage }}" class="{{ utils.bem('field__error-message', [errorMessageAlign, { disabled, error }]) }}">
{{ errorMessage }}
</view>
</label>
</van-cell>
......
@import '../common/index.wxss';.van-field{--cell-icon-size:var(--field-icon-size,16px)}.van-field__label{color:var(--field-label-color,#646566)}.van-field__label--disabled{color:var(--field-disabled-text-color,#c8c9cc)}.van-field__body{align-items:center;display:flex}.van-field__body--textarea{box-sizing:border-box;line-height:1.2em;min-height:var(--cell-line-height,24px);padding:3.6px 0}.van-field__control:empty+.van-field__control{display:block}.van-field__control{background-color:initial;border:0;box-sizing:border-box;color:var(--field-input-text-color,#323233);display:none;height:var(--cell-line-height,24px);line-height:inherit;margin:0;min-height:var(--cell-line-height,24px);padding:0;position:relative;resize:none;text-align:left;width:100%}.van-field__control:empty{display:none}.van-field__control--textarea{height:var(--field-text-area-min-height,18px);min-height:var(--field-text-area-min-height,18px)}.van-field__control--error{color:var(--field-input-error-text-color,#ee0a24)}.van-field__control--disabled{background-color:initial;color:var(--field-input-disabled-text-color,#c8c9cc);opacity:1}.van-field__control--center{text-align:center}.van-field__control--right{text-align:right}.van-field__control--custom{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.van-field__placeholder{color:var(--field-placeholder-text-color,#c8c9cc);left:0;pointer-events:none;position:absolute;right:0;top:0}.van-field__placeholder--error{color:var(--field-error-message-color,#ee0a24)}.van-field__icon-root{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.van-field__clear-root,.van-field__icon-container{line-height:inherit;margin-right:calc(var(--padding-xs, 8px)*-1);padding:0 var(--padding-xs,8px);vertical-align:middle}.van-field__button,.van-field__clear-root,.van-field__icon-container{flex-shrink:0}.van-field__clear-root{color:var(--field-clear-icon-color,#c8c9cc);font-size:var(--field-clear-icon-size,16px)}.van-field__icon-container{color:var(--field-icon-container-color,#969799);font-size:var(--field-icon-size,16px)}.van-field__icon-container:empty{display:none}.van-field__button{padding-left:var(--padding-xs,8px)}.van-field__button:empty{display:none}.van-field__error-message{color:var(--field-error-message-color,#ee0a24);font-size:var(--field-error-message-text-font-size,12px);text-align:left}.van-field__error-message--center{text-align:center}.van-field__error-message--right{text-align:right}.van-field__word-limit{color:var(--field-word-limit-color,#646566);font-size:var(--field-word-limit-font-size,12px);line-height:var(--field-word-limit-line-height,16px);margin-top:var(--padding-base,4px);text-align:right}.van-field__word-num{display:inline}.van-field__word-num--full{color:var(--field-word-num-full-color,#ee0a24)}
\ No newline at end of file
@import '../common/index.wxss';.van-field{--cell-icon-size:var(--field-icon-size,16px)}.van-field__label{color:var(--field-label-color,#646566)}.van-field__label--disabled{color:var(--field-disabled-text-color,#c8c9cc)}.van-field__body{align-items:center;display:flex}.van-field__body--textarea{box-sizing:border-box;line-height:1.2em;min-height:var(--cell-line-height,24px);padding:3.6px 0}.van-field__control:empty+.van-field__control{display:block}.van-field__control{background-color:initial;border:0;box-sizing:border-box;color:var(--field-input-text-color,#323233);display:none;height:var(--cell-line-height,24px);line-height:inherit;margin:0;min-height:var(--cell-line-height,24px);padding:0;position:relative;resize:none;text-align:left;width:100%}.van-field__control:empty{display:none}.van-field__control--textarea{height:var(--field-text-area-min-height,18px);min-height:var(--field-text-area-min-height,18px)}.van-field__control--error{color:var(--field-input-error-text-color,#ee0a24)}.van-field__control--disabled{background-color:initial;color:var(--field-input-disabled-text-color,#c8c9cc);opacity:1}.van-field__control--center{text-align:center}.van-field__control--right{text-align:right}.van-field__control--custom{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.van-field__placeholder{color:var(--field-placeholder-text-color,#c8c9cc);left:0;pointer-events:none;position:absolute;right:0;top:0}.van-field__placeholder--error{color:var(--field-error-message-color,#ee0a24)}.van-field__icon-root{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.van-field__clear-root,.van-field__icon-container{line-height:inherit;margin-right:calc(var(--padding-xs, 8px)*-1);padding:0 var(--padding-xs,8px);vertical-align:middle}.van-field__button,.van-field__clear-root,.van-field__icon-container{flex-shrink:0}.van-field__clear-root{color:var(--field-clear-icon-color,#c8c9cc);font-size:var(--field-clear-icon-size,16px)}.van-field__icon-container{color:var(--field-icon-container-color,#969799);font-size:var(--field-icon-size,16px)}.van-field__icon-container:empty{display:none}.van-field__button{padding-left:var(--padding-xs,8px)}.van-field__button:empty{display:none}.van-field__error-message{color:var(--field-error-message-color,#ee0a24);display:block;font-size:var(--field-error-message-text-font-size,12px);text-align:left}.van-field__error-message--center{text-align:center}.van-field__error-message--right{text-align:right}.van-field__word-limit{color:var(--field-word-limit-color,#646566);font-size:var(--field-word-limit-font-size,12px);line-height:var(--field-word-limit-line-height,16px);margin-top:var(--padding-base,4px);text-align:right}.van-field__word-num{display:inline}.van-field__word-num--full{color:var(--field-word-num-full-color,#ee0a24)}
\ No newline at end of file
......
<wxs src="../wxs/utils.wxs" module="utils" />
<input
id="{{ name }}"
class="{{ utils.bem('field__control', [inputAlign, { disabled, error }]) }} input-class"
type="{{ type }}"
focus="{{ focus }}"
......@@ -25,4 +27,5 @@
bindfocus="onFocus"
bindconfirm="onConfirm"
bindkeyboardheightchange="onKeyboardHeightChange"
bindnicknamereview="onBindNicknameReview"
/>
......
export const commonProps = {
value: {
type: String,
observer(value) {
if (value !== this.value) {
this.setData({ innerValue: value });
this.value = value;
}
},
},
value: String,
placeholder: String,
placeholderStyle: String,
placeholderClass: String,
......
<wxs src="../wxs/utils.wxs" module="utils" />
<wxs src="./index.wxs" module="computed" />
<textarea
id="{{ name }}"
class="{{ utils.bem('field__control', [inputAlign, type, { disabled, error }]) }} input-class"
fixed="{{ fixed }}"
focus="{{ focus }}"
......
export interface InputDetails {
/** 输入框内容 */
value: string;
/** 光标位置 */
cursor?: number;
/** keyCode 为键值 (目前工具还不支持返回keyCode参数) `2.1.0` 起支持 */
keyCode?: number;
}
......@@ -8,6 +8,10 @@ VantComponent({
props: {
text: String,
color: String,
size: {
type: String,
value: 'normal',
},
loading: Boolean,
disabled: Boolean,
plain: Boolean,
......@@ -15,6 +19,10 @@ VantComponent({
type: String,
value: 'danger',
},
customStyle: {
type: String,
value: '',
},
},
methods: {
onClick(event) {
......
<wxs src="../wxs/utils.wxs" module="utils" />
<van-button
id="{{ id }}"
button-id="{{ buttonId }}"
lang="{{ lang }}"
type="{{ type }}"
size="{{ size }}"
color="{{ color }}"
plain="{{ plain }}"
loading="{{ loading }}"
disabled="{{ disabled }}"
open-type="{{ openType }}"
class="{{ utils.bem('goods-action-button', [type, { first: isFirst, last: isLast, plain: plain }])}}"
custom-class="van-goods-action-button__inner"
custom-class="van-goods-action-button__inner custom-class"
custom-style="{{customStyle}}"
business-id="{{ businessId }}"
session-from="{{ sessionFrom }}"
app-parameter="{{ appParameter }}"
......@@ -22,6 +25,8 @@
bindcontact="onContact"
bindopensetting="onOpenSetting"
bindgetuserinfo="onGetUserInfo"
bindagreeprivacyauthorization="onAgreePrivacyAuthorization"
bindgetRealTimePhoneNumber="onGetRealTimePhoneNumber"
bindgetphonenumber="onGetPhoneNumber"
bindlaunchapp="onLaunchApp"
>
......
......@@ -2,13 +2,15 @@ import { VantComponent } from '../common/component';
import { button } from '../mixins/button';
import { link } from '../mixins/link';
VantComponent({
classes: ['icon-class', 'text-class'],
classes: ['icon-class', 'text-class', 'info-class'],
mixins: [link, button],
props: {
text: String,
dot: Boolean,
info: String,
icon: String,
size: String,
color: String,
classPrefix: {
type: String,
value: 'van-icon',
......
......@@ -27,10 +27,15 @@
name="{{ icon }}"
dot="{{ dot }}"
info="{{ info }}"
size="{{ size }}"
color="{{ color }}"
class-prefix="{{ classPrefix }}"
class="van-goods-action-icon__icon"
custom-class="icon-class"
info-class="info-class"
/>
<slot wx:else name="icon" />
<view wx:else>
<slot name="icon" />
</view>
<text class="text-class">{{ text }}</text>
</van-button>
......
import { VantComponent } from '../common/component';
VantComponent({
classes: ['info-class'],
props: {
dot: Boolean,
info: null,
......
......@@ -9,7 +9,7 @@
wx:if="{{ info !== null || dot }}"
dot="{{ dot }}"
info="{{ info }}"
custom-class="van-icon__info"
custom-class="van-icon__info info-class"
/>
<image
wx:if="{{ computed.isImage(name) }}"
......
......@@ -9,6 +9,10 @@ function isImage(name) {
function rootClass(data) {
var classes = ['custom-class'];
if (data.classPrefix !== 'van-icon') {
classes.push('van-icon--custom')
}
if (data.classPrefix != null) {
classes.push(data.classPrefix);
}
......
This diff is collapsed. Click to expand it.
......@@ -25,6 +25,10 @@ VantComponent({
type: String,
value: 'fill',
},
webp: {
type: Boolean,
value: false,
},
showError: {
type: Boolean,
value: true,
......
......@@ -11,6 +11,7 @@
src="{{ src }}"
mode="{{ computed.mode(fit) }}"
lazy-load="{{ lazyLoad }}"
webp="{{ webp }}"
class="image-class van-image__img"
show-menu-by-longpress="{{ showMenuByLongpress }}"
bind:load="onLoad"
......
@import '../common/index.wxss';.van-image{display:inline-block;position:relative}.van-image--round{border-radius:50%;overflow:hidden}.van-image--round .van-image__img{border-radius:inherit}.van-image__error,.van-image__img,.van-image__loading{display:block;height:100%;width:100%}.van-image__error,.van-image__loading{align-items:center;background-color:var(--image-placeholder-background-color,#f7f8fa);color:var(--image-placeholder-text-color,#969799);display:flex;flex-direction:column;font-size:var(--image-placeholder-font-size,14px);justify-content:center;left:0;position:absolute;top:0}.van-image__loading-icon{color:var(--image-loading-icon-color,#dcdee0);font-size:var(--image-loading-icon-size,32px)!important}.van-image__error-icon{color:var(--image-error-icon-color,#dcdee0);font-size:var(--image-error-icon-size,32px)!important}
\ No newline at end of file
@import '../common/index.wxss';.van-image{display:inline-block;position:relative;vertical-align:top}.van-image--round{border-radius:50%;overflow:hidden}.van-image--round .van-image__img{border-radius:inherit}.van-image__error,.van-image__img,.van-image__loading{display:block;height:100%;width:100%}.van-image__error,.van-image__loading{align-items:center;background-color:var(--image-placeholder-background-color,#f7f8fa);color:var(--image-placeholder-text-color,#969799);display:flex;flex-direction:column;font-size:var(--image-placeholder-font-size,14px);justify-content:center;left:0;position:absolute;top:0}.van-image__loading-icon{color:var(--image-loading-icon-color,#dcdee0);font-size:var(--image-loading-icon-size,32px)!important}.van-image__error-icon{color:var(--image-error-icon-color,#dcdee0);font-size:var(--image-error-icon-size,32px)!important}
\ No newline at end of file
......
......@@ -7,5 +7,20 @@ export const basic = Behavior({
this.setData(data);
return new Promise((resolve) => wx.nextTick(resolve));
},
// high performance setData
setView(data, callback) {
const target = {};
let hasChange = false;
Object.keys(data).forEach((key) => {
if (data[key] !== this.data[key]) {
target[key] = data[key];
hasChange = true;
}
});
if (hasChange) {
return this.setData(target, callback);
}
return callback && callback();
},
},
});
......
......@@ -3,6 +3,7 @@ export const button = Behavior({
externalClasses: ['hover-class'],
properties: {
id: String,
buttonId: String,
lang: String,
businessId: Number,
sessionFrom: String,
......@@ -28,6 +29,9 @@ export const button = Behavior({
onGetPhoneNumber(event) {
this.triggerEvent('getphonenumber', event.detail);
},
onGetRealTimePhoneNumber(event) {
this.triggerEvent('getrealtimephonenumber', event.detail);
},
onError(event) {
this.triggerEvent('error', event.detail);
},
......@@ -37,5 +41,11 @@ export const button = Behavior({
onOpenSetting(event) {
this.triggerEvent('opensetting', event.detail);
},
onAgreePrivacyAuthorization(event) {
this.triggerEvent('agreeprivacyauthorization', event.detail);
},
onChooseAvatar(event) {
this.triggerEvent('chooseavatar', event.detail);
},
},
});
......
/// <reference types="miniprogram-api-typings" />
declare type IPageScrollOption = WechatMiniprogram.Page.IPageScrollOption;
declare type Scroller = (this: WechatMiniprogram.Component.TrivialInstance, event?: IPageScrollOption) => void;
export declare const pageScrollMixin: (scroller: Scroller) => string;
/// <reference types="miniprogram-api-typings" />
type IPageScrollOption = WechatMiniprogram.Page.IPageScrollOption;
type Scroller = (this: WechatMiniprogram.Component.TrivialInstance, event?: IPageScrollOption) => void;
export declare function pageScrollMixin(scroller: Scroller): string;
export {};
......
import { isFunction } from '../common/validator';
import { getCurrentPage, isDef } from '../common/utils';
function onPageScroll(event) {
const { vanPageScroller = [] } = getCurrentPage();
......@@ -8,29 +9,34 @@ function onPageScroll(event) {
}
});
}
export const pageScrollMixin = (scroller) => Behavior({
export function pageScrollMixin(scroller) {
return Behavior({
attached() {
const page = getCurrentPage();
if (!isDef(page)) {
return;
}
if (Array.isArray(page.vanPageScroller)) {
page.vanPageScroller.push(scroller.bind(this));
}
else {
page.vanPageScroller =
typeof page.onPageScroll === 'function'
? [page.onPageScroll.bind(page), scroller.bind(this)]
: [scroller.bind(this)];
const _scroller = scroller.bind(this);
const { vanPageScroller = [] } = page;
if (isFunction(page.onPageScroll) && page.onPageScroll !== onPageScroll) {
vanPageScroller.push(page.onPageScroll.bind(page));
}
vanPageScroller.push(_scroller);
page.vanPageScroller = vanPageScroller;
page.onPageScroll = onPageScroll;
this._scroller = _scroller;
},
detached() {
var _a;
const page = getCurrentPage();
if (isDef(page)) {
page.vanPageScroller =
((_a = page.vanPageScroller) === null || _a === void 0 ? void 0 : _a.filter((item) => item !== scroller)) || [];
if (!isDef(page) || !isDef(page.vanPageScroller)) {
return;
}
const { vanPageScroller } = page;
const index = vanPageScroller.findIndex((v) => v === this._scroller);
if (index > -1) {
page.vanPageScroller.splice(index, 1);
}
this._scroller = undefined;
},
});
});
}
......
......@@ -21,7 +21,6 @@ export function transition(showDefaultValue) {
duration: {
type: null,
value: 300,
observer: 'observeDuration',
},
name: {
type: String,
......@@ -43,12 +42,30 @@ export function transition(showDefaultValue) {
if (value === old) {
return;
}
value ? this.enter() : this.leave();
value ? this.enureEnter() : this.enureLeave();
},
enter() {
enureEnter() {
if (this.enterPromise)
return;
this.enterPromise = new Promise((resolve) => this.enter(resolve));
},
enureLeave() {
const { enterPromise } = this;
if (!enterPromise)
return;
enterPromise
.then(() => new Promise((resolve) => this.leave(resolve)))
.then(() => {
this.enterPromise = null;
});
},
enter(resolve) {
const { duration, name } = this.data;
const classNames = getClassNames(name);
const currentDuration = isObj(duration) ? duration.enter : duration;
if (this.status === 'enter') {
return;
}
this.status = 'enter';
this.$emit('before-enter');
requestAnimationFrame(() => {
......@@ -68,10 +85,11 @@ export function transition(showDefaultValue) {
}
this.transitionEnded = false;
this.setData({ classes: classNames['enter-to'] });
resolve();
});
});
},
leave() {
leave(resolve) {
if (!this.data.display) {
return;
}
......@@ -94,7 +112,10 @@ export function transition(showDefaultValue) {
return;
}
this.transitionEnded = false;
setTimeout(() => this.onTransitionEnd(), currentDuration);
setTimeout(() => {
this.onTransitionEnd();
resolve();
}, currentDuration);
this.setData({ classes: classNames['leave-to'] });
});
});
......
@import '../common/index.wxss';.van-nav-bar{background-color:var(--nav-bar-background-color,#fff);height:var(--nav-bar-height,46px);line-height:var(--nav-bar-height,46px);position:relative;text-align:center;-webkit-user-select:none;user-select:none}.van-nav-bar__content{height:100%;position:relative}.van-nav-bar__text{color:var(--nav-bar-text-color,#1989fa);display:inline-block;margin:0 calc(var(--padding-md, 16px)*-1);padding:0 var(--padding-md,16px);vertical-align:middle}.van-nav-bar__text--hover{background-color:#f2f3f5}.van-nav-bar__arrow{color:var(--nav-bar-icon-color,#1989fa)!important;font-size:var(--nav-bar-arrow-size,16px)!important;vertical-align:middle}.van-nav-bar__arrow+.van-nav-bar__text{margin-left:-20px;padding-left:25px}.van-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.van-nav-bar__title{color:var(--nav-bar-title-text-color,#323233);font-size:var(--nav-bar-title-font-size,16px);font-weight:var(--font-weight-bold,500);margin:0 auto;max-width:60%}.van-nav-bar__left,.van-nav-bar__right{align-items:center;bottom:0;display:flex;font-size:var(--font-size-md,14px);position:absolute;top:0}.van-nav-bar__left{left:var(--padding-md,16px)}.van-nav-bar__right{right:var(--padding-md,16px)}
\ No newline at end of file
@import '../common/index.wxss';.van-nav-bar{background-color:var(--nav-bar-background-color,#fff);box-sizing:initial;height:var(--nav-bar-height,46px);line-height:var(--nav-bar-height,46px);position:relative;text-align:center;-webkit-user-select:none;user-select:none}.van-nav-bar__content{height:100%;position:relative}.van-nav-bar__text{color:var(--nav-bar-text-color,#1989fa);display:inline-block;margin:0 calc(var(--padding-md, 16px)*-1);padding:0 var(--padding-md,16px);vertical-align:middle}.van-nav-bar__text--hover{background-color:#f2f3f5}.van-nav-bar__arrow{color:var(--nav-bar-icon-color,#1989fa)!important;font-size:var(--nav-bar-arrow-size,16px)!important;vertical-align:middle}.van-nav-bar__arrow+.van-nav-bar__text{margin-left:-20px;padding-left:25px}.van-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.van-nav-bar__title{color:var(--nav-bar-title-text-color,#323233);font-size:var(--nav-bar-title-font-size,16px);font-weight:var(--font-weight-bold,500);margin:0 auto;max-width:60%}.van-nav-bar__left,.van-nav-bar__right{align-items:center;bottom:0;display:flex;font-size:var(--font-size-md,14px);position:absolute;top:0}.van-nav-bar__left{left:var(--padding-md,16px)}.van-nav-bar__right{right:var(--padding-md,16px)}
\ No newline at end of file
......
......@@ -61,7 +61,7 @@ VantComponent({
getRect(this, '.van-notice-bar__wrap'),
]).then((rects) => {
const [contentRect, wrapRect] = rects;
const { speed, scrollable, delay } = this.data;
const { scrollable } = this.data;
if (contentRect == null ||
wrapRect == null ||
!contentRect.width ||
......@@ -70,20 +70,26 @@ VantComponent({
return;
}
if (scrollable || wrapRect.width < contentRect.width) {
const duration = ((wrapRect.width + contentRect.width) / speed) * 1000;
this.wrapWidth = wrapRect.width;
this.contentWidth = contentRect.width;
this.duration = duration;
this.animation = wx.createAnimation({
duration,
timingFunction: 'linear',
delay,
});
this.initAnimation(wrapRect.width, contentRect.width);
this.scroll(true);
}
});
});
},
initAnimation(warpWidth, contentWidth) {
const { speed, delay } = this.data;
this.wrapWidth = warpWidth;
this.contentWidth = contentWidth;
// begin 0
this.contentDuration = (contentWidth / speed) * 1000;
// begin -wrapWidth
this.duration = ((warpWidth + contentWidth) / speed) * 1000;
this.animation = wx.createAnimation({
duration: this.contentDuration,
timingFunction: 'linear',
delay,
});
},
scroll(isInit = false) {
this.timer && clearTimeout(this.timer);
this.timer = null;
......@@ -93,17 +99,18 @@ VantComponent({
.step()
.export(),
});
const duration = isInit ? this.contentDuration : this.duration;
requestAnimationFrame(() => {
this.setData({
animationData: this.animation
.translateX(-this.contentWidth)
.step()
.step({ duration })
.export(),
});
});
this.timer = setTimeout(() => {
this.scroll();
}, this.duration);
}, duration + this.data.delay);
},
onClickIcon(event) {
if (this.data.mode === 'closeable') {
......
......@@ -16,5 +16,7 @@ interface NotifyOptions {
declare function Notify(options: NotifyOptions | string): any;
declare namespace Notify {
var clear: (options?: NotifyOptions | undefined) => void;
var setDefaultOptions: (options: NotifyOptions) => void;
var resetDefaultOptions: () => void;
}
export default Notify;
......
......@@ -13,6 +13,7 @@ const defaultOptions = {
onOpened: () => { },
onClose: () => { },
};
let currentOptions = Object.assign({}, defaultOptions);
function parseOptions(message) {
if (message == null) {
return {};
......@@ -24,7 +25,7 @@ function getContext() {
return pages[pages.length - 1];
}
export default function Notify(options) {
options = Object.assign(Object.assign({}, defaultOptions), parseOptions(options));
options = Object.assign(Object.assign({}, currentOptions), parseOptions(options));
const context = options.context || getContext();
const notify = context.selectComponent(options.selector);
delete options.context;
......@@ -44,3 +45,9 @@ Notify.clear = function (options) {
notify.hide();
}
};
Notify.setDefaultOptions = (options) => {
Object.assign(currentOptions, options);
};
Notify.resetDefaultOptions = () => {
currentOptions = Object.assign({}, defaultOptions);
};
......
......@@ -15,6 +15,10 @@ VantComponent({
type: Boolean,
value: true,
},
rootPortal: {
type: Boolean,
value: false,
},
},
methods: {
onClick() {
......
<van-transition
wx:if="{{ lockScroll }}"
show="{{ show }}"
custom-class="van-overlay"
custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
duration="{{ duration }}"
bind:tap="onClick"
catch:touchmove="noop"
>
<slot></slot>
</van-transition>
<van-transition
wx:else
show="{{ show }}"
custom-class="van-overlay"
custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
duration="{{ duration }}"
bind:tap="onClick"
>
<slot></slot>
</van-transition>
<import src="./overlay.wxml" />
<root-portal wx:if="{{ rootPortal }}">
<include src="./overlay.wxml" />
</root-portal>
<include wx:else src="./overlay.wxml" />
......
<van-transition
show="{{ show }}"
custom-class="van-overlay custom-class"
custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
duration="{{ duration }}"
bind:tap="onClick"
catch:touchmove="{{ lockScroll ? 'noop' : ''}}"
>
<slot></slot>
</van-transition>
\ No newline at end of file
......@@ -53,10 +53,18 @@ VantComponent({
type: Boolean,
value: false,
},
safeAreaTabBar: {
type: Boolean,
value: false,
},
lockScroll: {
type: Boolean,
value: true,
},
rootPortal: {
type: Boolean,
value: false,
},
},
created() {
this.observeClass();
......
<wxs src="../wxs/utils.wxs" module="utils" />
<wxs src="./index.wxs" module="computed" />
<import src="./popup.wxml" />
<van-overlay
wx:if="{{ overlay }}"
show="{{ show }}"
......@@ -9,18 +11,11 @@
duration="{{ duration }}"
bind:click="onClickOverlay"
lock-scroll="{{ lockScroll }}"
root-portal="{{ rootPortal }}"
/>
<view
wx:if="{{ inited }}"
class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safe: safeAreaInsetBottom, safeTop: safeAreaInsetTop }]) }}"
style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle }) }}"
bind:transitionend="onTransitionEnd"
>
<slot />
<van-icon
wx:if="{{ closeable }}"
name="{{ closeIcon }}"
class="close-icon-class van-popup__close-icon van-popup__close-icon--{{ closeIconPosition }}"
bind:tap="onClickCloseIcon"
/>
</view>
<root-portal wx:if="{{ rootPortal }}">
<include src="./popup.wxml" />
</root-portal>
<include wx:else src="./popup.wxml" />
......
@import '../common/index.wxss';.van-popup{-webkit-overflow-scrolling:touch;animation:ease both;background-color:var(--popup-background-color,#fff);box-sizing:border-box;max-height:100%;overflow-y:auto;position:fixed;transition-timing-function:ease}.van-popup--center{left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.van-popup--center.van-popup--round{border-radius:var(--popup-round-border-radius,16px)}.van-popup--top{left:0;top:0;width:100%}.van-popup--top.van-popup--round{border-radius:0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--right{right:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--right.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--bottom{bottom:0;left:0;width:100%}.van-popup--bottom.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0}.van-popup--left{left:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--left.van-popup--round{border-radius:0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0}.van-popup--bottom.van-popup--safe{padding-bottom:env(safe-area-inset-bottom)}.van-popup--safeTop{padding-top:env(safe-area-inset-top)}.van-popup__close-icon{color:var(--popup-close-icon-color,#969799);font-size:var(--popup-close-icon-size,18px);position:absolute;z-index:var(--popup-close-icon-z-index,1)}.van-popup__close-icon--top-left{left:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--top-right{right:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-left{bottom:var(--popup-close-icon-margin,16px);left:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-right{bottom:var(--popup-close-icon-margin,16px);right:var(--popup-close-icon-margin,16px)}.van-popup__close-icon:active{opacity:.6}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,transform}.van-scale-enter,.van-scale-leave-to{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:transform}.van-bottom-enter,.van-bottom-leave-to{transform:translate3d(0,100%,0)}.van-top-enter,.van-top-leave-to{transform:translate3d(0,-100%,0)}.van-left-enter,.van-left-leave-to{transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{transform:translate3d(100%,-50%,0)}
\ No newline at end of file
@import '../common/index.wxss';.van-popup{-webkit-overflow-scrolling:touch;animation:ease both;background-color:var(--popup-background-color,#fff);box-sizing:border-box;max-height:100%;overflow-y:auto;position:fixed;transition-timing-function:ease}.van-popup--center{left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.van-popup--center.van-popup--round{border-radius:var(--popup-round-border-radius,16px)}.van-popup--top{left:0;top:0;width:100%}.van-popup--top.van-popup--round{border-radius:0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--right{right:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--right.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--bottom{bottom:0;left:0;width:100%}.van-popup--bottom.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0}.van-popup--left{left:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--left.van-popup--round{border-radius:0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0}.van-popup--bottom.van-popup--safe{padding-bottom:env(safe-area-inset-bottom)}.van-popup--bottom.van-popup--safeTabBar,.van-popup--top.van-popup--safeTabBar{bottom:var(--tabbar-height,50px)}.van-popup--safeTop{padding-top:env(safe-area-inset-top)}.van-popup__close-icon{color:var(--popup-close-icon-color,#969799);font-size:var(--popup-close-icon-size,18px);position:absolute;z-index:var(--popup-close-icon-z-index,1)}.van-popup__close-icon--top-left{left:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--top-right{right:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-left{bottom:var(--popup-close-icon-margin,16px);left:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-right{bottom:var(--popup-close-icon-margin,16px);right:var(--popup-close-icon-margin,16px)}.van-popup__close-icon:active{opacity:.6}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,transform}.van-scale-enter,.van-scale-leave-to{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:transform}.van-bottom-enter,.van-bottom-leave-to{transform:translate3d(0,100%,0)}.van-top-enter,.van-top-leave-to{transform:translate3d(0,-100%,0)}.van-left-enter,.van-left-leave-to{transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{transform:translate3d(100%,-50%,0)}
\ No newline at end of file
......
<wxs src="../wxs/utils.wxs" module="utils" />
<wxs src="./index.wxs" module="computed" />
<view
wx:if="{{ inited }}"
class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safe: safeAreaInsetBottom, safeTop: safeAreaInsetTop, safeTabBar: safeAreaTabBar }]) }}"
style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle }) }}"
bind:transitionend="onTransitionEnd"
>
<slot />
<van-icon
wx:if="{{ closeable }}"
name="{{ closeIcon }}"
class="close-icon-class van-popup__close-icon van-popup__close-icon--{{ closeIconPosition }}"
bind:tap="onClickCloseIcon"
/>
</view>
@import '../common/index.wxss';.van-rate{display:inline-flex;-webkit-user-select:none;user-select:none}.van-rate__item{padding:0 var(--rate-horizontal-padding,2px);position:relative}.van-rate__item:not(:last-child){padding-right:var(--rate-icon-gutter,4px)}.van-rate__icon{color:var(--rate-icon-void-color,#c8c9cc);display:block;font-size:var(--rate-icon-size,20px);height:1em}.van-rate__icon--half{left:var(--rate-horizontal-padding,2px);overflow:hidden;position:absolute;top:0;width:.5em}.van-rate__icon--full,.van-rate__icon--half{color:var(--rate-icon-full-color,#ee0a24)}.van-rate__icon--disabled{color:var(--rate-icon-disabled-color,#c8c9cc)}
\ No newline at end of file
@import '../common/index.wxss';.van-rate{display:inline-flex;-webkit-user-select:none;user-select:none}.van-rate__item{padding:0 var(--rate-horizontal-padding,2px);position:relative}.van-rate__item:not(:last-child){padding-right:var(--rate-icon-gutter,4px)}.van-rate__icon{color:var(--rate-icon-void-color,#c8c9cc);display:block;font-size:var(--rate-icon-size,20px);height:100%}.van-rate__icon--half{left:var(--rate-horizontal-padding,2px);overflow:hidden;position:absolute;top:0;width:.5em}.van-rate__icon--full,.van-rate__icon--half{color:var(--rate-icon-full-color,#ee0a24)}.van-rate__icon--disabled{color:var(--rate-icon-disabled-color,#c8c9cc)}
\ No newline at end of file
......
......@@ -4,6 +4,10 @@ VantComponent({
field: true,
classes: ['field-class', 'input-class', 'cancel-class'],
props: {
value: {
type: String,
value: '',
},
label: String,
focus: Boolean,
error: Boolean,
......@@ -49,6 +53,10 @@ VantComponent({
type: String,
value: 'clear',
},
cursorSpacing: {
type: Number,
value: 0,
},
},
methods: {
onChange(event) {
......@@ -60,7 +68,7 @@ VantComponent({
onCancel() {
/**
* 修复修改输入框值时，输入框失焦和赋值同时触发，赋值失效
* https://github.com/youzan/@vant/weapp/issues/1768
* https://github.com/youzan/vant-weapp/issues/1768
*/
setTimeout(() => {
if (canIUseModel()) {
......
......@@ -28,6 +28,7 @@
input-class="input-class"
placeholder="{{ placeholder }}"
placeholder-style="{{ placeholderStyle }}"
cursor-spacing="{{ cursorSpacing }}"
custom-style="padding: 5px 10px 5px 0; background-color: transparent;"
bind:blur="onBlur"
bind:focus="onFocus"
......@@ -48,6 +49,6 @@
hover-stay-time="70"
>
<slot wx:if="{{ useActionSlot }}" name="action" />
<view wx:else bind:tap="onCancel" class="cancel-class">{{ actionText }}</view>
<view wx:else bind:tap="onCancel" class="van-search__action-button cancel-class">{{ actionText }}</view>
</view>
</view>
......
@import '../common/index.wxss';.van-search{align-items:center;box-sizing:border-box;display:flex;padding:var(--search-padding,10px 12px)}.van-search__content{background-color:var(--search-background-color,#f7f8fa);border-radius:2px;display:flex;flex:1;padding-left:var(--padding-sm,12px)}.van-search__content--round{border-radius:999px}.van-search__label{color:var(--search-label-color,#323233);font-size:var(--search-label-font-size,14px);line-height:var(--search-input-height,34px);padding:var(--search-label-padding,0 5px)}.van-search__field{flex:1}.van-search__field__left-icon{color:var(--search-left-icon-color,#969799)}.van-search--withaction{padding-right:0}.van-search__action{color:var(--search-action-text-color,#323233);font-size:var(--search-action-font-size,14px);line-height:var(--search-input-height,34px);padding:var(--search-action-padding,0 8px)}.van-search__action--hover{background-color:#f2f3f5}
\ No newline at end of file
@import '../common/index.wxss';.van-search{align-items:center;box-sizing:border-box;display:flex;padding:var(--search-padding,10px 12px)}.van-search__content{background-color:var(--search-background-color,#f7f8fa);border-radius:2px;display:flex;flex:1;padding-left:var(--padding-sm,12px)}.van-search__content--round{border-radius:999px}.van-search__label{color:var(--search-label-color,#323233);font-size:var(--search-label-font-size,14px);line-height:var(--search-input-height,34px);padding:var(--search-label-padding,0 5px)}.van-search__field{flex:1}.van-search__field__left-icon{color:var(--search-left-icon-color,#969799)}.van-search--withaction{padding-right:0}.van-search__action{color:var(--search-action-text-color,#323233);font-size:var(--search-action-font-size,14px);line-height:var(--search-input-height,34px)}.van-search__action--hover{background-color:#f2f3f5}.van-search__action-button{padding:var(--search-action-padding,0 8px)}
\ No newline at end of file
......
......@@ -36,6 +36,10 @@ VantComponent({
type: null,
value: 300,
},
rootPortal: {
type: Boolean,
value: false,
},
},
methods: {
onClickOverlay() {
......
......@@ -11,6 +11,7 @@
overlay-style="{{ overlayStyle }}"
close-on-click-overlay="{{ closeOnClickOverlay }}"
safe-area-inset-bottom="{{ safeAreaInsetBottom }}"
root-portal="{{ rootPortal }}"
bind:close="onClose"
bind:click-overlay="onClickOverlay"
>
......
import { VantComponent } from '../common/component';
import { touch } from '../mixins/touch';
import { canIUseModel } from '../common/version';
import { getRect, addUnit } from '../common/utils';
import { getRect, addUnit, nextTick, addNumber, clamp } from '../common/utils';
const DRAG_STATUS = {
START: 'start',
MOVING: 'moving',
END: 'end',
};
VantComponent({
mixins: [touch],
props: {
......@@ -54,16 +59,16 @@ VantComponent({
else {
this.startValue = this.format(this.newValue);
}
this.dragStatus = 'start';
this.dragStatus = DRAG_STATUS.START;
},
onTouchMove(event) {
if (this.data.disabled)
return;
if (this.dragStatus === 'start') {
if (this.dragStatus === DRAG_STATUS.START) {
this.$emit('drag-start');
}
this.touchMove(event);
this.dragStatus = 'draging';
this.dragStatus = DRAG_STATUS.MOVING;
getRect(this, '.van-slider').then((rect) => {
const { vertical } = this.data;
const delta = vertical ? this.deltaY : this.deltaX;
......@@ -82,9 +87,12 @@ VantComponent({
onTouchEnd() {
if (this.data.disabled)
return;
if (this.dragStatus === 'draging') {
if (this.dragStatus === DRAG_STATUS.MOVING) {
this.dragStatus = DRAG_STATUS.END;
nextTick(() => {
this.updateValue(this.newValue, true);
this.$emit('drag-end');
});
}
},
onClick(event) {
......@@ -163,15 +171,19 @@ VantComponent({
const { max, min } = this.data;
return max - min;
},
getOffsetWidth(current, min) {
const scope = this.getScope();
// 避免最小值小于最小step时出现负数情况
return `${Math.max(((current - min) * 100) / scope, 0)}%`;
},
// 计算选中条的长度百分比
calcMainAxis() {
const { value } = this;
const { min } = this.data;
const scope = this.getScope();
if (this.isRange(value)) {
return `${((value[1] - value[0]) * 100) / scope}%`;
return this.getOffsetWidth(value[1], value[0]);
}
return `${((value - Number(min)) * 100) / scope}%`;
return this.getOffsetWidth(value, Number(min));
},
// 计算选中条的开始位置的偏移量
calcOffset() {
......@@ -184,8 +196,12 @@ VantComponent({
return '0%';
},
format(value) {
const { max, min, step } = this.data;
return Math.round(Math.max(min, Math.min(value, max)) / step) * step;
const min = +this.data.min;
const max = +this.data.max;
const step = +this.data.step;
value = clamp(value, min, max);
const diff = Math.round((value - min) / step) * step;
return addNumber(min, diff);
},
},
});
......
......@@ -16,7 +16,6 @@ VantComponent({
props: {
value: {
type: null,
observer: 'observeValue',
},
integer: {
type: Boolean,
......@@ -66,38 +65,42 @@ VantComponent({
data: {
currentValue: '',
},
watch: {
value() {
this.observeValue();
},
},
created() {
this.setData({
currentValue: this.format(this.data.value),
currentValue: this.format(this.data.value).newValue,
});
},
methods: {
observeValue() {
const { value, currentValue } = this.data;
if (!equal(value, currentValue)) {
this.setData({ currentValue: this.format(value) });
}
const { value } = this.data;
this.setData({ currentValue: this.format(value).newValue });
},
check() {
const val = this.format(this.data.currentValue);
if (!equal(val, this.data.currentValue)) {
this.setData({ currentValue: val });
const { newValue } = this.format(this.data.currentValue);
if (!equal(newValue, this.data.currentValue)) {
this.setData({ currentValue: newValue });
}
},
isDisabled(type) {
const { disabled, disablePlus, disableMinus, currentValue, max, min, } = this.data;
const { disabled, disablePlus, disableMinus, currentValue, max, min } = this.data;
if (type === 'plus') {
return disabled || disablePlus || currentValue >= max;
return disabled || disablePlus || +currentValue >= +max;
}
return disabled || disableMinus || currentValue <= min;
return disabled || disableMinus || +currentValue <= +min;
},
onFocus(event) {
this.$emit('focus', event.detail);
},
onBlur(event) {
const value = this.format(event.detail.value);
this.emitChange(value);
this.$emit('blur', Object.assign(Object.assign({}, event.detail), { value }));
const data = this.format(event.detail.value);
this.setData({ currentValue: data.newValue });
this.emitChange(data);
this.$emit('blur', Object.assign(Object.assign({}, event.detail), { value: +data.newValue }));
},
// filter illegal characters
filter(value) {
......@@ -107,17 +110,16 @@ VantComponent({
}
return value;
},
// limit value range
format(value) {
value = this.filter(value);
// filter illegal characters and format integer
const safeValue = this.filter(value);
// format range
value = value === '' ? 0 : +value;
value = Math.max(Math.min(this.data.max, value), this.data.min);
const rangeValue = Math.max(Math.min(this.data.max, +safeValue), this.data.min);
// format decimal
if (isDef(this.data.decimalLength)) {
value = value.toFixed(this.data.decimalLength);
}
return value;
const newValue = isDef(this.data.decimalLength)
? rangeValue.toFixed(this.data.decimalLength)
: String(rangeValue);
return { value, newValue };
},
onInput(event) {
const { value = '' } = event.detail || {};
......@@ -125,19 +127,16 @@ VantComponent({
if (value === '') {
return;
}
let formatted = this.filter(value);
// limit max decimal length
if (isDef(this.data.decimalLength) && formatted.indexOf('.') !== -1) {
const pair = formatted.split('.');
formatted = `${pair[0]}.${pair[1].slice(0, this.data.decimalLength)}`;
}
const formatted = this.format(value);
this.emitChange(formatted);
},
emitChange(value) {
emitChange(data) {
const { value, newValue } = data;
if (!this.data.asyncChange) {
this.setData({ currentValue: value });
// fix when input 11. parsed to 11, unable to enter decimal
this.setData({ currentValue: +value === +newValue ? value : newValue });
}
this.$emit('change', value);
this.$emit('change', +newValue);
},
onChange() {
const { type } = this;
......@@ -146,7 +145,7 @@ VantComponent({
return;
}
const diff = type === 'minus' ? -this.data.step : +this.data.step;
const value = this.format(add(+this.data.currentValue, diff));
const value = this.format(String(add(+this.data.currentValue, diff)));
this.emitChange(value);
this.$emit(type);
},
......
......@@ -16,7 +16,6 @@
<slot name="minus" />
</view>
<input
always-embed="{{ false }}"
type="{{ integer ? 'number' : 'digit' }}"
class="input-class {{ utils.bem('stepper__input', { disabled: disabled || disableInput }) }}"
style="{{ computed.inputStyle({ buttonSize, inputWidth }) }}"
......
......@@ -20,7 +20,7 @@
wx:if="{{ item.inactiveIcon || inactiveIcon }}"
color="{{ status(index, active) === 'inactive' ? inactiveColor: activeColor }}"
name="{{ item.inactiveIcon || inactiveIcon }}"
custom-class="van-step__icon"
class="van-step__icon"
/>
<view
wx:else
......@@ -29,7 +29,7 @@
/>
</block>
<van-icon wx:else name="{{ item.activeIcon || activeIcon }}" color="{{ activeColor }}" custom-class="van-step__icon" />
<van-icon wx:else name="{{ item.activeIcon || activeIcon }}" color="{{ activeColor }}" class="van-step__icon" />
</view>
<view
wx:if="{{ index !== steps.length - 1 }}"
......
@import '../common/index.wxss';.van-steps{background-color:var(--steps-background-color,#fff);overflow:hidden}.van-steps--horizontal{padding:10px}.van-steps--horizontal .van-step__wrapper{display:flex;overflow:hidden;position:relative}.van-steps--vertical{padding-left:10px}.van-steps--vertical .van-step__wrapper{padding:0 0 0 20px}.van-step{color:var(--step-text-color,#969799);flex:1;font-size:var(--step-font-size,14px);position:relative}.van-step--finish{color:var(--step-finish-text-color,#323233)}.van-step__circle{background-color:var(--step-circle-color,#969799);border-radius:50%;height:var(--step-circle-size,5px);width:var(--step-circle-size,5px)}.van-step--horizontal{padding-bottom:14px}.van-step--horizontal:first-child .van-step__title{transform:none}.van-step--horizontal:first-child .van-step__circle-container{padding:0 8px 0 0;transform:translate3d(0,50%,0)}.van-step--horizontal:last-child{position:absolute;right:0;width:auto}.van-step--horizontal:last-child .van-step__title{text-align:right;transform:none}.van-step--horizontal:last-child .van-step__circle-container{padding:0 0 0 8px;right:0;transform:translate3d(0,50%,0)}.van-step--horizontal .van-step__circle-container{background-color:#fff;bottom:6px;padding:0 var(--padding-xs,8px);position:absolute;transform:translate3d(-50%,50%,0);z-index:1}.van-step--horizontal .van-step__title{display:inline-block;font-size:var(--step-horizontal-title-font-size,12px);transform:translate3d(-50%,0,0)}.van-step--horizontal .van-step__line{background-color:var(--step-line-color,#ebedf0);bottom:6px;height:1px;left:0;position:absolute;right:0;transform:translate3d(0,50%,0)}.van-step--horizontal.van-step--process{color:var(--step-process-text-color,#323233)}.van-step--horizontal.van-step--process .van-step__icon{display:block;font-size:var(--step-icon-size,12px);line-height:1}.van-step--vertical{line-height:18px;padding:10px 10px 10px 0}.van-step--vertical:after{border-bottom-width:1px}.van-step--vertical:last-child:after{border-bottom-width:none}.van-step--vertical:first-child:before{background-color:#fff;content:"";height:20px;left:-15px;position:absolute;top:0;width:1px;z-index:1}.van-step--vertical .van-step__circle,.van-step--vertical .van-step__icon,.van-step--vertical .van-step__line{left:-14px;position:absolute;top:19px;transform:translate3d(-50%,-50%,0);z-index:2}.van-step--vertical .van-step__icon{font-size:var(--step-icon-size,12px);line-height:1}.van-step--vertical .van-step__line{background-color:var(--step-line-color,#ebedf0);height:100%;transform:translate3d(-50%,0,0);width:1px;z-index:1}
\ No newline at end of file
@import '../common/index.wxss';.van-steps{background-color:var(--steps-background-color,#fff);overflow:hidden}.van-steps--horizontal{padding:10px}.van-steps--horizontal .van-step__wrapper{display:flex;overflow:hidden;position:relative}.van-steps--vertical{padding-left:10px}.van-steps--vertical .van-step__wrapper{padding:0 0 0 20px}.van-step{color:var(--step-text-color,#969799);flex:1;font-size:var(--step-font-size,14px);position:relative}.van-step--finish{color:var(--step-finish-text-color,#323233)}.van-step__circle{background-color:var(--step-circle-color,#969799);border-radius:50%;height:var(--step-circle-size,5px);width:var(--step-circle-size,5px)}.van-step--horizontal{padding-bottom:14px}.van-step--horizontal:first-child .van-step__title{transform:none}.van-step--horizontal:first-child .van-step__circle-container{padding:0 8px 0 0;transform:translate3d(0,50%,0)}.van-step--horizontal:last-child{bottom:0;position:absolute;right:0;top:0;width:auto}.van-step--horizontal:last-child .van-step__title{text-align:right;transform:none}.van-step--horizontal:last-child .van-step__circle-container{padding:0 0 0 8px;right:0;transform:translate3d(0,50%,0)}.van-step--horizontal .van-step__circle-container{background-color:#fff;bottom:6px;padding:0 var(--padding-xs,8px);position:absolute;transform:translate3d(-50%,50%,0);z-index:1}.van-step--horizontal .van-step__title{display:inline-block;font-size:var(--step-horizontal-title-font-size,12px);transform:translate3d(-50%,0,0)}.van-step--horizontal .van-step__line{background-color:var(--step-line-color,#ebedf0);bottom:6px;height:1px;left:0;position:absolute;right:0;transform:translate3d(0,50%,0)}.van-step--horizontal.van-step--process{color:var(--step-process-text-color,#323233)}.van-step--horizontal.van-step--process .van-step__icon{display:block;font-size:var(--step-icon-size,12px);line-height:1}.van-step--vertical{line-height:18px;padding:10px 10px 10px 0}.van-step--vertical:after{border-bottom-width:1px}.van-step--vertical:last-child:after{border-bottom-width:none}.van-step--vertical:first-child:before{background-color:#fff;content:"";height:20px;left:-15px;position:absolute;top:0;width:1px;z-index:1}.van-step--vertical .van-step__circle,.van-step--vertical .van-step__icon,.van-step--vertical .van-step__line{left:-14px;position:absolute;top:19px;transform:translate3d(-50%,-50%,0);z-index:2}.van-step--vertical .van-step__icon{background-color:var(--steps-background-color,#fff);font-size:var(--step-icon-size,12px);line-height:1}.van-step--vertical .van-step__line{background-color:var(--step-line-color,#ebedf0);height:100%;transform:translate3d(-50%,0,0);width:1px;z-index:1}
\ No newline at end of file
......
......@@ -57,10 +57,8 @@ VantComponent({
}
this.scrollTop = scrollTop || this.scrollTop;
if (typeof container === 'function') {
Promise.all([
getRect(this, ROOT_ELEMENT),
this.getContainerRect(),
]).then(([root, container]) => {
Promise.all([getRect(this, ROOT_ELEMENT), this.getContainerRect()])
.then(([root, container]) => {
if (offsetTop + root.height > container.height + container.top) {
this.setDataAfterDiff({
fixed: false,
......@@ -77,11 +75,12 @@ VantComponent({
else {
this.setDataAfterDiff({ fixed: false, transform: 0 });
}
});
})
.catch(() => { });
return;
}
getRect(this, ROOT_ELEMENT).then((root) => {
if (!isDef(root)) {
if (!isDef(root) || (!root.width && !root.height)) {
return;
}
if (offsetTop >= root.top) {
......@@ -112,6 +111,9 @@ VantComponent({
},
getContainerRect() {
const nodesRef = this.data.container();
if (!nodesRef) {
return Promise.reject(new Error('not found container'));
}
return new Promise((resolve) => nodesRef.boundingClientRect(resolve).exec());
},
},
......
......@@ -6,6 +6,14 @@ VantComponent({
name: null,
icon: String,
dot: Boolean,
url: {
type: String,
value: '',
},
linkType: {
type: String,
value: 'redirectTo',
},
iconPrefix: {
type: String,
value: 'van-icon',
......@@ -27,6 +35,10 @@ VantComponent({
parent.$emit('change', active);
}
}
const { url, linkType } = this.data;
if (url && wx[linkType]) {
return wx[linkType]({ url });
}
this.$emit('click');
},
updateFromParent() {
......
......@@ -5,7 +5,13 @@ import { isDef } from '../common/validator';
import { useChildren } from '../common/relation';
VantComponent({
mixins: [touch],
classes: ['nav-class', 'tab-class', 'tab-active-class', 'line-class'],
classes: [
'nav-class',
'tab-class',
'tab-active-class',
'line-class',
'wrap-class',
],
relation: useChildren('tab', function () {
this.updateTabs();
}),
......@@ -73,6 +79,10 @@ VantComponent({
type: Boolean,
value: true,
},
useBeforeChange: {
type: Boolean,
value: false,
},
},
data: {
tabs: [],
......@@ -83,6 +93,7 @@ VantComponent({
skipTransition: true,
scrollWithAnimation: false,
lineOffsetLeft: 0,
inited: false,
},
mounted() {
requestAnimationFrame(() => {
......@@ -105,28 +116,25 @@ VantComponent({
},
trigger(eventName, child) {
const { currentIndex } = this.data;
const currentChild = child || this.children[currentIndex];
if (!isDef(currentChild)) {
const data = this.getChildData(currentIndex, child);
if (!isDef(data)) {
return;
}
this.$emit(eventName, {
index: currentChild.index,
name: currentChild.getComputedName(),
title: currentChild.data.title,
});
this.$emit(eventName, data);
},
onTap(event) {
const { index } = event.currentTarget.dataset;
const child = this.children[index];
if (child.data.disabled) {
this.trigger('disabled', child);
return;
}
else {
this.onBeforeChange(index).then(() => {
this.setCurrentIndex(index);
nextTick(() => {
this.trigger('click');
});
}
});
},
// correct the index of active tab
setCurrentIndexByName(name) {
......@@ -152,6 +160,9 @@ VantComponent({
});
});
if (currentIndex === data.currentIndex) {
if (!data.inited) {
this.resize();
}
return;
}
const shouldEmitChange = data.currentIndex !== null;
......@@ -191,12 +202,13 @@ VantComponent({
.reduce((prev, curr) => prev + curr.width, 0);
lineOffsetLeft +=
(rect.width - lineRect.width) / 2 + (ellipsis ? 0 : 8);
this.setData({ lineOffsetLeft });
this.setData({ lineOffsetLeft, inited: true });
this.swiping = true;
if (skipTransition) {
nextTick(() => {
// waiting transition end
setTimeout(() => {
this.setData({ skipTransition: false });
});
}, this.data.duration);
}
});
},
......@@ -247,7 +259,7 @@ VantComponent({
if (direction === 'horizontal' && offsetX >= minSwipeDistance) {
const index = this.getAvaiableTab(deltaX);
if (index !== -1) {
this.setCurrentIndex(index);
this.onBeforeChange(index).then(() => this.setCurrentIndex(index));
}
}
this.swiping = false;
......@@ -266,5 +278,25 @@ VantComponent({
}
return -1;
},
onBeforeChange(index) {
const { useBeforeChange } = this.data;
if (!useBeforeChange) {
return Promise.resolve();
}
return new Promise((resolve, reject) => {
this.$emit('before-change', Object.assign(Object.assign({}, this.getChildData(index)), { callback: (status) => (status ? resolve() : reject()) }));
});
},
getChildData(index, child) {
const currentChild = child || this.children[index];
if (!isDef(currentChild)) {
return;
}
return {
index: currentChild.index,
name: currentChild.getComputedName(),
title: currentChild.data.title,
};
},
},
});
......
<wxs src="../wxs/utils.wxs" module="utils" />
<wxs src="./index.wxs" module="computed" />
<view class="custom-class {{ utils.bem('tabs', [type]) }}">
<view class="custom-class {{ utils.bem('tabs') }}">
<van-sticky
disabled="{{ !sticky }}"
z-index="{{ zIndex }}"
......@@ -9,7 +9,7 @@
container="{{ container }}"
bind:scroll="onTouchScroll"
>
<view class="{{ utils.bem('tabs__wrap', { scrollable }) }} {{ type === 'line' && border ? 'van-hairline--top-bottom' : '' }}">
<view class="{{ utils.bem('tabs--') + type }} {{ utils.bem('tabs__wrap', { scrollable }) }} {{ type === 'line' && border ? 'van-hairline--top-bottom' : '' }} wrap-class">
<slot name="nav-left" />
<scroll-view
......@@ -20,7 +20,7 @@
style="{{ color ? 'border-color: ' + color : '' }}"
>
<view class="{{ utils.bem('tabs__nav', [type, { complete: !ellipsis }]) }} nav-class" style="{{ computed.navStyle(color, type) }}">
<view wx:if="{{ type === 'line' }}" class="van-tabs__line" style="{{ computed.lineStyle({ color, lineOffsetLeft, lineHeight, skipTransition, duration, lineWidth }) }}" />
<view wx:if="{{ type === 'line' }}" class="van-tabs__line" style="{{ computed.lineStyle({ color, lineOffsetLeft, lineHeight, skipTransition, duration, lineWidth, inited }) }}" />
<view
wx:for="{{ tabs }}"
wx:key="index"
......
......@@ -60,6 +60,7 @@ function trackStyle(data) {
function lineStyle(data) {
return style({
width: utils.addUnit(data.lineWidth),
opacity: data.inited ? 1 : 0,
transform: 'translateX(' + data.lineOffsetLeft + 'px)',
'-webkit-transform': 'translateX(' + data.lineOffsetLeft + 'px)',
'background-color': data.color,
......
@import '../common/index.wxss';.van-tabs{-webkit-tap-highlight-color:transparent;position:relative}.van-tabs__wrap{display:flex;overflow:hidden}.van-tabs__wrap--scrollable .van-tab{flex:0 0 22%}.van-tabs__wrap--scrollable .van-tab--complete{flex:1 0 auto!important;padding:0 12px}.van-tabs__wrap--scrollable .van-tabs__nav--complete{padding-left:8px;padding-right:8px}.van-tabs__scroll{background-color:var(--tabs-nav-background-color,#fff)}.van-tabs__scroll--line{box-sizing:initial;height:calc(100% + 15px)}.van-tabs__scroll--card{border:1px solid var(--tabs-default-color,#ee0a24);border-radius:2px;box-sizing:border-box;margin:0 var(--padding-md,16px);width:calc(100% - var(--padding-md, 16px)*2)}.van-tabs__scroll::-webkit-scrollbar{display:none}.van-tabs__nav{display:flex;position:relative;-webkit-user-select:none;user-select:none}.van-tabs__nav--card{box-sizing:border-box;height:var(--tabs-card-height,30px)}.van-tabs__nav--card .van-tab{border-right:1px solid var(--tabs-default-color,#ee0a24);color:var(--tabs-default-color,#ee0a24);line-height:calc(var(--tabs-card-height, 30px) - 2px)}.van-tabs__nav--card .van-tab:last-child{border-right:none}.van-tabs__nav--card .van-tab.van-tab--active{background-color:var(--tabs-default-color,#ee0a24);color:#fff}.van-tabs__nav--card .van-tab--disabled{color:var(--tab-disabled-text-color,#c8c9cc)}.van-tabs__line{background-color:var(--tabs-bottom-bar-color,#ee0a24);border-radius:var(--tabs-bottom-bar-height,3px);bottom:0;height:var(--tabs-bottom-bar-height,3px);left:0;position:absolute;z-index:1}.van-tabs__track{height:100%;position:relative;width:100%}.van-tabs__track--animated{display:flex;transition-property:left}.van-tabs__content{overflow:hidden}.van-tabs--line .van-tabs__wrap{height:var(--tabs-line-height,44px)}.van-tabs--card .van-tabs__wrap{height:var(--tabs-card-height,30px)}.van-tab{box-sizing:border-box;color:var(--tab-text-color,#646566);cursor:pointer;flex:1;font-size:var(--tab-font-size,14px);line-height:var(--tabs-line-height,44px);min-width:0;padding:0 5px;position:relative;text-align:center}.van-tab--active{color:var(--tab-active-text-color,#323233);font-weight:var(--font-weight-bold,500)}.van-tab--disabled{color:var(--tab-disabled-text-color,#c8c9cc)}.van-tab__title__info{display:inline-block;position:relative!important;top:-1px!important;transform:translateX(0)!important}
\ No newline at end of file
@import '../common/index.wxss';.van-tabs{-webkit-tap-highlight-color:transparent;position:relative}.van-tabs__wrap{display:flex;overflow:hidden}.van-tabs__wrap--scrollable .van-tab{flex:0 0 22%}.van-tabs__wrap--scrollable .van-tab--complete{flex:1 0 auto!important;padding:0 12px}.van-tabs__wrap--scrollable .van-tabs__nav--complete{padding-left:8px;padding-right:8px}.van-tabs__scroll{background-color:var(--tabs-nav-background-color,#fff);overflow:auto}.van-tabs__scroll--line{box-sizing:initial;height:calc(100% + 15px)}.van-tabs__scroll--card{border:1px solid var(--tabs-default-color,#ee0a24);border-radius:2px;box-sizing:border-box;margin:0 var(--padding-md,16px);width:calc(100% - var(--padding-md, 16px)*2)}.van-tabs__scroll::-webkit-scrollbar{display:none}.van-tabs__nav{display:flex;position:relative;-webkit-user-select:none;user-select:none}.van-tabs__nav--card{box-sizing:border-box;height:var(--tabs-card-height,30px)}.van-tabs__nav--card .van-tab{border-right:1px solid var(--tabs-default-color,#ee0a24);color:var(--tabs-default-color,#ee0a24);line-height:calc(var(--tabs-card-height, 30px) - 2px)}.van-tabs__nav--card .van-tab:last-child{border-right:none}.van-tabs__nav--card .van-tab.van-tab--active{background-color:var(--tabs-default-color,#ee0a24);color:#fff}.van-tabs__nav--card .van-tab--disabled{color:var(--tab-disabled-text-color,#c8c9cc)}.van-tabs__line{background-color:var(--tabs-bottom-bar-color,#ee0a24);border-radius:var(--tabs-bottom-bar-height,3px);bottom:0;height:var(--tabs-bottom-bar-height,3px);left:0;opacity:0;position:absolute;z-index:1}.van-tabs__track{height:100%;position:relative;width:100%}.van-tabs__track--animated{display:flex;transition-property:left}.van-tabs__content{overflow:hidden}.van-tabs--line{height:var(--tabs-line-height,44px)}.van-tabs--card{height:var(--tabs-card-height,30px)}.van-tab{box-sizing:border-box;color:var(--tab-text-color,#646566);cursor:pointer;flex:1;font-size:var(--tab-font-size,14px);line-height:var(--tabs-line-height,44px);min-width:0;padding:0 5px;position:relative;text-align:center}.van-tab--active{color:var(--tab-active-text-color,#323233);font-weight:var(--font-weight-bold,500)}.van-tab--disabled{color:var(--tab-disabled-text-color,#c8c9cc)}.van-tab__title__info{position:relative!important;top:-1px!important;transform:translateX(0)!important}
\ No newline at end of file
......
/// <reference types="miniprogram-api-typings" />
declare type ToastMessage = string | number;
/// <reference types="miniprogram-api-typings" />
type ToastMessage = string | number;
type ToastContext = WechatMiniprogram.Component.TrivialInstance | WechatMiniprogram.Page.TrivialInstance;
interface ToastOptions {
show?: boolean;
type?: string;
mask?: boolean;
zIndex?: number;
context?: WechatMiniprogram.Component.TrivialInstance | WechatMiniprogram.Page.TrivialInstance;
context?: (() => ToastContext) | ToastContext;
position?: string;
duration?: number;
selector?: string;
......
......@@ -22,7 +22,9 @@ function getContext() {
}
function Toast(toastOptions) {
const options = Object.assign(Object.assign({}, currentOptions), parseOptions(toastOptions));
const context = options.context || getContext();
const context = (typeof options.context === 'function'
? options.context()
: options.context) || getContext();
const toast = context.selectComponent(options.selector);
if (!toast) {
console.warn('未找到 van-toast 节点，请确认 selector 及 context 是否正确');
......
import { VantComponent } from '../common/component';
import { isImageFile, chooseFile, isVideoFile } from './utils';
import { chooseImageProps, chooseVideoProps } from './shared';
import { isBoolean, isPromise } from '../common/validator';
import { imageProps, mediaProps, messageFileProps, videoProps } from './shared';
import { chooseFile, isImageFile, isVideoFile } from './utils';
VantComponent({
props: Object.assign(Object.assign({ disabled: Boolean, multiple: Boolean, uploadText: String, useBeforeRead: Boolean, afterRead: null, beforeRead: null, previewSize: {
props: Object.assign(Object.assign(Object.assign(Object.assign({ disabled: Boolean, multiple: Boolean, uploadText: String, useBeforeRead: Boolean, afterRead: null, beforeRead: null, previewSize: {
type: null,
value: 80,
}, name: {
......@@ -34,13 +34,16 @@ VantComponent({
}, previewFullImage: {
type: Boolean,
value: true,
}, videoFit: {
type: String,
value: 'contain',
}, imageFit: {
type: String,
value: 'scaleToFill',
}, uploadIcon: {
type: String,
value: 'photograph',
} }, chooseImageProps), chooseVideoProps),
} }, imageProps), videoProps), mediaProps), messageFileProps),
data: {
lists: [],
isInCount: true,
......@@ -114,11 +117,12 @@ VantComponent({
if (!this.data.previewFullImage)
return;
const { index } = event.currentTarget.dataset;
const { lists } = this.data;
const { lists, showmenu } = this.data;
const item = lists[index];
wx.previewImage({
urls: lists.filter((item) => isImageFile(item)).map((item) => item.url),
current: item.url,
showmenu,
fail() {
wx.showToast({ title: '预览图片失败', icon: 'none' });
},
......@@ -129,17 +133,28 @@ VantComponent({
return;
const { index } = event.currentTarget.dataset;
const { lists } = this.data;
const sources = [];
const current = lists.reduce((sum, cur, curIndex) => {
if (!isVideoFile(cur)) {
return sum;
}
sources.push(Object.assign(Object.assign({}, cur), { type: 'video' }));
if (curIndex < index) {
sum++;
}
return sum;
}, 0);
wx.previewMedia({
sources: lists
.filter((item) => isVideoFile(item))
.map((item) => (Object.assign(Object.assign({}, item), { type: 'video' }))),
current: index,
sources,
current,
fail() {
wx.showToast({ title: '预览视频失败', icon: 'none' });
},
});
},
onPreviewFile(event) {
if (!this.data.previewFile)
return;
const { index } = event.currentTarget.dataset;
wx.openDocument({
filePath: this.data.lists[index].url,
......
......@@ -28,6 +28,8 @@
title="{{ item.name || ('视频' + index) }}"
poster="{{ item.thumb }}"
autoplay="{{ item.autoplay }}"
object-fit="{{videoFit}}"
referrer-policy="{{ referrerPolicy }}"
class="van-uploader__preview-image"
style="{{ computed.sizeStyle({ previewSize }) }}"
data-index="{{ index }}"
......
export declare const chooseImageProps: {
export declare const imageProps: {
sizeType: {
type: ArrayConstructor;
value: string[];
......@@ -7,8 +7,12 @@ export declare const chooseImageProps: {
type: ArrayConstructor;
value: string[];
};
showmenu: {
type: BooleanConstructor;
value: boolean;
};
};
export declare const chooseVideoProps: {
export declare const videoProps: {
capture: {
type: ArrayConstructor;
value: string[];
......@@ -25,4 +29,33 @@ export declare const chooseVideoProps: {
type: StringConstructor;
value: string;
};
referrerPolicy: {
type: StringConstructor;
value: string;
};
};
export declare const mediaProps: {
capture: {
type: ArrayConstructor;
value: string[];
};
mediaType: {
type: ArrayConstructor;
value: string[];
};
maxDuration: {
type: NumberConstructor;
value: number;
};
camera: {
type: StringConstructor;
value: string;
};
};
export declare const messageFileProps: {
extension: null;
previewFile: {
type: BooleanConstructor;
value: boolean;
};
};
......
// props for choose image
export const chooseImageProps = {
// props for image
export const imageProps = {
sizeType: {
type: Array,
value: ['original', 'compressed'],
......@@ -8,9 +8,13 @@ export const chooseImageProps = {
type: Array,
value: ['album', 'camera'],
},
showmenu: {
type: Boolean,
value: true,
},
};
// props for choose video
export const chooseVideoProps = {
// props for video
export const videoProps = {
capture: {
type: Array,
value: ['album', 'camera'],
......@@ -27,4 +31,35 @@ export const chooseVideoProps = {
type: String,
value: 'back',
},
referrerPolicy: {
type: String,
value: 'no-referrer',
},
};
// props for media
export const mediaProps = {
capture: {
type: Array,
value: ['album', 'camera'],
},
mediaType: {
type: Array,
value: ['image', 'video', 'mix'],
},
maxDuration: {
type: Number,
value: 60,
},
camera: {
type: String,
value: 'back',
},
};
// props for file
export const messageFileProps = {
extension: null,
previewFile: {
type: Boolean,
value: true,
},
};
......
......@@ -10,7 +10,7 @@ export interface File {
}
export declare function isImageFile(item: File): boolean;
export declare function isVideoFile(item: File): boolean;
export declare function chooseFile({ accept, multiple, capture, compressed, maxDuration, sizeType, camera, maxCount, }: {
export declare function chooseFile({ accept, multiple, capture, compressed, maxDuration, sizeType, camera, maxCount, mediaType, extension, }: {
accept: any;
multiple: any;
capture: any;
......@@ -19,4 +19,6 @@ export declare function chooseFile({ accept, multiple, capture, compressed, maxD
sizeType: any;
camera: any;
maxCount: any;
mediaType: any;
extension: any;
}): Promise<File | File[]>;
......
import { pickExclude } from '../common/utils';
import { pickExclude, isPC, isWxWork } from '../common/utils';
import { isImageUrl, isVideoUrl } from '../common/validator';
export function isImageFile(item) {
if (item.isImage != null) {
......@@ -25,7 +25,7 @@ export function isVideoFile(item) {
return false;
}
function formatImage(res) {
return res.tempFiles.map((item) => (Object.assign(Object.assign({}, pickExclude(item, ['path'])), { type: 'image', url: item.path, thumb: item.path })));
return res.tempFiles.map((item) => (Object.assign(Object.assign({}, pickExclude(item, ['path'])), { type: 'image', url: item.tempFilePath || item.path, thumb: item.tempFilePath || item.path })));
}
function formatVideo(res) {
return [
......@@ -33,15 +33,16 @@ function formatVideo(res) {
];
}
function formatMedia(res) {
return res.tempFiles.map((item) => (Object.assign(Object.assign({}, pickExclude(item, ['fileType', 'thumbTempFilePath', 'tempFilePath'])), { type: res.type, url: item.tempFilePath, thumb: res.type === 'video' ? item.thumbTempFilePath : item.tempFilePath })));
return res.tempFiles.map((item) => (Object.assign(Object.assign({}, pickExclude(item, ['fileType', 'thumbTempFilePath', 'tempFilePath'])), { type: item.fileType, url: item.tempFilePath, thumb: item.fileType === 'video' ? item.thumbTempFilePath : item.tempFilePath })));
}
function formatFile(res) {
return res.tempFiles.map((item) => (Object.assign(Object.assign({}, pickExclude(item, ['path'])), { url: item.path })));
}
export function chooseFile({ accept, multiple, capture, compressed, maxDuration, sizeType, camera, maxCount, }) {
export function chooseFile({ accept, multiple, capture, compressed, maxDuration, sizeType, camera, maxCount, mediaType, extension, }) {
return new Promise((resolve, reject) => {
switch (accept) {
case 'image':
if (isPC || isWxWork) {
wx.chooseImage({
count: multiple ? Math.min(maxCount, 9) : 1,
sourceType: capture,
......@@ -49,10 +50,24 @@ export function chooseFile({ accept, multiple, capture, compressed, maxDuration,
success: (res) => resolve(formatImage(res)),
fail: reject,
});
}
else {
wx.chooseMedia({
count: multiple ? Math.min(maxCount, 9) : 1,
mediaType: ['image'],
sourceType: capture,
maxDuration,
sizeType,
camera,
success: (res) => resolve(formatImage(res)),
fail: reject,
});
}
break;
case 'media':
wx.chooseMedia({
count: multiple ? Math.min(maxCount, 9) : 1,
mediaType,
sourceType: capture,
maxDuration,
sizeType,
......@@ -72,12 +87,7 @@ export function chooseFile({ accept, multiple, capture, compressed, maxDuration,
});
break;
default:
wx.chooseMessageFile({
count: multiple ? maxCount : 1,
type: accept,
success: (res) => resolve(formatFile(res)),
fail: reject,
});
wx.chooseMessageFile(Object.assign(Object.assign({ count: multiple ? maxCount : 1, type: accept }, (extension ? { extension } : {})), { success: (res) => resolve(formatFile(res)), fail: reject }));
break;
}
});
......