diff --git a/dist/badge/index.wxml b/dist/badge/index.wxml index 193791e7..322f1ba7 100644 --- a/dist/badge/index.wxml +++ b/dist/badge/index.wxml @@ -1,8 +1,8 @@ - - + diff --git a/dist/btn/index.js b/dist/btn/index.js index 85044876..f65506f1 100644 --- a/dist/btn/index.js +++ b/dist/btn/index.js @@ -1,5 +1,8 @@ +const nativeButtonBehavior = require('./native-button-behaviors'); + Component({ externalClasses: ['custom-class'], + behaviors: [nativeButtonBehavior], relations: { '../btn-group/index': { type: 'parent', @@ -31,10 +34,6 @@ Component({ loading: { type: Boolean, value: false, - }, - openType: { - type: String, - value: '' } }, @@ -45,6 +44,10 @@ Component({ methods: { handleTap() { + if (this.data.disabled) { + this.triggerEvent('disabledclick') + return; + } this.triggerEvent('btnclick'); }, diff --git a/dist/btn/index.wxml b/dist/btn/index.wxml index 6bbd1437..a1301c48 100644 --- a/dist/btn/index.wxml +++ b/dist/btn/index.wxml @@ -1,8 +1,21 @@ diff --git a/dist/btn/native-button-behaviors.js b/dist/btn/native-button-behaviors.js new file mode 100644 index 00000000..2d4ca93d --- /dev/null +++ b/dist/btn/native-button-behaviors.js @@ -0,0 +1,49 @@ +module.exports = Behavior({ + properties: { + loading: Boolean, + // 在自定义组件中，无法与外界的 form 组件联动，暂时不开放 + // formType: String, + openType: String, + appParameter: String, + // 暂时不开放，直接传入无法设置样式 + // hoverClass: { + // type: String, + // value: 'button-hover' + // }, + hoverStopPropagation: Boolean, + hoverStartTime: { + type: Number, + value: 20 + }, + hoverStayTime: { + type: Number, + value: 70 + }, + lang: { + type: String, + value: 'en' + }, + sessionFrom: { + type: String, + value: '' + }, + sendMessageTitle: String, + sendMessagePath: String, + sendMessageImg: String, + showMessageCard: String + }, + methods: { + bindgetuserinfo({ detail = {} } = {}) { + this.triggerEvent('getuserinfo', detail); + }, + bindcontact({ detail = {} } = {}) { + this.triggerEvent('contact', detail); + }, + bindgetphonenumber({ detail = {} } = {}) { + this.triggerEvent('getphonenumber', detail); + }, + binderror({ detail = {} } = {}) { + this.triggerEvent('error', detail); + } + } +}); diff --git a/dist/cell-group/index.js b/dist/cell-group/index.js index aa146cde..071d780b 100644 --- a/dist/cell-group/index.js +++ b/dist/cell-group/index.js @@ -2,18 +2,43 @@ Component({ relations: { '../cell/index': { type: 'child', - linked() {} + linked() { + this._updateIsLastCell(); + }, + linkChanged() { + this._updateIsLastCell(); + }, + unlinked() { + this._updateIsLastCell(); + } } }, - ready() { - let cells = this.getRelationNodes('../cell/index'); - if (cells.length > 0) { - let lastIndex = cells.length - 1; + data: { + cellUpdateTimeout: 0 + }, - cells.forEach((cell, index) => { - if (index < lastIndex) cell.notLastCell(); + methods: { + _updateIsLastCell() { + // 用 setTimeout 减少计算次数 + if (this.data.cellUpdateTimeout > 0) { + return; + } + + const cellUpdateTimeout = setTimeout(() => { + this.setData({ cellUpdateTimeout: 0 }); + let cells = this.getRelationNodes('../cell/index'); + + if (cells.length > 0) { + let lastIndex = cells.length - 1; + + cells.forEach((cell, index) => { + cell.updateIsLastCell(index === lastIndex); + }); + } }); + + this.setData({ cellUpdateTimeout }); } } }); diff --git a/dist/cell/index.js b/dist/cell/index.js index e8d13590..cb0e0f84 100644 --- a/dist/cell/index.js +++ b/dist/cell/index.js @@ -72,8 +72,10 @@ Component({ this.navigateTo(); } }, - notLastCell() { - this.setData({ isLastCell: false }); + + // 用于被 cell-group 更新，标志是否是最后一个 cell + updateIsLastCell(isLastCell) { + this.setData({ isLastCell }); } } }); diff --git a/dist/datetime-picker/index.js b/dist/datetime-picker/index.js new file mode 100644 index 00000000..1c1264fd --- /dev/null +++ b/dist/datetime-picker/index.js @@ -0,0 +1,313 @@ +function partStartWithZero(num, strlen) { + let zeros = ''; + while (zeros.length < strlen) { + zeros += '0'; + } + return (zeros + num).slice(-strlen); +} + +function genNumber(begin, end, strlen) { + let nums = []; + while (begin <= end) { + nums.push(partStartWithZero(begin, strlen)); + begin++; + } + return nums; +} + +function moment(date, formatStr = 'YYYY:MM:DD') { + if (!date && date !== 0) date = new Date(); + + date = new Date(date); + if (date.toString() === 'Invalid Date') throw new Error('Invalid Date'); + + let getDateValue = (method, fn) => (fn ? fn(date[`get${method}`]()) : date[`get${method}`]()); + let map = new Map(); + + map.set(/(Y+)/i, () => getDateValue('FullYear', year => (year + '').substr(4 - RegExp.$1.length))); + map.set(/(M+)/, () => getDateValue('Month', month => partStartWithZero(month + 1, RegExp.$1.length))); + map.set(/(D+)/i, () => getDateValue('Date', date => partStartWithZero(date, RegExp.$1.length))); + map.set(/(H+)/i, () => getDateValue('Hours', hour => partStartWithZero(hour, RegExp.$1.length))); + map.set(/(m+)/, () => getDateValue('Minutes', minute => partStartWithZero(minute, RegExp.$1.length))); + map.set(/(s+)/, () => getDateValue('Seconds', second => partStartWithZero(second, RegExp.$1.length))); + + for (const [reg, fn] of map) { + if (reg.test(formatStr)) { + formatStr = formatStr.replace(RegExp.$1, fn.call(null)); + } + } + + return formatStr; +} + +const LIMIT_YEAR_COUNT = 50; +class DatePicker { + constructor(format, date = new Date(), cb) { + this.types = ['year', 'month', 'day', 'hour', 'minute', 'second']; + this.months = genNumber(1, 12, 2); + this.hours = genNumber(0, 23, 2); + this.seconds = genNumber(0, 59, 2); + this.minutes = genNumber(0, 59, 2); + // this.format(format); + this.init(date, cb); + } + + getYears(year) { + let mid = Math.floor(LIMIT_YEAR_COUNT / 2); + let min = year - mid; + let max = year + (LIMIT_YEAR_COUNT - mid); + return genNumber(min, max, 4); + } + + lastDay(year, month) { + return month !== 12 ? new Date( + new Date(`${year}/${month + 1}/1`).getTime() - (24 * 60 * 60 * 1000) + ).getDate() : 31; + } + + init(date, cb) { + let d = new Date(date); + let y = d.getFullYear(); + let m = d.getMonth() + 1; + let years = this.getYears(y); + let lastDay = this.lastDay(y, m); + + let days = genNumber(1, lastDay, 2); + + this._years = years; + this._dataList = [years, this.months, days, this.hours, this.minutes, this.seconds]; + this._indexs = [25, m - 1, d.getDate(), d.getHours(), d.getMinutes(), d.getSeconds()]; + cb && cb({ + dataList: this._dataList, + indexs: this._indexs + }); + } + + update(col, index, cb) { + let type = this.types[col]; + switch (type) { + case 'year': + this._updateYear(col, index, cb); + break; + case 'month': + this._updateMonth(col, index, cb); + break; + default: + this._indexs[col] = index; + cb && cb({ + dataList: this._dataList, + indexs: this._indexs, + updateColumn: col, + updateIndex: index + }); + } + } + + _updateYear(col, index, cb) { + let years = this._dataList[col]; + let year = years[index]; + + this._dataList[col] = this.getYears(+year); + + this._indexs[col] = Math.floor(LIMIT_YEAR_COUNT / 2); + cb && cb({ + dataList: this._dataList, + indexs: this._indexs, + updateColumn: col + }); + } + + _updateMonth(col, index, cb) { + let month = this._dataList[col][index]; + let year = this._dataList[0][this._indexs[0]]; + let lastDay = this.lastDay(+year, +month); + this._indexs[col] = index; + this._dataList[2] = genNumber(1, lastDay, 2); + this._indexs[2] = this._indexs[2] >= this._dataList[2].length ? this._dataList[2].length - 1 : this._indexs[2]; + cb && cb({ + dataList: this._dataList, + indexs: this._indexs, + updateColumn: 2, + updateIndex: this._indexs[2] + }); + cb && cb({ + dataList: this._dataList, + indexs: this._indexs, + updateColumn: 1, + updateIndex: index + }); + } +} +// 组件内使用 this.indexs 好像有问题 +let _indexs = []; +Component({ + properties: { + placeholder: { + type: String, + value: '请选择时间' + }, + format: { + type: String, + value: 'YYYY-MM-DD HH:mm:ss' + }, + native: { + type: Boolean + }, + pickerView: { + type: Boolean + }, + date: { + type: String, + value: new Date() + }, + notUse: { + type: Array + } + }, + externalClasses: ['placeholder-class'], + data: { + transPos: [0, 0, 0, 0, 0, 0] + }, + attached() { + this.use = {} + ;['years', 'months', 'days', 'hours', 'minutes', 'seconds'].forEach((item) => { + if ((this.data.notUse || []).indexOf(item) === -1) { this.use[item] = true } + }); + this.setData({ use: this.use }); + this.data.pickerView && !this.data.native && this.showPicker(); + }, + ready() { + // 微信 bug，如果不先定义会导致不能选中 + this.setData({ + "dataList":[ + [ + "2018","2019","2020","2021","2022","2023","2024","2025","2026","2027","2028","2029","2030","2031","2032","2033","2034","2035","2036","2037","2038","2039","2040","2041","2042","2043" + ], + genNumber(1, 12, 2), + genNumber(0, 31, 2), + genNumber(0, 23, 2), + genNumber(0, 59, 2), + genNumber(0, 59, 2) + ] + }) + this.picker = new DatePicker(this.data.format, this.data.date, this.updatePicker.bind(this)); + }, + methods: { + updatePicker({ dataList, indexs, updateColumn, updateIndex }) { + let updateData = {}; + _indexs = indexs; + // 指定更新某列数据，表示某列数据更新 + if (updateColumn) { + updateData[`transPos[${updateColumn}]`] = -36 * _indexs[updateColumn]; + updateData[`dataList[${updateColumn}]`] = dataList[updateColumn]; + } + // 指定更新某列索引，表示某列数据选中的索引已更新 + if (typeof updateIndex !== 'undefined') { + updateData[`transPos[${updateColumn}]`] = -36 * _indexs[updateColumn]; + updateData[`selected[${updateColumn}]`] = indexs[updateColumn]; + } + + // 只在初始化时设置全部的值，其他的都局部更新 + if (!updateColumn && typeof updateIndex === 'undefined') { + updateData = { dataList, selected: indexs }; + _indexs.forEach((item, index) => { + updateData[`transPos[${index}]`] = -item * 36; + }); + } + + this.setData(updateData); + }, + touchmove(e) { + let { changedTouches, target } = e; + let col = target.dataset.col; + let { clientY } = changedTouches[0]; + if (!col) return; + + let updateData = {}; + let itemLength = this.data.dataList[col].length; + updateData[`transPos[${col}]`] = this.startTransPos + (clientY - this.startY); + if (updateData[`transPos[${col}]`] >= 0) { + updateData[`transPos[${col}]`] = 0; + } else if (-(itemLength - 1) * 36 >= updateData[`transPos[${col}]`]) { + updateData[`transPos[${col}]`] = -(itemLength - 1) * 36; + } + this.setData(updateData); + }, + touchStart(e) { + let { target, changedTouches } = e; + let col = target.dataset.col; + let touchData = changedTouches[0]; + if (!col) return; + + this.startY = touchData.clientY; + this.startTime = e.timeStamp; + this.startTransPos = this.data.transPos[col]; + }, + touchEnd(e) { + let { col } = e.target.dataset; + if (!col) return; + let pos = this.data.transPos[col]; + let itemIndex = Math.round(pos / 36); + + this.columnchange({ detail: { column: +col, value: -itemIndex } }); + }, + columnchange(e) { + let { column, value } = e.detail; + _indexs[column] = value; + this.picker.update(column, value, this.updatePicker.bind(this)); + this.data.pickerView && !this.data.native && this.change({detail: {value: _indexs}}) + }, + getFormatStr() { + let date = new Date() + ;['FullYear', 'Month', 'Date', 'Hours', 'Minutes', 'Seconds'].forEach((key, index) => { + let value = this.data.dataList[index][_indexs[index]]; + if (key === 'Month') { + value = +this.data.dataList[index][_indexs[index]] - 1; + } + date[`set${key}`](+value); + }); + + return moment(date, this.data.format); + }, + showPicker() { + this.setData({ show: true }); + }, + hidePicker(e) { + let { action } = e.currentTarget.dataset; + this.setData({ show: false }); + if (action === 'cancel') { + this.cancel({ detail: {} }); + } else { + this.change({ detail: { value: _indexs } }); + } + }, + change(e) { + let { value } = e.detail; + + let data = this.data.dataList.map((item, index) => { + return +item[value[index]]; + }); + + this.triggerEvent('change', { value: data }); + + // 为了支持原生 picker view，每次 change 都需要手动 columnchange + if (this.data.pickerView && this.data.native) { + for (let index = 0; index < value.length; index++) { + if (_indexs[index] !== value[index]) { + this.columnchange({ + detail: { + column: index, value: value[index] + } + }) + break // 这里每次只处理一列，否则会出现日期值为 undefined 的情况 + } + } + } + + this.setData({ text: this.getFormatStr() }); + }, + cancel(e) { + this.triggerEvent('cancel', e.detail); + } + } +}); diff --git a/dist/datetime-picker/index.json b/dist/datetime-picker/index.json new file mode 100644 index 00000000..32640e0d --- /dev/null +++ b/dist/datetime-picker/index.json @@ -0,0 +1,3 @@ +{ + "component": true +} \ No newline at end of file diff --git a/dist/datetime-picker/index.wxml b/dist/datetime-picker/index.wxml new file mode 100644 index 00000000..35a04a94 --- /dev/null +++ b/dist/datetime-picker/index.wxml @@ -0,0 +1,111 @@ + + + + {{item}} + + + + {{item}} + + + + {{item}} + + + + {{item}} + + + + {{item}} + + + + {{item}} + + + + + + + {{text || placeholder}} + + + + + + {{text || placeholder}} + + + 取消 + 确认 + + + + + + {{item}} + + + 年 + + + + {{item}} + + + 月 + + + + {{item}} + + + 日 + + + + {{item}} + + + 时 + + + + {{item}} + + + 分 + + + + {{item}} + + + 秒 + + + \ No newline at end of file diff --git a/dist/datetime-picker/index.wxss b/dist/datetime-picker/index.wxss new file mode 100644 index 00000000..ecf5f216 --- /dev/null +++ b/dist/datetime-picker/index.wxss @@ -0,0 +1,110 @@ +.picker-view-column { + font-size: 14px; +} +.placeholder-class { + width: 100%; +} + +.picker { + position: fixed; + bottom: -100px; + width: 100vw; + left: 0; + background: #fff; + z-index: 999; + display: flex; + flex-direction: column; + height: 0; + transition: height ease-in 0.3s; +} +.picker-view .picker { + position: relative; + bottom: auto; + left: auto; + width: 100%; + z-index: auto; +} +.picker-visible { + height: 236px; + bottom: 0; +} +.picker-view .picker-visible { + height: 200px; +} +.picker-mask { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 100vh; + background: rgba(0, 0, 0, 0.5); + z-index: -1; +} +.picker-mask.show { + bottom: 0; + z-index: 998; +} +.picker .picker-action { + height: 36px; + border-bottom: 1rpx solid #e5e5e5; + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 15px; +} +.picker-action view:last-child { + color: #1aad16; +} +.picker .picker-cols { + display: flex; + flex: 1; + margin: 10px 5px; + box-sizing: border-box; + position: relative; + overflow: hidden; + height: 180px; + font-size: 16px; +} +.picker-cols .fixed-col { + color: #999; + margin-left: 5px; + height:100%; + line-height:180px; +} +.picker-cols .col { + transform-origin: center; + font-size: 14px; +} +.picker-cols .col .select-item { + color: #333; + font-size: 16px; +} +.picker-cols .col { + flex: 1; + text-align: right; + color: #aaa; + height: 180px; + position: relative; + padding-top: 79px; +} +.picker-cols .col > view { + transition: transform 0.0003s; +} +.picker-cols .col .cell { + height: 36px; +} +.picker-cols::after, .picker-cols::before { + content: ''; + position: absolute; + height: 72px; + width: calc(100% - 10px); + pointer-events: none; +} +.picker-cols::before { + top: 0; + border-bottom: 1rpx solid #e5e5e5; +} +.picker-cols::after { + bottom: 0; + border-top: 1rpx solid #e5e5e5; +} diff --git a/dist/field/index.js b/dist/field/index.js index b66510ab..da909fe5 100644 --- a/dist/field/index.js +++ b/dist/field/index.js @@ -1,13 +1,12 @@ Component({ + behaviors: ['wx://form-field'], + properties: { title: String, - name: String, type: { type: String, value: 'input' }, - name: String, - value: String, disabled: Boolean, inputType: { type: String, @@ -28,20 +27,19 @@ Component({ }, methods: { - handleZanFieldChange(event) { - + handleFieldChange(event) { + const { detail = {} } = event; + const { value = '' } = detail; + this.setData({ value }); + this.triggerEvent('change', event); }, - handleZanFieldFocus(event) { - - + handleFieldFocus(event) { this.triggerEvent('focus', event); }, - handleZanFieldBlur(event) { - - + handleFieldBlur(event) { this.triggerEvent('blur', event); } } diff --git a/dist/field/index.wxml b/dist/field/index.wxml index 8354c52c..c82854ab 100644 --- a/dist/field/index.wxml +++ b/dist/field/index.wxml @@ -7,7 +7,6 @@ + bindinput="handleFieldChange" + bindfocus="handleFieldFocus" + bindblur="handleFieldBlur" + > diff --git a/dist/icon/index.wxss b/dist/icon/index.wxss index 3d721bdb..93760130 100644 --- a/dist/icon/index.wxss +++ b/dist/icon/index.wxss @@ -1 +1 @@ -@font-face{font-family:zanui-weapp-icon;src:url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-4381aded05.eot);src:url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-4381aded05.eot?#iefix) format('embedded-opentype'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-4381aded05.woff2) format('woff2'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-4381aded05.woff) format('woff'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-4381aded05.ttf) format('truetype')}.zan-icon{display:inline-block}.zan-icon::before{font-family:zanui-weapp-icon!important;font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;-webkit-font-smoothing:antialiased}.zan-icon-qr-invalid:before{content:'\e800'}.zan-icon-qr:before{content:'\e801'}.zan-icon-exchange:before{content:'\e802'}.zan-icon-close:before{content:'\e803'}.zan-icon-location:before{content:'\e804'}.zan-icon-upgrade:before{content:'\e805'}.zan-icon-check:before{content:'\e806'}.zan-icon-checked:before{content:'\e807'}.zan-icon-like-o:before{content:'\e808'}.zan-icon-like:before{content:'\e809'}.zan-icon-chat:before{content:'\e80a'}.zan-icon-shop:before{content:'\e80b'}.zan-icon-photograph:before{content:'\e80c'}.zan-icon-add:before{content:'\e80d'}.zan-icon-add2:before{content:'\e80e'}.zan-icon-photo:before{content:'\e80f'}.zan-icon-logistics:before{content:'\e810'}.zan-icon-edit:before{content:'\e811'}.zan-icon-passed:before{content:'\e812'}.zan-icon-cart:before{content:'\e813'}.zan-icon-shopping-cart:before{content:'\e814'}.zan-icon-arrow:before{content:'\e815'}.zan-icon-gift:before{content:'\e816'}.zan-icon-search:before{content:'\e817'}.zan-icon-clear:before{content:'\e818'}.zan-icon-success:before{content:'\e819'}.zan-icon-fail:before{content:'\e81a'}.zan-icon-contact:before{content:'\e81b'}.zan-icon-wechat:before{content:'\e81c'}.zan-icon-alipay:before{content:'\e81d'}.zan-icon-password-view:before{content:'\e81e'}.zan-icon-password-not-view:before{content:'\e81f'}.zan-icon-wap-nav:before{content:'\e820'}.zan-icon-wap-home:before{content:'\e821'}.zan-icon-ecard-pay:before{content:'\e822'}.zan-icon-balance-pay:before{content:'\e823'}.zan-icon-peer-pay:before{content:'\e824'}.zan-icon-credit-pay:before{content:'\e825'}.zan-icon-debit-pay:before{content:'\e826'}.zan-icon-other-pay:before{content:'\e827'}.zan-icon-browsing-history:before{content:'\e828'}.zan-icon-goods-collect:before{content:'\e829'}.zan-icon-shop-collect:before{content:'\e82a'}.zan-icon-receive-gift:before{content:'\e82b'}.zan-icon-send-gift:before{content:'\e82c'}.zan-icon-setting:before{content:'\e82d'}.zan-icon-points:before{content:'\e82e'}.zan-icon-coupon:before{content:'\e82f'}.zan-icon-free-postage:before{content:'\e830'}.zan-icon-discount:before{content:'\e831'}.zan-icon-birthday-privilege:before{content:'\e832'}.zan-icon-member-day-privilege:before{content:'\e833'}.zan-icon-balance-details:before{content:'\e834'}.zan-icon-cash-back-record:before{content:'\e835'}.zan-icon-points-mall:before{content:'\e836'}.zan-icon-exchange-record:before{content:'\e837'}.zan-icon-pending-payment:before{content:'\e838'}.zan-icon-pending-orders:before{content:'\e839'}.zan-icon-pending-deliver:before{content:'\e83a'}.zan-icon-pending-evaluate:before{content:'\e83b'}.zan-icon-gift-card-pay:before{content:'\e83c'}.zan-icon-cash-on-deliver:before{content:'\e83d'}.zan-icon-underway:before{content:'\e83e'}.zan-icon-point-gift:before{content:'\e83f'}.zan-icon-after-sale:before{content:'\e840'}.zan-icon-edit-data:before{content:'\e841'}.zan-icon-question:before{content:'\e842'}.zan-icon-delete:before{content:'\e843'}.zan-icon-records:before{content:'\e844'}.zan-icon-description:before{content:'\e845'}.zan-icon-card:before{content:'\e846'}.zan-icon-gift-card:before{content:'\e847'}.zan-icon-clock:before{content:'\e848'}.zan-icon-gold-coin:before{content:'\e849'}.zan-icon-completed:before{content:'\e84a'}.zan-icon-value-card:before{content:'\e84b'}.zan-icon-certificate:before{content:'\e84c'}.zan-icon-tosend:before{content:'\e84d'}.zan-icon-sign:before{content:'\e84e'}.zan-icon-home:before{content:'\e84f'}.zan-icon-phone:before{content:'\e850'}.zan-icon-add-o:before{content:'\e851'}.zan-icon-play:before{content:'\e852'}.zan-icon-pause:before{content:'\e853'}.zan-icon-stop:before{content:'\e854'}.zan-icon-hot:before{content:'\e855'}.zan-icon-new:before{content:'\e856'}.zan-icon-new-arrival:before{content:'\e857'}.zan-icon-hot-sale:before{content:'\e858'} \ No newline at end of file +@font-face{font-family:zanui-weapp-icon;src:url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-eeb0d3c52a.eot);src:url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-eeb0d3c52a.eot?#iefix) format('embedded-opentype'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-eeb0d3c52a.woff2) format('woff2'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-eeb0d3c52a.woff) format('woff'),url(https://b.yzcdn.cn/zanui-weapp/zanui-weapp-icon-eeb0d3c52a.ttf) format('truetype')}.zan-icon{display:inline-block}.zan-icon::before{font-family:zanui-weapp-icon!important;font-style:normal;font-weight:400;speak:none;display:inline-block;text-decoration:inherit;width:1em;text-align:center;font-variant:normal;text-transform:none;line-height:1em;-webkit-font-smoothing:antialiased}.zan-icon-qr-invalid:before{content:'\e800'}.zan-icon-qr:before{content:'\e801'}.zan-icon-exchange:before{content:'\e802'}.zan-icon-close:before{content:'\e803'}.zan-icon-location:before{content:'\e804'}.zan-icon-upgrade:before{content:'\e805'}.zan-icon-check:before{content:'\e806'}.zan-icon-checked:before{content:'\e807'}.zan-icon-like-o:before{content:'\e808'}.zan-icon-like:before{content:'\e809'}.zan-icon-chat:before{content:'\e80a'}.zan-icon-shop:before{content:'\e80b'}.zan-icon-photograph:before{content:'\e80c'}.zan-icon-add:before{content:'\e80d'}.zan-icon-minus:before{content:'\e80e'}.zan-icon-add2:before{content:'\e80f'}.zan-icon-photo:before{content:'\e810'}.zan-icon-logistics:before{content:'\e811'}.zan-icon-edit:before{content:'\e812'}.zan-icon-passed:before{content:'\e813'}.zan-icon-cart:before{content:'\e814'}.zan-icon-shopping-cart:before{content:'\e815'}.zan-icon-arrow:before{content:'\e816'}.zan-icon-gift:before{content:'\e817'}.zan-icon-search:before{content:'\e818'}.zan-icon-clear:before{content:'\e819'}.zan-icon-success:before{content:'\e81a'}.zan-icon-fail:before{content:'\e81b'}.zan-icon-contact:before{content:'\e81c'}.zan-icon-wechat:before{content:'\e81d'}.zan-icon-alipay:before{content:'\e81e'}.zan-icon-password-view:before{content:'\e81f'}.zan-icon-password-not-view:before{content:'\e820'}.zan-icon-wap-nav:before{content:'\e821'}.zan-icon-wap-home:before{content:'\e822'}.zan-icon-ecard-pay:before{content:'\e823'}.zan-icon-balance-pay:before{content:'\e824'}.zan-icon-peer-pay:before{content:'\e825'}.zan-icon-credit-pay:before{content:'\e826'}.zan-icon-debit-pay:before{content:'\e827'}.zan-icon-other-pay:before{content:'\e828'}.zan-icon-browsing-history:before{content:'\e829'}.zan-icon-goods-collect:before{content:'\e82a'}.zan-icon-shop-collect:before{content:'\e82b'}.zan-icon-receive-gift:before{content:'\e82c'}.zan-icon-send-gift:before{content:'\e82d'}.zan-icon-setting:before{content:'\e82e'}.zan-icon-points:before{content:'\e82f'}.zan-icon-coupon:before{content:'\e830'}.zan-icon-free-postage:before{content:'\e831'}.zan-icon-discount:before{content:'\e832'}.zan-icon-birthday-privilege:before{content:'\e833'}.zan-icon-member-day-privilege:before{content:'\e834'}.zan-icon-balance-details:before{content:'\e835'}.zan-icon-cash-back-record:before{content:'\e836'}.zan-icon-points-mall:before{content:'\e837'}.zan-icon-exchange-record:before{content:'\e838'}.zan-icon-pending-payment:before{content:'\e839'}.zan-icon-pending-orders:before{content:'\e83a'}.zan-icon-pending-deliver:before{content:'\e83b'}.zan-icon-pending-evaluate:before{content:'\e83c'}.zan-icon-gift-card-pay:before{content:'\e83d'}.zan-icon-cash-on-deliver:before{content:'\e83e'}.zan-icon-underway:before{content:'\e83f'}.zan-icon-point-gift:before{content:'\e840'}.zan-icon-after-sale:before{content:'\e841'}.zan-icon-edit-data:before{content:'\e842'}.zan-icon-question:before{content:'\e843'}.zan-icon-delete:before{content:'\e844'}.zan-icon-records:before{content:'\e845'}.zan-icon-description:before{content:'\e846'}.zan-icon-card:before{content:'\e847'}.zan-icon-gift-card:before{content:'\e848'}.zan-icon-clock:before{content:'\e849'}.zan-icon-gold-coin:before{content:'\e84a'}.zan-icon-completed:before{content:'\e84b'}.zan-icon-value-card:before{content:'\e84c'}.zan-icon-certificate:before{content:'\e84d'}.zan-icon-tosend:before{content:'\e84e'}.zan-icon-sign:before{content:'\e84f'}.zan-icon-home:before{content:'\e850'}.zan-icon-phone:before{content:'\e851'}.zan-icon-add-o:before{content:'\e852'}.zan-icon-minus-o:before{content:'\e853'}.zan-icon-play:before{content:'\e854'}.zan-icon-pause:before{content:'\e855'}.zan-icon-stop:before{content:'\e856'}.zan-icon-hot:before{content:'\e857'}.zan-icon-new:before{content:'\e858'}.zan-icon-new-arrival:before{content:'\e859'}.zan-icon-hot-sale:before{content:'\e85a'} \ No newline at end of file diff --git a/dist/toast/toast.js b/dist/toast/toast.js index 2a988f16..b47350e2 100644 --- a/dist/toast/toast.js +++ b/dist/toast/toast.js @@ -1,15 +1,47 @@ +const TOAST_CONFIG_KEY = 'zanui.__zanToastPageConfig'; + let timeoutData = { timeoutId: 0, toastCtx: null }; -function Toast(options = {}, pageCtx) { +let globalToastUserConfig = {}; + +// 获取页面上下文 +function getPageCtx(pageCtx) { let ctx = pageCtx; + if (!ctx) { const pages = getCurrentPages(); ctx = pages[pages.length - 1]; } - const toastCtx = ctx.selectComponent(options.selector); + + return ctx; +} + +// 获取当前页面的 toast 配置数据 +function getPageToastConfig(pageCtx) { + const zanuiData = pageCtx.data.zanui || {}; + return zanuiData.__zanToastPageConfig || {}; +} + +// Toast 显示函数 +function Toast(optionsOrMsg, pageCtx) { + // 参数格式化处理 + // 如果是文字，默认为 message + let options = optionsOrMsg || {}; + if (typeof optionsOrMsg === 'string') { + options = { message: optionsOrMsg }; + } + + let ctx = getPageCtx(pageCtx); + const pageToastUserSetting = getPageToastConfig(ctx); + const parsedOptions = { + ...globalToastUserConfig, + ...pageToastUserSetting, + ...options + }; + const toastCtx = ctx.selectComponent(parsedOptions.selector); if (!toastCtx) { console.error('无法找到对应的toast组件，请于页面中注册并在 wxml 中声明 toast 自定义组件'); @@ -21,13 +53,13 @@ function Toast(options = {}, pageCtx) { } toastCtx.show({ - ...options, + ...parsedOptions, show: true }); const timeoutId = setTimeout(() => { toastCtx.clear(); - }, options.timeout || 3000); + }, parsedOptions.timeout || 3000); timeoutData = { timeoutId, @@ -35,6 +67,40 @@ function Toast(options = {}, pageCtx) { }; } +// 设置 toast 基础属性 +Toast.setDefaultOptions = function (options = {}, type = 'page') { + const parsedDefaultOptions = { + selector: options.selector || '', + type: options.type || '', + icon: options.icon || '', + image: options.image || '', + timeout: options.timeout || 3000 + }; + + if (type === 'global') { + globalToastUserConfig = { + ...parsedDefaultOptions + }; + } else if (type === 'page') { + let ctx = getPageCtx(); + ctx.setData({ + [`${TOAST_CONFIG_KEY}`]: parsedDefaultOptions + }); + } +}; + +// 重置 toast 基础属性 +Toast.resetDefaultOptions = function (type = 'page') { + if (type === 'global') { + globalToastUserConfig = {}; + } else { + let ctx = getPageCtx(); + ctx.setData({ + [`${TOAST_CONFIG_KEY}`]: {} + }); + } +}; + // 清理所有 toast Toast.clear = function () { clearTimeout(timeoutData.timeoutId);