[build] 3.0.5

This commit is contained in:
pangxie 2018-06-29 10:57:04 +08:00
parent 3305aee3e4
commit d7615d32d5
29 changed files with 606 additions and 583 deletions

4
dist/btn/index.wxml vendored
View File

@ -1,5 +1,7 @@
<button
<button
class="custom-class zan-btn {{ inGroup ? 'zan-btn--group' : '' }} {{ isLast ? 'zan-btn--last' : '' }} {{size ? 'zan-btn--'+size : ''}} {{size === 'mini' ? 'zan-btn--plain' : ''}} {{plain ? 'zan-btn--plain' : ''}} {{type ? 'zan-btn--'+type : ''}} {{loading ? 'zan-btn--loading' : ''}} {{disabled ? 'zan-btn--disabled' : ''}}"
disabled="{{ disabled }}"
hover-class="button-hover"
open-type="{{ openType }}"
app-parameter="{{ appParameter }}"
hover-stop-propagation="{{ hoverStopPropagation }}"

View File

@ -1,48 +1,61 @@
'use strict';
var _relations;
var CELL_PATH = '../cell/index';
var FIELD_PATH = '../field/index';
Component({
relations: {
'../cell/index': {
type: 'child',
linked: function linked() {
this._updateIsLastCell();
},
linkChanged: function linkChanged() {
this._updateIsLastCell();
},
unlinked: function unlinked() {
this._updateIsLastCell();
}
relations: (_relations = {}, _relations[CELL_PATH] = {
type: 'child',
linked: function linked() {
this._updateIsLastElement(CELL_PATH);
},
linkChanged: function linkChanged() {
this._updateIsLastElement(CELL_PATH);
},
unlinked: function unlinked() {
this._updateIsLastElement(CELL_PATH);
}
},
}, _relations[FIELD_PATH] = {
type: 'child',
linked: function linked() {
this._updateIsLastElement(FIELD_PATH);
},
linkChanged: function linkChanged() {
this._updateIsLastElement(FIELD_PATH);
},
unlinked: function unlinked() {
this._updateIsLastElement(FIELD_PATH);
}
}, _relations),
data: {
cellUpdateTimeout: 0
elementUpdateTimeout: 0
},
methods: {
_updateIsLastCell: function _updateIsLastCell() {
_updateIsLastElement: function _updateIsLastElement(childPath) {
var _this = this;
// 用 setTimeout 减少计算次数
if (this.data.cellUpdateTimeout > 0) {
if (this.data.elementUpdateTimeout > 0) {
return;
}
var cellUpdateTimeout = setTimeout(function () {
_this.setData({ cellUpdateTimeout: 0 });
var cells = _this.getRelationNodes('../cell/index');
var elementUpdateTimeout = setTimeout(function () {
_this.setData({ elementUpdateTimeout: 0 });
var elements = _this.getRelationNodes(childPath);
if (elements.length > 0) {
var lastIndex = elements.length - 1;
if (cells.length > 0) {
var lastIndex = cells.length - 1;
cells.forEach(function (cell, index) {
cell.updateIsLastCell(index === lastIndex);
elements.forEach(function (cell, index) {
cell.updateIsLastElement(index === lastIndex);
});
}
});
this.setData({ cellUpdateTimeout: cellUpdateTimeout });
this.setData({ elementUpdateTimeout: elementUpdateTimeout });
}
}
});

2
dist/cell/index.js vendored
View File

@ -71,7 +71,7 @@ Component({
// 用于被 cell-group 更新,标志是否是最后一个 cell
updateIsLastCell: function updateIsLastCell(isLastCell) {
updateIsLastElement: function updateIsLastElement(isLastCell) {
this.setData({ isLastCell: isLastCell });
}
}

View File

@ -0,0 +1,35 @@
<import src="./picker-view-column.wxml" />
<template name="date-picker-view">
<picker-view
value="{{ selected }}"
bindchange="change"
indicator-style="height: 50px;"
class="picker-visible">
<template
is="picker-view-column"
data="{{ data: dataList[0], className: 'year-view-column', hidden: !use['years'], tip: '年' }}"
/>
<template
is="picker-view-column"
data="{{ data: dataList[1], hidden: !use['months'], tip: '月' }}"
/>
<template
is="picker-view-column"
data="{{ data: dataList[2], hidden: !use['days'], tip: '日' }}"
/>
<template
is="picker-view-column"
data="{{ data: dataList[3], hidden: !use['hours'], tip: '时' }}"
/>
<template
is="picker-view-column"
data="{{ data: dataList[4], hidden: !use['minutes'], tip: '分' }}"
/>
<template
is="picker-view-column"
data="{{ data: dataList[5], hidden: !use['seconds'], tip: '秒' }}"
/>
</picker-view>
</template>

105
dist/datetime-picker/date-picker.js vendored Normal file
View File

@ -0,0 +1,105 @@
'use strict';
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var LIMIT_YEAR_COUNT = 50;
var _require = require('./utils'),
genNumber = _require.genNumber,
iso2utc = _require.iso2utc;
module.exports = function () {
function DatePicker() {
var date = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new Date();
_classCallCheck(this, DatePicker);
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._date = date;
}
DatePicker.prototype.getYears = function getYears(year) {
var mid = Math.floor(LIMIT_YEAR_COUNT / 2);
var min = year - mid;
var max = year + (LIMIT_YEAR_COUNT - mid);
return genNumber(min, max, 4);
};
DatePicker.prototype.lastDay = function lastDay(year, month) {
return month !== 12 ? new Date(new Date(year + '/' + (month + 1) + '/1').getTime() - 24 * 60 * 60 * 1000).getDate() : 31;
};
DatePicker.prototype.getData = function getData(date) {
date = date || this._date || new Date();
// toUTCString ISO 格式部分 ios 手机会失败
if (typeof date === 'string' && date.indexOf('-') > 0) {
date = iso2utc(date);
}
var d = new Date(date);
var y = d.getFullYear();
var m = d.getMonth() + 1;
var years = this.getYears(y);
var lastDay = this.lastDay(y, m);
var 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() - 1, d.getHours(), d.getMinutes(), d.getSeconds()];
return {
dataList: this._dataList,
selected: this._indexs
};
};
DatePicker.prototype.update = function update(col, index) {
var type = this.types[col];
switch (type) {
case 'year':
return this._updateYear(col, index);
case 'month':
return this._updateMonth(col, index);
default:
this._indexs[col] = index;
return [{ col: col, index: index }];
}
};
DatePicker.prototype._updateYear = function _updateYear(col, index, cb) {
var years = this._dataList[col];
var year = years[index];
this._dataList[col] = this.getYears(+year);
this._indexs[col] = Math.floor(LIMIT_YEAR_COUNT / 2);
return [{ col: 0, index: this._indexs[col], data: this._dataList[col] }];
};
DatePicker.prototype._updateMonth = function _updateMonth(col, index) {
var month = this._dataList[col][index];
var year = this._dataList[0][this._indexs[0]];
var 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];
return [{
col: 1,
index: index
}, {
col: 2,
index: this._indexs[2],
data: this._dataList[2]
}];
};
return DatePicker;
}();

View File

@ -1,200 +1,11 @@
'use strict';
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var DatePicker = require('./date-picker');
function partStartWithZero(num, strlen) {
var zeros = '';
while (zeros.length < strlen) {
zeros += '0';
}
return (zeros + num).slice(-strlen);
}
var _require = require('./utils'),
genNumber = _require.genNumber,
moment = _require.moment;
function genNumber(begin, end, strlen) {
var nums = [];
while (begin <= end) {
nums.push(partStartWithZero(begin, strlen));
begin++;
}
return nums;
}
function moment(date) {
var formatStr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'YYYY:MM:DD';
if (!date && date !== 0) date = new Date();
date = new Date(date);
if (date.toString() === 'Invalid Date') throw new Error('Invalid Date');
var getDateValue = function getDateValue(method, fn) {
return fn ? fn(date['get' + method]()) : date['get' + method]();
};
var map = new Map();
map.set(/(Y+)/i, function () {
return getDateValue('FullYear', function (year) {
return (year + '').substr(4 - RegExp.$1.length);
});
});
map.set(/(M+)/, function () {
return getDateValue('Month', function (month) {
return partStartWithZero(month + 1, RegExp.$1.length);
});
});
map.set(/(D+)/i, function () {
return getDateValue('Date', function (date) {
return partStartWithZero(date, RegExp.$1.length);
});
});
map.set(/(H+)/i, function () {
return getDateValue('Hours', function (hour) {
return partStartWithZero(hour, RegExp.$1.length);
});
});
map.set(/(m+)/, function () {
return getDateValue('Minutes', function (minute) {
return partStartWithZero(minute, RegExp.$1.length);
});
});
map.set(/(s+)/, function () {
return getDateValue('Seconds', function (second) {
return partStartWithZero(second, RegExp.$1.length);
});
});
for (var _iterator = map, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
var _ref2;
if (_isArray) {
if (_i >= _iterator.length) break;
_ref2 = _iterator[_i++];
} else {
_i = _iterator.next();
if (_i.done) break;
_ref2 = _i.value;
}
var _ref = _ref2;
var reg = _ref[0];
var fn = _ref[1];
if (reg.test(formatStr)) {
formatStr = formatStr.replace(RegExp.$1, fn.call(null));
}
}
return formatStr;
}
var LIMIT_YEAR_COUNT = 50;
var DatePicker = function () {
function DatePicker(format) {
var date = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : new Date();
var cb = arguments[2];
_classCallCheck(this, DatePicker);
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);
}
DatePicker.prototype.getYears = function getYears(year) {
var mid = Math.floor(LIMIT_YEAR_COUNT / 2);
var min = year - mid;
var max = year + (LIMIT_YEAR_COUNT - mid);
return genNumber(min, max, 4);
};
DatePicker.prototype.lastDay = function lastDay(year, month) {
return month !== 12 ? new Date(new Date(year + '/' + (month + 1) + '/1').getTime() - 24 * 60 * 60 * 1000).getDate() : 31;
};
DatePicker.prototype.init = function init(date, cb) {
var d = new Date(date);
var y = d.getFullYear();
var m = d.getMonth() + 1;
var years = this.getYears(y);
var lastDay = this.lastDay(y, m);
var 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
});
};
DatePicker.prototype.update = function update(col, index, cb) {
var 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
});
}
};
DatePicker.prototype._updateYear = function _updateYear(col, index, cb) {
var years = this._dataList[col];
var 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
});
};
DatePicker.prototype._updateMonth = function _updateMonth(col, index, cb) {
var month = this._dataList[col][index];
var year = this._dataList[0][this._indexs[0]];
var 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
});
};
return DatePicker;
}();
// 组件内使用 this.indexs 好像有问题
var _indexs = [];
Component({
properties: {
placeholder: {
@ -205,15 +16,20 @@ Component({
type: String,
value: 'YYYY-MM-DD HH:mm:ss'
},
native: {
type: Boolean
},
pickerView: {
type: Boolean
},
date: {
type: String,
value: new Date()
observer: function observer(value) {
if (value === {}.toString()) {
throw new Error('参数必须是一个字符串');
}
if (/^[0-9]+$/.test(value)) {
value = +value;
}
this.updateDate(value);
}
},
notUse: {
type: Array
@ -226,108 +42,96 @@ Component({
attached: function attached() {
var _this = this;
this.use = {};['years', 'months', 'days', 'hours', 'minutes', 'seconds'].forEach(function (item) {
this.use = {};
['years', 'months', 'days', 'hours', 'minutes', 'seconds'].forEach(function (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: function ready() {
// 微信 bug如果不先定义会导致不能选中
this.picker = new DatePicker(this.data.date);
var _picker$getData = this.picker.getData(this.data.date),
dataList = _picker$getData.dataList,
selected = _picker$getData.selected;
// 鬼他么知道为什么 dataList, selected 不能一起 setData
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)]
use: this.use,
dataList: dataList
}, function () {
_this.setData({
selected: selected
});
});
this.picker = new DatePicker(this.data.format, this.data.date, this.updatePicker.bind(this));
this._indexs = selected;
},
methods: {
updatePicker: function updatePicker(_ref3) {
var dataList = _ref3.dataList,
indexs = _ref3.indexs,
updateColumn = _ref3.updateColumn,
updateIndex = _ref3.updateIndex;
updatePicker: function updatePicker() {
var updateData = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
var 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];
var _updateData = {};
for (var _iterator = updateData, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
var _ref2;
if (_isArray) {
if (_i >= _iterator.length) break;
_ref2 = _iterator[_i++];
} else {
_i = _iterator.next();
if (_i.done) break;
_ref2 = _i.value;
}
var _ref = _ref2;
var col = _ref.col,
index = _ref.index,
data = _ref.data;
if (~index && this._indexs[col] !== index || col === 0) {
_updateData['selected[' + col + ']'] = index; // 更新索引
this._indexs[col] = index;
}
if (data) {
_updateData['dataList[' + col + ']'] = data;
}
}
// 只在初始化时设置全部的值,其他的都局部更新
if (!updateColumn && typeof updateIndex === 'undefined') {
updateData = { dataList: dataList, selected: indexs };
_indexs.forEach(function (item, index) {
updateData['transPos[' + index + ']'] = -item * 36;
});
}
this.setData(updateData);
this.setData(_updateData);
},
touchmove: function touchmove(e) {
var changedTouches = e.changedTouches,
target = e.target;
var col = target.dataset.col;
var clientY = changedTouches[0].clientY;
if (!col) return;
var updateData = {};
var 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: function touchStart(e) {
var target = e.target,
changedTouches = e.changedTouches;
var col = target.dataset.col;
var touchData = changedTouches[0];
if (!col) return;
this.startY = touchData.clientY;
this.startTime = e.timeStamp;
this.startTransPos = this.data.transPos[col];
},
touchEnd: function touchEnd(e) {
var col = e.target.dataset.col;
if (!col) return;
var pos = this.data.transPos[col];
var itemIndex = Math.round(pos / 36);
this.columnchange({ detail: { column: +col, value: -itemIndex } });
},
columnchange: function columnchange(e) {
var _e$detail = e.detail,
column = _e$detail.column,
value = _e$detail.value;
_indexs[column] = value;
this.picker.update(column, value, this.updatePicker.bind(this));
this.data.pickerView && !this.data.native && this.change({ detail: { value: _indexs } });
},
getFormatStr: function getFormatStr() {
updateDate: function updateDate(date) {
var _this2 = this;
var date = new Date();['FullYear', 'Month', 'Date', 'Hours', 'Minutes', 'Seconds'].forEach(function (key, index) {
var value = _this2.data.dataList[index][_indexs[index]];
var _picker$getData2 = this.picker.getData(date),
dataList = _picker$getData2.dataList,
selected = _picker$getData2.selected;
this._indexs = selected;
// 好像必须要等到 datalist 完成
this.setData({ dataList: dataList }, function () {
_this2.setData({
selected: selected,
text: _this2.getFormatStr()
});
});
},
getFormatStr: function getFormatStr() {
var _this3 = this;
var date = new Date();
['FullYear', 'Month', 'Date', 'Hours', 'Minutes', 'Seconds'].forEach(function (key, index) {
var value = _this3.data.dataList[index][_this3._indexs[index]];
if (key === 'Month') {
value = +_this2.data.dataList[index][_indexs[index]] - 1;
value = +_this3.data.dataList[index][_this3._indexs[index]] - 1;
}
date['set' + key](+value);
});
@ -335,18 +139,38 @@ Component({
return moment(date, this.data.format);
},
showPicker: function showPicker() {
this.setData({ show: true });
this.setData({
show: true
});
},
hidePicker: function hidePicker(e) {
var action = e.currentTarget.dataset.action;
this.setData({ show: false });
this.setData({
show: false
});
if (action === 'cancel') {
this.cancel({ detail: {} });
this.cancel({
detail: {}
});
} else {
this.change({ detail: { value: _indexs } });
this.change({
detail: {
value: this._indexs
}
});
}
},
columnchange: function columnchange(e) {
var _e$detail = e.detail,
column = _e$detail.column,
value = _e$detail.value;
var updateData = this.picker.update(column, value);
this.updatePicker(updateData);
},
change: function change(e) {
var value = e.detail.value;
@ -355,23 +179,25 @@ Component({
return +item[value[index]];
});
this.triggerEvent('change', { value: data });
this.triggerEvent('change', {
value: data
});
// 为了支持原生 picker view每次 change 都需要手动 columnchange
if (this.data.pickerView && this.data.native) {
for (var index = 0; index < value.length; index++) {
if (_indexs[index] !== value[index]) {
this.columnchange({
detail: {
column: index, value: value[index]
}
});
break; // 这里每次只处理一列,否则会出现日期值为 undefined 的情况
}
// 手动触发 columnchange
for (var index = 0; index < value.length; index++) {
if (this._indexs[index] !== value[index]) {
this.columnchange({
detail: {
column: index,
value: value[index]
}
});
}
}
this.setData({ text: this.getFormatStr() });
this.setData({
text: this.getFormatStr()
});
},
cancel: function cancel(e) {
this.triggerEvent('cancel', e.detail);

View File

@ -1,3 +1,6 @@
{
"component": true
"component": true,
"usingComponents": {
"pop-manager": "../common/pop-manager/index"
}
}

View File

@ -1,111 +1,18 @@
<block wx:if="{{ pickerView }}">
<picker-view
wx:if="{{ native }}"
value="{{ selected }}"
bindchange="change"
indicator-style="height: 50px;"
class="picker-visible">
<picker-view-column>
<view wx:for="{{dataList[0]}}" style="line-height: 50px" wx:key="*this">{{item}}</view>
</picker-view-column>
<import src="./date-picker-view.wxml" />
<picker-view-column>
<view wx:for="{{dataList[1]}}" style="line-height: 50px" wx:key="*this">{{item}}</view>
</picker-view-column>
<view wx:if="{{ !pickerView }}" bindtap="showPicker" class="placeholder-class">{{text || placeholder}}</view>
<picker-view-column>
<view wx:for="{{dataList[2]}}" style="line-height: 50px" wx:key="*this">{{item}}</view>
</picker-view-column>
<picker-view-column>
<view wx:for="{{dataList[3]}}" style="line-height: 50px" wx:key="*this">{{item}}</view>
</picker-view-column>
<picker-view-column>
<view wx:for="{{dataList[4]}}" style="line-height: 50px" wx:key="*this">{{item}}</view>
</picker-view-column>
<picker-view-column>
<view wx:for="{{dataList[5]}}" style="line-height: 50px" wx:key="*this">{{item}}</view>
</picker-view-column>
</picker-view>
</block>
<block wx:else>
<picker
wx:if="{{native}}"
mode="multiSelector"
range="{{ dataList }}"
value="{{ selected }}"
bindchange="change"
bindcolumnchange="columnchange"
bindcancel="cancel" >
<view class="placeholder-class">
{{text || placeholder}}
<view wx:if="{{ pickerView }}" class="picker-view">
<template is="date-picker-view" data="{{ dataList, selected, use }}" />
</view>
<view wx:else>
<pop-manager show="{{ show }}" type="bottom" >
<view class="picker">
<view class="picker-action">
<view data-action="cancel" bindtap="hidePicker">取消</view>
<view data-action="change" bindtap="hidePicker">确认</view>
</view>
<template is="date-picker-view" data="{{ dataList, selected, use }}" />
</view>
</picker>
</block>
<view data-action="cancel" bindtap="hidePicker" class="picker-mask {{show && !pickerView ? 'show' : ''}}"></view>
<view wx:if="{{ !native }}" class="data-time-picker {{ pickerView && 'picker-view' }}">
<view bindtap="showPicker" wx:if="{{ !pickerView }}" class="placeholder-class">{{text || placeholder}}</view>
<view class="picker {{show ? 'picker-visible' : ''}}">
<view wx:if="{{!pickerView}}" class="picker-action">
<view data-action="cancel" bindtap="hidePicker">取消</view>
<view data-action="change" bindtap="hidePicker">确认</view>
</view>
<view
catchtouchstart="touchStart"
catchtouchend="touchEnd"
catchtouchmove="touchmove" class="picker-cols">
<view wx:if="{{use['years']}}" data-col="0" class="col">
<view data-col="0" style="transform: translateY({{ transPos[0] }}px)">
<view data-col="0" class="{{ index === selected[0] ? 'select-item' : '' }} cell"
wx:for-index="index"
wx:for="{{dataList[0]}}" wx:key="*this">{{item}}</view>
</view>
</view>
<view wx:if="{{use['years']}}" data-col="0" class="fixed-col">年</view>
<view wx:if="{{use['months']}}" data-col="1" class="col">
<view data-col="1" style="transform: translateY({{ transPos[1] }}px)">
<view data-col="1" class="{{ index === selected[1] ? 'select-item' : '' }} cell"
wx:for-index="index"
wx:for="{{dataList[1]}}" wx:key="*this">{{item}}</view>
</view>
</view>
<view wx:if="{{use['months']}}" data-col="1" class="fixed-col">月</view>
<view wx:if="{{use['days']}}" data-col="2" class="col">
<view data-col="2" style="transform: translateY({{ transPos[2] }}px)">
<view data-col="2" class="{{ index === selected[2] ? 'select-item' : '' }} cell"
wx:for-index="index" wx:for="{{dataList[2]}}" wx:key="*this">{{item}}</view>
</view>
</view>
<view wx:if="{{use['days']}}" data-col="2" class="fixed-col">日</view>
<view wx:if="{{use['hours']}}" data-col="3" class="col">
<view data-col="3" style="transform: translateY({{ transPos[3] }}px)">
<view data-col="3" class="{{ index === selected[3] ? 'select-item' : '' }} cell"
wx:for-index="index" wx:for="{{dataList[3]}}" wx:key="*this">{{item}}</view>
</view>
</view>
<view wx:if="{{use['hours']}}" data-col="3" class="fixed-col">时</view>
<view wx:if="{{use['minutes']}}" data-col="4" class="col">
<view data-col="4" style="transform: translateY({{ transPos[4] }}px)">
<view data-col="4" class="{{ index === selected[4] ? 'select-item' : '' }} cell"
wx:for-index="index" wx:for="{{dataList[4]}}" wx:key="*this">{{item}}</view>
</view>
</view>
<view wx:if="{{use['minutes']}}" data-col="4" class="fixed-col">分</view>
<view wx:if="{{use['seconds']}}" data-col="5" class="col">
<view data-col="5" style="transform: translateY({{ transPos[5] }}px)">
<view data-col="5" class="{{ index === selected[5] ? 'select-item' : '' }} cell"
wx:for-index="index" wx:for="{{dataList[5]}}" wx:key="*this">{{item}}</view>
</view>
</view>
<view wx:if="{{use['seconds']}}" data-col="5" class="fixed-col">秒</view>
</view>
</view>
</pop-manager>
</view>

View File

@ -1,110 +1,53 @@
.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-view-column.year-view-column {
width: 50px;
flex: 2;
}
.picker-mask {
position: fixed;
picker-view-column {
width: 30px;
text-align: center;
}
.hidden {
display: none;
}
.view-column-tip {
height: 235px;
line-height: 235px;
margin: 0 5px;
}
.picker {
width: 100vw;
height: 100vh;
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;
z-index: 12;
}
.picker .picker-action {
height: 36px;
border-bottom: 1rpx solid #e5e5e5;
bottom: 235px;
padding: 0 15px;
width: 100%;
display: flex;
align-items: center;
position: absolute;
background: #fff;
box-sizing: border-box;
border-bottom: 1rpx solid #e5e5e5;
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: '';
.picker picker-view {
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;
}
background: #fff;
width: 100vw;
}

View File

@ -0,0 +1,6 @@
<template name="picker-view-column">
<picker-view-column class="{{ className }} {{ hidden && 'hidden'}}">
<view wx:for="{{ data }}" style="line-height: 50px" wx:key="*this">{{item}}</view>
</picker-view-column>
<view class="view-column-tip {{ hidden && 'hidden'}}">{{ tip }}</view>
</template>

124
dist/datetime-picker/utils.js vendored Normal file
View File

@ -0,0 +1,124 @@
'use strict';
function partStartWithZero(num, strlen) {
var zeros = '';
while (zeros.length < strlen) {
zeros += '0';
}
return (zeros + num).slice(-strlen);
}
module.exports.genNumber = function genNumber(begin, end, strlen) {
var nums = [];
while (begin <= end) {
nums.push(partStartWithZero(begin, strlen));
begin++;
}
return nums;
};
module.exports.moment = function moment(date) {
var formatStr = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'YYYY:MM:DD';
if (!date && date !== 0) date = new Date();
date = new Date(date);
if (date.toString() === 'Invalid Date') throw new Error('Invalid Date');
var getDateValue = function getDateValue(method, fn) {
return fn ? fn(date['get' + method]()) : date['get' + method]();
};
var map = new Map();
map.set(/(Y+)/i, function () {
return getDateValue('FullYear', function (year) {
return (year + '').substr(4 - RegExp.$1.length);
});
});
map.set(/(M+)/, function () {
return getDateValue('Month', function (month) {
return partStartWithZero(month + 1, RegExp.$1.length);
});
});
map.set(/(D+)/i, function () {
return getDateValue('Date', function (date) {
return partStartWithZero(date, RegExp.$1.length);
});
});
map.set(/(H+)/i, function () {
return getDateValue('Hours', function (hour) {
return partStartWithZero(hour, RegExp.$1.length);
});
});
map.set(/(m+)/, function () {
return getDateValue('Minutes', function (minute) {
return partStartWithZero(minute, RegExp.$1.length);
});
});
map.set(/(s+)/, function () {
return getDateValue('Seconds', function (second) {
return partStartWithZero(second, RegExp.$1.length);
});
});
for (var _iterator = map, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
var _ref2;
if (_isArray) {
if (_i >= _iterator.length) break;
_ref2 = _iterator[_i++];
} else {
_i = _iterator.next();
if (_i.done) break;
_ref2 = _i.value;
}
var _ref = _ref2;
var reg = _ref[0];
var fn = _ref[1];
if (reg.test(formatStr)) {
formatStr = formatStr.replace(RegExp.$1, fn.call(null));
}
}
return formatStr;
};
module.exports.iso2utc = function (string) {
var regexp = "([0-9]{4})(-([0-9]{2})(-([0-9]{2})(T([0-9]{2}):([0-9]{2})(:([0-9]{2})(\.([0-9]+))?)?(Z|(([-+])([0-9]{2}):([0-9]{2})))?)?)?)?";
if (string) {
var d = string.match(new RegExp(regexp));
var offset = 0;
var date = new Date(d[1], 0, 1);
if (d[3]) {
date.setMonth(d[3] - 1);
}
if (d[5]) {
date.setDate(+d[5]);
}
if (d[7]) {
date.setHours(d[7]);
}
if (d[8]) {
date.setMinutes(d[8]);
}
if (d[10]) {
date.setSeconds(d[10]);
}
if (d[12]) {
date.setMilliseconds(Number("0." + d[12]) * 1000);
}
if (d[14]) {
offset = Number(d[16]) * 60 + Number(d[17]);
offset *= d[15] == '-' ? 1 : -1;
}
offset -= date.getTimezoneOffset();
return Number(date) + offset * 60 * 1000;
} else {
return string;
}
};

3
dist/dialog/data.js vendored
View File

@ -3,9 +3,6 @@
module.exports = {
// 标题
title: '',
// 自定义 btn 列表
// { type: 按钮类型回调时以此作为区分依据text: 按钮文案, color: 按钮文字颜色 }
buttons: [],
// 内容
message: ' ',
// 选择节点

View File

@ -5,7 +5,11 @@ var defaultData = require('./data');
// options 使用参数
// pageCtx 页面 page 上下文
function Dialog(options, pageCtx) {
var parsedOptions = Object.assign({}, defaultData, options);
var parsedOptions = Object.assign({
// 自定义 btn 列表
// { type: 按钮类型回调时以此作为区分依据text: 按钮文案, color: 按钮文字颜色 }
buttons: []
}, defaultData, options);
var ctx = pageCtx;
if (!ctx) {

29
dist/dialog/index.js vendored
View File

@ -1,18 +1,39 @@
'use strict';
var defaultData = require('./data');
var _f = function _f() {};
Component({
properties: {},
data: Object.assign({}, defaultData, {
data: {
// 标题
title: '',
// 自定义 btn 列表
// { type: 按钮类型回调时以此作为区分依据text: 按钮文案, color: 按钮文字颜色 }
buttons: [],
// 内容
message: ' ',
// 选择节点
selector: '#zan-dialog',
// 按钮是否展示为纵向
buttonsShowVertical: false,
// 是否展示确定
showConfirmButton: true,
// 确认按钮文案
confirmButtonText: '确定',
// 确认按钮颜色
confirmButtonColor: '#3CC51F',
// 是否展示取消
showCancelButton: false,
// 取消按钮文案
cancelButtonText: '取消',
// 取消按钮颜色
cancelButtonColor: '#333',
key: '',
show: false,
showCustomBtns: false,
promiseFunc: {}
}),
},
methods: {
handleButtonClick: function handleButtonClick(e) {

24
dist/field/index.js vendored
View File

@ -3,6 +3,14 @@
Component({
behaviors: ['wx://form-field'],
externalClasses: ['field-class'],
relations: {
'../cell-group/index': {
type: 'parent'
}
},
properties: {
title: String,
type: {
@ -10,12 +18,12 @@ Component({
value: 'input'
},
disabled: Boolean,
focus: Boolean,
inputType: {
type: String,
value: 'text'
},
placeholder: String,
focus: Boolean,
mode: {
type: String,
value: 'normal'
@ -28,6 +36,10 @@ Component({
}
},
data: {
showBorder: true
},
methods: {
handleFieldChange: function handleFieldChange(event) {
var _event$detail = event.detail,
@ -44,6 +56,16 @@ Component({
},
handleFieldBlur: function handleFieldBlur(event) {
this.triggerEvent('blur', event);
},
updateIsLastElement: function updateIsLastElement(isLastField) {
var showBorder = true;
if (isLastField && this.data.mode === 'normal') {
showBorder = false;
}
this.setData({
showBorder: showBorder
});
}
}
});

View File

@ -1,3 +1,6 @@
{
"component": true
"component": true,
"usingComponents": {
"zan-cell": "../cell/index"
}
}

View File

@ -1,5 +1,9 @@
<view class="zan-cell zan-field {{ error ? 'zan-field--error' : '' }} {{ mode === 'wrapped' ? 'zan-field--wrapped' : '' }}">
<zan-cell
class="field-class zan-field {{ error ? 'zan-field--error' : '' }} {{ mode === 'wrapped' ? 'zan-field--wrapped' : '' }} {{ !showBorder ? 'zan-field--no-border' : '' }}"
cell-class="zan-cell--field"
>
<view
slot="icon"
wx:if="{{ title }}"
class="zan-cell__hd zan-field__title">
{{ title }}
@ -32,4 +36,4 @@
bindfocus="handleFieldFocus"
bindblur="handleFieldBlur"
/>
</view>
</zan-cell>

View File

@ -1 +1 @@
.zan-cell{position:relative;padding:12px 15px;display:flex;align-items:center;line-height:1.4;background-color:#fff;font-size:14px}.zan-cell::after{content:'';position:absolute;top:0;left:0;width:200%;height:200%;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:0 0;transform-origin:0 0;pointer-events:none;box-sizing:border-box;border:0 solid #e5e5e5;border-bottom-width:1px;left:15px;right:0}.zan-cell .zan-cell__icon{margin-right:5px}.zan-cell .zan-cell__icon:empty{display:none}.zan-cell__bd{flex:1}.zan-cell__text{line-height:24px;font-size:14px}.zan-cell__desc{line-height:1.2;font-size:12px;color:#666}.zan-cell__ft{position:relative;text-align:right;color:#666}.zan-cell__no-pading{padding:0}.zan-cell__no-pading .zan-cell__bd_padding{padding:12px 0 12px 15px}.zan-cell__no-pading .zan-cell__bd_padding .zan-form__input{height:26px}.zan-cell__no-pading .zan-cell__ft_padding{padding:12px 15px 12px 0}.zan-cell.last-cell::after{display:none}.zan-cell--access .zan-cell__ft{padding-right:13px}.zan-cell--access .zan-cell__ft::after{position:absolute;top:50%;right:2px;content:" ";display:inline-block;height:6px;width:6px;border-width:2px 2px 0 0;border-color:#c8c8c8;border-style:solid;-webkit-transform:translateY(-50%) matrix(.71,.71,-.71,.71,0,0);transform:translateY(-50%) matrix(.71,.71,-.71,.71,0,0)}.zan-cell--switch{padding-top:6px;padding-bottom:6px}.zan-field{padding:7px 15px;color:#333}.zan-field--wrapped{margin:10px 15px;background-color:#fff}.zan-field--wrapped::after{left:0;border-width:1px;border-radius:4px}.zan-field.zan-field--wrapped::after{display:block}.zan-field--error{color:#f40}.zan-field--wrapped.zan-field--error::after{border-color:#f40}.zan-field__title{color:#333;min-width:65px;padding-right:10px}.zan-field__input{flex:1;line-height:1.6;padding:4px 0;min-height:22px;height:auto;font-size:14px}.zan-field__placeholder{font-size:14px}.zan-field__input--right{text-align:right}
.zan-field{display:block;position:relative;color:#333}.zan-field::after{content:'';position:absolute;top:0;left:0;width:200%;height:200%;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:0 0;transform-origin:0 0;pointer-events:none;box-sizing:border-box;border:0 solid #e5e5e5;border-bottom-width:1px;left:15px;right:0}.zan-field--no-border::after{border-bottom-width:0}.zan-cell--field{padding:7px 15px}.zan-field--wrapped{margin:10px 15px;background-color:#fff}.zan-field--wrapped::after{left:0;border-width:1px;border-radius:4px}.zan-field--wrapped::after{display:block}.zan-field--error{color:#f40}.zan-field--wrapped.zan-field--error::after{border-color:#f40}.zan-field__title{color:#333;min-width:65px;padding-right:10px}.zan-field__input{flex:1;line-height:1.6;padding:4px 0;min-height:22px;height:auto;font-size:14px}.zan-field__placeholder{font-size:14px}.zan-field__input--right{text-align:right}

View File

@ -8,7 +8,10 @@ Component({
properties: {
text: {
type: String,
value: ''
value: '',
observer: function observer(newVal) {
this.setData({}, this._init);
}
},
mode: {
type: String,
@ -73,9 +76,6 @@ Component({
timer && clearTimeout(timer);
},
ready: function ready() {
this._init();
},
methods: {
@ -91,7 +91,7 @@ Component({
wx.createSelectorQuery().in(this).select('.zan-noticebar__content').boundingClientRect(function (rect) {
if (!rect || !rect.width) {
throw new Error('页面缺少 noticebar 元素');
return;
}
_this.setData({
width: rect.width

View File

@ -6,7 +6,10 @@ var VERY_LARGE_NUMBER = 2147483647;
Component({
properties: {
size: String,
size: {
type: String,
value: 'middle'
},
stepper: {
type: Number,
value: 1
@ -42,6 +45,8 @@ Component({
stepper += step;
}
if (stepper < this.data.min || stepper > this.data.max) return null;
this.triggerEvent('change', stepper);
this.triggerEvent(type);
},

View File

@ -1,4 +1,4 @@
<view class="zan-stepper {{ size === 'small' ? 'zan-stepper--small' : '' }}">
<view class="zan-stepper zan-stepper--{{ size }}">
<view
class="zan-stepper__minus {{ stepper <= min ? 'zan-stepper--disabled' : '' }}"
data-disabled="{{ stepper <= min }}"

View File

@ -1 +1 @@
.zan-stepper{color:#666}.zan-stepper view{display:inline-block;line-height:20px;padding:5px 0;text-align:center;min-width:40px;box-sizing:border-box;vertical-align:middle;font-size:12px;border:1rpx solid #999}.zan-stepper .zan-stepper__minus{border-right:none;border-radius:2px 0 0 2px}.zan-stepper .zan-stepper__text{border:1rpx solid #999;display:inline-block;text-align:center;vertical-align:middle;height:30px;width:40px;min-height:auto;font-size:12px;line-height:30px}.zan-stepper .zan-stepper__plus{border-left:none;border-radius:0 2px 2px 0}.zan-stepper .zan-stepper--disabled{background:#f8f8f8;color:#bbb;border-color:#e8e8e8}.zan-stepper--small view{min-width:36px;line-height:18px}.zan-stepper--small .zan-stepper__text{width:36px;line-height:28px;height:28px}
.zan-stepper{color:#666}.zan-stepper view{display:inline-block;padding:5px 0;text-align:center;box-sizing:border-box;vertical-align:middle;font-size:12px;border:1rpx solid #999}.zan-stepper .zan-stepper__minus{border-right:none;border-radius:2px 0 0 2px}.zan-stepper .zan-stepper__text{border:1rpx solid #999;display:inline-block;text-align:center;vertical-align:middle;min-height:auto;font-size:12px}.zan-stepper .zan-stepper__plus{border-left:none;border-radius:0 2px 2px 0}.zan-stepper .zan-stepper--disabled{background:#f8f8f8;color:#bbb;border-color:#e8e8e8}.zan-stepper--small view{min-width:36px;line-height:18px}.zan-stepper--small .zan-stepper__text{width:36px;line-height:28px;height:28px}.zan-stepper--middle view{min-width:40px;line-height:20px}.zan-stepper--middle .zan-stepper__text{width:40px;line-height:30px;height:30px}.zan-stepper--large view{min-width:44px;line-height:22px}.zan-stepper--large .zan-stepper__text{width:44px;line-height:32px;height:32px}

1
dist/steps/index.js vendored
View File

@ -1,6 +1,7 @@
'use strict';
Component({
externalClasses: ['steps-class', 'icon-class', 'title-class', 'desc-class'],
properties: {
type: {
type: String,

View File

@ -1,11 +1,11 @@
<view class="zan-steps zan-steps--{{ type == 'vertical' ? 'vsteps' : 'steps' }} zan-steps--{{ steps.length }} {{ className }}">
<view class="steps-class zan-steps zan-steps--{{ type == 'vertical' ? 'vsteps' : 'steps' }} zan-steps--{{ steps.length }} {{ className }}">
<view
wx:for="{{ steps }}" wx:for-item="step" wx:key="unique" wx:for-index="index"
class="zan-steps__step {{ hasDesc ? 'zan-steps__step--db-title' : '' }} {{ index == 0 ? 'zan-steps__step--first-child' : '' }} {{ index == steps.length - 1 ? 'zan-steps__step--last-child' : '' }} {{ step.done ? 'zan-steps__step--done' : '' }} {{ step.current ? 'zan-steps__step--cur' : '' }}"
>
<view class="zan-steps__title">{{ step.text }}</view>
<view wx:if="{{ hasDesc && step.desc }}" class="zan-steps__title zan-steps__title--desc">{{ step.desc }}</view>
<view class="zan-steps__icons">
<view class="zan-steps__title title-class">{{ step.text }}</view>
<view wx:if="{{ hasDesc && step.desc }}" class="zan-steps__title zan-steps__title--desc desc-class">{{ step.desc }}</view>
<view class="zan-steps__icons icon-class">
<view class="zan-steps__circle"></view>
</view>
<view class="zan-steps__line"></view>

View File

@ -1 +1 @@
.zan-steps--steps.zan-steps--5 .zan-steps__step{width:25%}.zan-steps--steps.zan-steps--4 .zan-steps__step{width:33%}.zan-steps--steps.zan-steps--3 .zan-steps__step{width:50%}.zan-steps--steps .zan-steps__step{position:relative;float:left;padding-bottom:25px;color:#b1b1b1;width:100%}.zan-steps--steps .zan-steps__title{-webkit-transform:translateX(-50%);transform:translateX(-50%);font-size:10px;text-align:center}.zan-steps--steps .zan-steps__icons{position:absolute;top:30px;left:-10px;padding:0 8px;background-color:#fff;z-index:10}.zan-steps--steps .zan-steps__circle{display:block;position:relative;width:5px;height:5px;background-color:#e5e5e5;border-radius:50%}.zan-steps--steps .zan-steps__line{position:absolute;left:0;top:32px;width:100%;height:1px;background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--done{color:#333}.zan-steps--steps .zan-steps__step--done .zan-steps__line{background-color:#06bf04}.zan-steps--steps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--steps .zan-steps__step--cur .zan-steps__icons{top:25px;left:-14px}.zan-steps--steps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background-image:url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px}.zan-steps--steps .zan-steps__step--cur .zan-steps__line{background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--first-child .zan-steps__title{margin-left:0;-webkit-transform:none;transform:none;text-align:left}.zan-steps--steps .zan-steps__step--first-child .zan-steps__icons{left:-7px}.zan-steps--steps .zan-steps__step--last-child{position:absolute;right:0;top:0;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__title{-webkit-transform:none;transform:none;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__icons{left:auto;right:-6px}.zan-steps--steps .zan-steps__step--last-child .zan-steps__line{display:none}.zan-steps--steps .zan-steps__step--db-title{min-height:29px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__line{top:45px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__icons{top:43px}.zan-steps--steps .zan-steps__step--db-title.zan-steps__step--cur .zan-steps__icons{top:39px}.zan-steps--vsteps{color:#999;font-size:14px}.zan-steps--vsteps .zan-steps__step{position:relative;padding:15px 0}.zan-steps--vsteps .zan-steps__step--done{color:#4b0}.zan-steps--vsteps .zan-steps__line{position:absolute;top:0;bottom:0;left:7px;width:1px;background-color:#e5e5e5}.zan-steps--vsteps .zan-steps__title{display:inline-block;line-height:20px;padding-left:27px}.zan-steps--vsteps .zan-steps__title--desc{padding-left:3px}.zan-steps--vsteps .zan-steps__icons{position:absolute;left:7px;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:2;padding:3px 0;background-color:#fff}.zan-steps--vsteps .zan-steps__circle{width:5px;height:5px;background-color:#cacaca;border-radius:10px}.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background:transparent url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px;border-radius:0}.zan-steps--vsteps .zan-steps__icon--active{width:13px;height:13px}.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before{content:'';position:absolute;top:0;bottom:50%;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after{content:'';position:absolute;top:50%;bottom:0;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps{position:relative}
.zan-steps--steps.zan-steps--5 .zan-steps__step{width:25%}.zan-steps--steps.zan-steps--4 .zan-steps__step{width:33%}.zan-steps--steps.zan-steps--3 .zan-steps__step{width:50%}.zan-steps--steps .zan-steps__step{position:relative;float:left;padding-bottom:25px;color:#b1b1b1;width:100%}.zan-steps--steps .zan-steps__title{-webkit-transform:translateX(-50%);transform:translateX(-50%);font-size:10px;text-align:center}.zan-steps--steps .zan-steps__icons{position:absolute;top:30px;left:-10px;padding:0 8px;background-color:#fff;z-index:10}.zan-steps--steps .zan-steps__circle{display:block;position:relative;width:5px;height:5px;background-color:#e5e5e5;border-radius:50%}.zan-steps--steps .zan-steps__line{position:absolute;left:0;top:32px;width:100%;height:1px;background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--done{color:#333}.zan-steps--steps .zan-steps__step--done .zan-steps__line{background-color:#06bf04}.zan-steps--steps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--steps .zan-steps__step--cur .zan-steps__icons{top:25px;left:-14px}.zan-steps--steps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background-image:url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px}.zan-steps--steps .zan-steps__step--cur .zan-steps__line{background-color:#e5e5e5}.zan-steps--steps .zan-steps__step--first-child .zan-steps__title{margin-left:0;-webkit-transform:none;transform:none;text-align:left}.zan-steps--steps .zan-steps__step--first-child .zan-steps__icons{left:-7px}.zan-steps--steps .zan-steps__step--last-child{position:absolute;right:0;top:0;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__title{-webkit-transform:none;transform:none;text-align:right}.zan-steps--steps .zan-steps__step--last-child .zan-steps__icons{left:auto;right:-6px}.zan-steps--steps .zan-steps__step--last-child .zan-steps__line{display:none}.zan-steps--steps .zan-steps__step--db-title{min-height:29px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__line{top:45px}.zan-steps--steps .zan-steps__step--db-title .zan-steps__icons{top:43px}.zan-steps--steps .zan-steps__step--db-title.zan-steps__step--cur .zan-steps__icons{top:39px}.zan-steps--vsteps{color:#999;font-size:14px}.zan-steps--vsteps .zan-steps__step{position:relative;padding:15px 0}.zan-steps--vsteps .zan-steps__step--done{color:#4b0}.zan-steps--vsteps .zan-steps__line{position:absolute;top:0;bottom:0;left:7px;width:1px;background-color:#e5e5e5}.zan-steps--vsteps .zan-steps__title{display:inline-block;line-height:20px;padding-left:27px}.zan-steps--vsteps .zan-steps__title--desc{padding-left:3px}.zan-steps--vsteps .zan-steps__icons{position:absolute;left:7px;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:2;padding:3px 0;background-color:#fff}.zan-steps--vsteps .zan-steps__circle{width:5px;height:5px;background-color:#e5e5e5;border-radius:10px}.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background:transparent url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px;border-radius:0}.zan-steps--vsteps .zan-steps__icon--active{width:13px;height:13px}.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before{content:'';position:absolute;top:0;bottom:50%;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after{content:'';position:absolute;top:50%;bottom:0;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps{position:relative}

View File

@ -1 +1 @@
.zan-steps--vsteps{color:#999;font-size:14px}.zan-steps--vsteps .zan-steps__step{position:relative;padding:15px 0}.zan-steps--vsteps .zan-steps__step--done{color:#4b0}.zan-steps--vsteps .zan-steps__line{position:absolute;top:0;bottom:0;left:7px;width:1px;background-color:#e5e5e5}.zan-steps--vsteps .zan-steps__title{display:inline-block;line-height:20px;padding-left:27px}.zan-steps--vsteps .zan-steps__title--desc{padding-left:3px}.zan-steps--vsteps .zan-steps__icons{position:absolute;left:7px;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:2;padding:3px 0;background-color:#fff}.zan-steps--vsteps .zan-steps__circle{width:5px;height:5px;background-color:#cacaca;border-radius:10px}.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background:transparent url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px;border-radius:0}.zan-steps--vsteps .zan-steps__icon--active{width:13px;height:13px}.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before{content:'';position:absolute;top:0;bottom:50%;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after{content:'';position:absolute;top:50%;bottom:0;left:7px;width:1px;background-color:#fff;z-index:1}
.zan-steps--vsteps{color:#999;font-size:14px}.zan-steps--vsteps .zan-steps__step{position:relative;padding:15px 0}.zan-steps--vsteps .zan-steps__step--done{color:#4b0}.zan-steps--vsteps .zan-steps__line{position:absolute;top:0;bottom:0;left:7px;width:1px;background-color:#e5e5e5}.zan-steps--vsteps .zan-steps__title{display:inline-block;line-height:20px;padding-left:27px}.zan-steps--vsteps .zan-steps__title--desc{padding-left:3px}.zan-steps--vsteps .zan-steps__icons{position:absolute;left:7px;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:2;padding:3px 0;background-color:#fff}.zan-steps--vsteps .zan-steps__circle{width:5px;height:5px;background-color:#e5e5e5;border-radius:10px}.zan-steps--vsteps .zan-steps__step--done .zan-steps__circle{width:5px;height:5px;background-color:#09bb07}.zan-steps--vsteps .zan-steps__step--cur .zan-steps__circle{width:13px;height:13px;background:transparent url(https://b.yzcdn.cn/v2/image/wap/success_small@2x.png);background-size:13px 13px;border-radius:0}.zan-steps--vsteps .zan-steps__icon--active{width:13px;height:13px}.zan-steps--vsteps .zan-steps__step--first-child .zan-steps__title::before{content:'';position:absolute;top:0;bottom:50%;left:7px;width:1px;background-color:#fff;z-index:1}.zan-steps--vsteps .zan-steps__step--last-child .zan-steps__title::after{content:'';position:absolute;top:50%;bottom:0;left:7px;width:1px;background-color:#fff;z-index:1}

32
dist/toptips/index.js vendored
View File

@ -46,35 +46,9 @@ Component({
this._timer = clearTimeout(this._timer);
this.setData({
isShow: false
isShow: false,
backgroundColor: BG_COLOR
});
}
}
});
function Toptips() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var pages = getCurrentPages();
var ctx = pages[pages.length - 1];
var defaultOptions = {
selector: '#zan-toptips',
duration: 3000
};
options = Object.assign(defaultOptions, parseParam(options));
var $toptips = ctx.selectComponent(options.selector);
delete options.selector;
$toptips.setData(Object.assign({}, options));
$toptips && $toptips.show();
}
function parseParam() {
var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
return typeof params === 'object' ? params : { content: params };
}
module.exports = Toptips;
});

View File

@ -1 +1 @@
<view class="zan-toptips {{ isShow ? 'zan-toptips--show' : '' }}">{{ content }}</view>
<view class="zan-toptips {{ isShow ? 'zan-toptips--show' : '' }}" style="background-color:{{ backgroundColor }}">{{ content }}</view>

28
dist/toptips/toptips.js vendored Normal file
View File

@ -0,0 +1,28 @@
'use strict';
function Toptips() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var pages = getCurrentPages();
var ctx = pages[pages.length - 1];
var defaultOptions = {
selector: '#zan-toptips',
duration: 3000
};
options = Object.assign(defaultOptions, parseParam(options));
var $toptips = ctx.selectComponent(options.selector);
delete options.selector;
$toptips.setData(Object.assign({}, options));
$toptips && $toptips.show();
}
function parseParam() {
var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
return typeof params === 'object' ? params : { content: params };
}
module.exports = Toptips;