提交 e0385a20 编写于 作者: fxy060608's avatar fxy060608

Merge branch 'dev' of https://github.com/dcloudio/uni-app into v3

......@@ -24,6 +24,7 @@ module.exports = {
transpileDependencies: [],
productionSourceMap: false,
configureWebpack: webpackConfig,
parallel: process.env.UNI_PLATFORM !== 'h5' || process.env.UNI_WATCH !== 'false' || process.env.UNI_UI === 'true',
chainWebpack: config => {
config.devtool('source-map')
......
......@@ -880,11 +880,6 @@ uni-picker-view[hidden] {
}
uni-picker {
display: block;
}
uni-progress {
display: -webkit-flex;
display: -webkit-box;
......
......@@ -10532,262 +10532,8 @@ function processTouches(target, touches) {
/***/ }),
/* 27 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(UniViewJSBridge) {/* harmony import */ var uni_mixins__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
//
//
//
//
//
//
//
//
var _UniViewJSBridge = UniViewJSBridge,
subscribe = _UniViewJSBridge.subscribe,
unsubscribe = _UniViewJSBridge.unsubscribe,
publishHandler = _UniViewJSBridge.publishHandler;
var mode = {
SELECTOR: 'selector',
MULTISELECTOR: 'multiSelector',
TIME: 'time',
DATE: 'date' // 暂不支持城市选择
// REGION: 'region'
};
var fields = {
YEAR: 'year',
MONTH: 'month',
DAY: 'day'
};
/* harmony default export */ __webpack_exports__["a"] = ({
name: 'Picker',
mixins: [uni_mixins__WEBPACK_IMPORTED_MODULE_0__[/* emitter */ "a"]],
props: {
name: {
type: String,
default: ''
},
range: {
type: Array,
default: function _default() {
return [];
}
},
rangeKey: {
type: String,
default: ''
},
value: {
type: [Number, String, Array],
default: 0
},
mode: {
type: String,
default: mode.SELECTOR,
validator: function validator(val) {
return Object.values(mode).indexOf(val) >= 0;
}
},
fields: {
type: String,
default: 'day',
validator: function validator(val) {
return Object.values(fields).indexOf(val) >= 0;
}
},
start: {
type: String,
default: function _default() {
if (this.mode === mode.TIME) {
return '00:00';
}
if (this.mode === mode.DATE) {
var year = new Date().getFullYear() - 100;
switch (this.fields) {
case fields.YEAR:
return year;
case fields.MONTH:
return year + '-01';
case fields.DAY:
return year + '-01-01';
}
}
return '';
}
},
end: {
type: String,
default: function _default() {
if (this.mode === mode.TIME) {
return '23:59';
}
if (this.mode === mode.DATE) {
var year = new Date().getFullYear() + 100;
switch (this.fields) {
case fields.YEAR:
return year;
case fields.MONTH:
return year + '-12';
case fields.DAY:
return year + '-12-31';
}
}
return '';
}
},
disabled: {
type: [Boolean, String],
default: false
}
},
data: function data() {
return {
valueSync: this.value || 0,
visible: false,
valueChangeSource: ''
};
},
watch: {
value: function value(val) {
var _this = this;
if (Array.isArray(val)) {
if (!Array.isArray(this.valueSync)) {
this.valueSync = [];
}
this.valueSync.length = val.length;
val.forEach(function (val, index) {
if (val !== _this.valueSync[index]) {
_this.$set(_this.valueSync, index, val);
}
});
} else if (_typeof(val) !== 'object') {
this.valueSync = val;
}
},
valueSync: function valueSync(val) {
if (!this.valueChangeSource) {
this._show();
} else {
this.$emit('update:value', val);
}
}
},
created: function created() {
var _this2 = this;
this.$dispatch('Form', 'uni-form-group-update', {
type: 'add',
vm: this
});
Object.keys(this.$props).forEach(function (key) {
if (key !== 'value' && key !== 'name') {
_this2.$watch(key, _this2._show);
}
});
},
beforeDestroy: function beforeDestroy() {
this.$dispatch('Form', 'uni-form-group-update', {
type: 'remove',
vm: this
});
},
destroyed: function destroyed() {
if (this.visible) {
var id = this.$page.id;
publishHandler('hidePicker', {}, id);
}
},
methods: {
_click: function _click() {
if (this.disabled) {
return;
}
var id = this.$page.id;
subscribe("".concat(id, "-picker-change"), this.change);
subscribe("".concat(id, "-picker-columnchange"), this.columnchange);
subscribe("".concat(id, "-picker-cancel"), this.cancel);
this.visible = true;
this._show();
},
_show: function _show() {
if (this.visible) {
var id = this.$page.id;
var options = Object.assign({}, this.$props);
options.value = this.valueSync;
publishHandler('showPicker', options, id);
}
},
change: function change(args) {
this.visible = false;
var id = this.$page.id;
unsubscribe("".concat(id, "-picker-change"));
unsubscribe("".concat(id, "-picker-columnchange"));
unsubscribe("".concat(id, "-picker-cancel"));
if (!this.disabled) {
this.valueChangeSource = 'click';
var value = args.value;
this.valueSync = Array.isArray(value) ? value.map(function (val) {
return val;
}) : value;
this.$trigger('change', {}, {
value: value
});
}
},
columnchange: function columnchange(args) {
this.$trigger('columnchange', {}, args);
},
cancel: function cancel(args) {
this.visible = false;
var id = this.$page.id;
unsubscribe("".concat(id, "-picker-change"));
unsubscribe("".concat(id, "-picker-columnchange"));
unsubscribe("".concat(id, "-picker-cancel"));
this.$trigger('cancel', {}, {});
},
_getFormData: function _getFormData() {
return {
value: this.valueSync,
key: this.name
};
},
_resetFormData: function _resetFormData() {
this.valueSync = '';
}
}
});
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(3)))
/***/ }),
/* 28 */
/***/ (function(module, exports, __webpack_require__) {
// extracted by mini-css-extract-plugin
if(false) { var cssReload; }
/***/ }),
/* 27 */,
/* 28 */,
/* 29 */
/***/ (function(module, exports, __webpack_require__) {
......@@ -12076,7 +11822,7 @@ function destroyComponentObserver(_ref2) {
/* 49 */
/***/ (function(module, exports) {
module.exports = ['uni-app', 'uni-tabbar', 'uni-page', 'uni-page-head', 'uni-page-wrapper', 'uni-page-body', 'uni-page-refresh', 'uni-actionsheet', 'uni-modal', 'uni-picker', 'uni-toast', 'uni-resize-sensor', 'uni-ad', 'uni-audio', 'uni-button', 'uni-camera', 'uni-canvas', 'uni-checkbox', 'uni-checkbox-group', 'uni-cover-image', 'uni-cover-view', 'uni-form', 'uni-functional-page-navigator', 'uni-icon', 'uni-image', 'uni-input', 'uni-label', 'uni-live-player', 'uni-live-pusher', 'uni-map', 'uni-movable-area', 'uni-movable-view', 'uni-navigator', 'uni-official-account', 'uni-open-data', 'uni-picker', 'uni-picker-view', 'uni-picker-view-column', 'uni-progress', 'uni-radio', 'uni-radio-group', 'uni-rich-text', 'uni-scroll-view', 'uni-slider', 'uni-swiper', 'uni-swiper-item', 'uni-switch', 'uni-text', 'uni-textarea', 'uni-video', 'uni-view', 'uni-web-view'];
module.exports = ['uni-app', 'uni-tabbar', 'uni-page', 'uni-page-head', 'uni-page-wrapper', 'uni-page-body', 'uni-page-refresh', 'uni-actionsheet', 'uni-modal', 'uni-toast', 'uni-resize-sensor', 'uni-ad', 'uni-audio', 'uni-button', 'uni-camera', 'uni-canvas', 'uni-checkbox', 'uni-checkbox-group', 'uni-cover-image', 'uni-cover-view', 'uni-form', 'uni-functional-page-navigator', 'uni-icon', 'uni-image', 'uni-input', 'uni-label', 'uni-live-player', 'uni-live-pusher', 'uni-map', 'uni-movable-area', 'uni-movable-view', 'uni-navigator', 'uni-official-account', 'uni-open-data', 'uni-picker', 'uni-picker-view', 'uni-picker-view-column', 'uni-progress', 'uni-radio', 'uni-radio-group', 'uni-rich-text', 'uni-scroll-view', 'uni-slider', 'uni-swiper', 'uni-swiper-item', 'uni-switch', 'uni-text', 'uni-textarea', 'uni-video', 'uni-view', 'uni-web-view'];
/***/ }),
/* 50 */
......@@ -14294,7 +14040,6 @@ var map = {
"./navigator/index.vue": 95,
"./picker-view-column/index.vue": 119,
"./picker-view/index.vue": 117,
"./picker/index.vue": 113,
"./progress/index.vue": 108,
"./radio-group/index.vue": 107,
"./radio/index.vue": 105,
......@@ -14452,16 +14197,7 @@ webpackContext.id = 66;
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/* 79 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var _node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(28);
/* harmony import */ var _node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0__);
/* unused harmony reexport * */
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_vue_cli_service_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_vue_cli_service_node_modules_css_loader_index_js_ref_6_oneOf_1_1_node_modules_vue_cli_service_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_vue_cli_service_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_cli_service_node_modules_vue_loader_lib_index_js_vue_loader_options_index_vue_vue_type_style_index_0_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/* 79 */,
/* 80 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
......@@ -20229,73 +19965,7 @@ component.options.__file = "src/core/view/components/label/index.vue"
/* harmony default export */ var label = __webpack_exports__["default"] = (component.exports);
/***/ }),
/* 113 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"70784d34-vue-loader-template"}!./node_modules/@vue/cli-service/node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/core/view/components/picker/index.vue?vue&type=template&id=bcf74e32&
var render = function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c(
"uni-picker",
{
on: {
click: function($event) {
$event.stopPropagation()
return _vm._click($event)
}
}
},
[_c("div", [_vm._t("default")], 2)]
)
}
var staticRenderFns = []
render._withStripped = true
// CONCATENATED MODULE: ./src/core/view/components/picker/index.vue?vue&type=template&id=bcf74e32&
// EXTERNAL MODULE: ./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/@vue/cli-plugin-babel/node_modules/babel-loader/lib!./node_modules/@vue/cli-service/node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/@vue/cli-service/node_modules/vue-loader/lib??vue-loader-options!./src/core/view/components/picker/index.vue?vue&type=script&lang=js&
var pickervue_type_script_lang_js_ = __webpack_require__(27);
// CONCATENATED MODULE: ./src/core/view/components/picker/index.vue?vue&type=script&lang=js&
/* harmony default export */ var components_pickervue_type_script_lang_js_ = (pickervue_type_script_lang_js_["a" /* default */]);
// EXTERNAL MODULE: ./src/core/view/components/picker/index.vue?vue&type=style&index=0&lang=css&
var pickervue_type_style_index_0_lang_css_ = __webpack_require__(79);
// EXTERNAL MODULE: ./node_modules/@vue/cli-service/node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(0);
// CONCATENATED MODULE: ./src/core/view/components/picker/index.vue
/* normalize component */
var component = Object(componentNormalizer["a" /* default */])(
components_pickervue_type_script_lang_js_,
render,
staticRenderFns,
false,
null,
null,
null
)
/* hot reload */
if (false) { var api; }
component.options.__file = "src/core/view/components/picker/index.vue"
/* harmony default export */ var picker = __webpack_exports__["default"] = (component.exports);
/***/ }),
/* 113 */,
/* 114 */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
......
......@@ -699,7 +699,7 @@ class Stat extends Util {
super();
this.instance = null;
// 注册拦截器
if (typeof uni.addInterceptor === 'function') {
if (typeof uni.addInterceptor === 'function' && process.env.NODE_ENV !== 'development') {
this.addInterceptorInit();
this.interceptLogin();
this.interceptShare(true);
......
......@@ -431,7 +431,7 @@ class Stat extends Util {
super()
this.instance = null;
// 注册拦截器
if (typeof uni.addInterceptor === 'function') {
if (typeof uni.addInterceptor === 'function' && process.env.NODE_ENV !== 'development') {
this.addInterceptorInit();
this.interceptLogin();
this.interceptShare(true);
......
......@@ -6,16 +6,26 @@ const {
capitalize
} = require('./util')
const platformTags = ['audio', 'map', 'video', 'web-view', 'cover-view', 'cover-image']
const platformTags = ['audio', 'map', 'video', 'web-view', 'cover-view', 'cover-image', 'picker']
//input 在 pageHead 中有使用,resize-sensor 在很多组件中有使用,暂时直接加载
const autoloadTags = ['input', 'resize-sensor']
const autoloadTags = {
// input 在 pageHead 中有使用,resize-sensor 在很多组件中有使用,暂时直接加载
root: ['input', 'resize-sensor'],
other: {
picker: ['picker-view', 'picker-view-column']
}
}
module.exports = function updateComponents(tags) {
autoloadTags.forEach(tagName => {
autoloadTags.root.forEach(tagName => {
tags.add(tagName)
})
tags = [...tags]
Object.keys(autoloadTags.other).forEach(tagName => {
if (tags.includes(tagName)) {
tags.push(...autoloadTags.other[tagName])
}
})
const importsStr = tags.map(tagName => {
if (platformTags.indexOf(tagName) !== -1) {
return `import ${capitalize(camelize(tagName))} from 'uni-platform/view/components/${tagName}'`
......
......@@ -93,8 +93,8 @@ const getPageComponents = function (inputDir, pagesJson) {
let windowTop = 44
let pageStyle = Object.assign({}, globalStyle, props)
if (pageStyle.navigationStyle === 'custom' || (props.titleNView && props.titleNView.type ===
'transparent')) {
if (pageStyle.navigationStyle === 'custom' || !pageStyle.titleNView || pageStyle.titleNView.type ===
'transparent' || pageStyle.titleNView.type === 'float') {
windowTop = 0
}
......
......@@ -8,7 +8,6 @@ module.exports = [
'uni-page-refresh',
'uni-actionsheet',
'uni-modal',
'uni-picker',
'uni-toast',
'uni-resize-sensor',
......
<template>
<uni-picker @click.stop="_click">
<div>
<slot/>
</div>
</uni-picker>
</template>
<script>
import {
emitter
} from 'uni-mixins'
const {
subscribe,
unsubscribe,
publishHandler
} = UniViewJSBridge
const mode = {
SELECTOR: 'selector',
MULTISELECTOR: 'multiSelector',
TIME: 'time',
DATE: 'date'
// 暂不支持城市选择
// REGION: 'region'
}
const fields = {
YEAR: 'year',
MONTH: 'month',
DAY: 'day'
}
export default {
name: 'Picker',
mixins: [emitter],
props: {
name: {
type: String,
default: ''
},
range: {
type: Array,
default () {
return []
}
},
rangeKey: {
type: String,
default: ''
},
value: {
type: [Number, String, Array],
default: 0
},
mode: {
type: String,
default: mode.SELECTOR,
validator (val) {
return Object.values(mode).indexOf(val) >= 0
}
},
fields: {
type: String,
default: 'day',
validator (val) {
return Object.values(fields).indexOf(val) >= 0
}
},
start: {
type: String,
default () {
if (this.mode === mode.TIME) {
return '00:00'
}
if (this.mode === mode.DATE) {
let year = (new Date()).getFullYear() - 100
switch (this.fields) {
case fields.YEAR:
return year
case fields.MONTH:
return year + '-01'
case fields.DAY:
return year + '-01-01'
}
}
return ''
}
},
end: {
type: String,
default () {
if (this.mode === mode.TIME) {
return '23:59'
}
if (this.mode === mode.DATE) {
let year = (new Date()).getFullYear() + 100
switch (this.fields) {
case fields.YEAR:
return year
case fields.MONTH:
return year + '-12'
case fields.DAY:
return year + '-12-31'
}
}
return ''
}
},
disabled: {
type: [Boolean, String],
default: false
}
},
data () {
return {
valueSync: this.value || 0,
visible: false,
valueChangeSource: ''
}
},
watch: {
value (val) {
if (Array.isArray(val)) {
if (!Array.isArray(this.valueSync)) {
this.valueSync = []
}
this.valueSync.length = val.length
val.forEach((val, index) => {
if (val !== this.valueSync[index]) {
this.$set(this.valueSync, index, val)
}
})
} else if (typeof val !== 'object') {
this.valueSync = val
}
},
valueSync (val) {
if (!this.valueChangeSource) {
this._show()
} else {
this.$emit('update:value', val)
}
}
},
created () {
this.$dispatch('Form', 'uni-form-group-update', {
type: 'add',
vm: this
})
Object.keys(this.$props).forEach(key => {
if (key !== 'value' && key !== 'name') {
this.$watch(key, this._show)
}
})
},
beforeDestroy () {
this.$dispatch('Form', 'uni-form-group-update', {
type: 'remove',
vm: this
})
},
destroyed () {
if (this.visible) {
const id = this.$page.id
publishHandler('hidePicker', {}, id)
}
},
methods: {
_click () {
if (this.disabled) {
return
}
const id = this.$page.id
subscribe(`${id}-picker-change`, this.change)
subscribe(`${id}-picker-columnchange`, this.columnchange)
subscribe(`${id}-picker-cancel`, this.cancel)
this.visible = true
this._show()
},
_show () {
if (this.visible) {
const id = this.$page.id
let options = Object.assign({}, this.$props)
options.value = this.valueSync
publishHandler('showPicker', options, id)
}
},
change (args) {
this.visible = false
const id = this.$page.id
unsubscribe(`${id}-picker-change`)
unsubscribe(`${id}-picker-columnchange`)
unsubscribe(`${id}-picker-cancel`)
if (!this.disabled) {
this.valueChangeSource = 'click'
let value = args.value
this.valueSync = Array.isArray(value) ? value.map(val => val) : value
this.$trigger('change', {}, {
value
})
}
},
columnchange (args) {
this.$trigger('columnchange', {}, args)
},
cancel (args) {
this.visible = false
const id = this.$page.id
unsubscribe(`${id}-picker-change`)
unsubscribe(`${id}-picker-columnchange`)
unsubscribe(`${id}-picker-cancel`)
this.$trigger('cancel', {}, {})
},
_getFormData () {
return {
value: this.valueSync,
key: this.name
}
},
_resetFormData () {
this.valueSync = ''
}
}
}
</script>
<style>
uni-picker {
display: block;
}
</style>
......@@ -21,10 +21,6 @@
v-if="$options.components.Modal"
v-bind="showModal"
@close="_onModalClose" />
<picker
v-if="$options.components.Picker"
v-bind="showPicker"
@close="_onPickerClose" />
</uni-app>
</template>
<script>
......
import Toast from './toast'
import Modal from './modal'
import Picker from './picker'
import ActionSheet from './actionSheet'
export default {
Toast,
Modal,
Picker,
ActionSheet
}
const defaultProps = {
visible: false,
mode: '',
range: [],
rangeKey: '',
value: '',
disabled: false,
start: '',
end: '',
fields: 'day',
customItem: ''
}
export default {
data () {
return {
showPicker: {
visible: false
}
}
},
created () {
// 订阅 View 层的 showPicker 事件
UniServiceJSBridge.subscribe('showPicker', (args, pageId) => {
// 根据不同参数,渲染不同类型 picker(注意全局仅一个 picker 组件对象,每次 showPicker 需传入当前类型 picker 的完整参数)
this.showPicker = Object.assign(defaultProps, args, {
pageId,
visible: true
})
})
// 订阅 View 层的 hidePicker 事件
UniServiceJSBridge.subscribe('hidePicker', () => {
this._onPickerClose()
})
// 订阅页面返回跳转时触发的 uni.onHidePopup 事件,隐藏 picker
UniServiceJSBridge.on('onHidePopup', () => {
this._onPickerClose()
})
},
methods: {
// 处理 Picker close 回调
_onPickerClose () {
// 隐藏 picker 重置数据
this.showPicker.visible = false
this.showPicker.mode = 'selector'
this.showPicker.range = []
this.showPicker.value = 0
}
}
}
<template>
<uni-picker @touchmove.prevent>
<uni-picker @click.stop="_show">
<div
ref="picker"
class="uni-picker-container"
@touchmove.prevent>
<transition name="uni-fade">
<div
v-show="visible"
class="uni-mask"
@click="_cancel"/>
@click="_cancel" />
</transition>
<div
:class="{'uni-picker-toggle':visible}"
......@@ -38,19 +42,24 @@
<div v-for="(item,index) in units" :key="index">{{item}}</div>
</div>-->
</div>
</div>
<div>
<slot />
</div>
</uni-picker>
</template>
<script>
import {
formatDateTime
} from 'uni-shared'
import { emitter } from 'uni-mixins'
import { formatDateTime } from 'uni-shared'
const mode = {
SELECTOR: 'selector',
MULTISELECTOR: 'multiSelector',
TIME: 'time',
DATE: 'date',
REGION: 'region'
DATE: 'date'
// 暂不支持城市选择
// REGION: 'region'
}
const fields = {
YEAR: 'year',
......@@ -59,10 +68,11 @@ const fields = {
}
export default {
name: 'Picker',
mixins: [emitter],
props: {
pageId: {
type: Number,
default: 0
name: {
type: String,
default: ''
},
range: {
type: Array,
......@@ -80,11 +90,17 @@ export default {
},
mode: {
type: String,
default: mode.SELECTOR
default: mode.SELECTOR,
validator (val) {
return Object.values(mode).indexOf(val) >= 0
}
},
fields: {
type: String,
default: fields.DAY
default: 'day',
validator (val) {
return Object.values(fields).indexOf(val) >= 0
}
},
start: {
type: String,
......@@ -93,7 +109,7 @@ export default {
return '00:00'
}
if (this.mode === mode.DATE) {
let year = (new Date()).getFullYear() - 150
let year = new Date().getFullYear() - 100
switch (this.fields) {
case fields.YEAR:
return year
......@@ -113,7 +129,7 @@ export default {
return '23:59'
}
if (this.mode === mode.DATE) {
let year = (new Date()).getFullYear() + 150
let year = new Date().getFullYear() + 100
switch (this.fields) {
case fields.YEAR:
return year
......@@ -129,14 +145,13 @@ export default {
disabled: {
type: [Boolean, String],
default: false
},
visible: {
type: Boolean,
default: false
}
},
data () {
return {
valueSync: this.value || 0,
visible: false,
valueChangeSource: '',
timeArray: [],
dateArray: [],
valueArray: [],
......@@ -199,9 +214,36 @@ export default {
}
},
watch: {
value (val) {
if (Array.isArray(val)) {
if (!Array.isArray(this.valueSync)) {
this.valueSync = []
}
this.valueSync.length = val.length
val.forEach((val, index) => {
if (val !== this.valueSync[index]) {
this.$set(this.valueSync, index, val)
}
})
} else if (typeof val !== 'object') {
this.valueSync = val
}
},
valueSync (value) {
if (this.valueChangeSource) {
this.$trigger(
'change',
{},
{
value
}
)
}
},
valueArray (val) {
if (this.mode === mode.TIME || this.mode === mode.DATE) {
let getValue = this.mode === mode.TIME ? this._getTimeValue : this._getDateValue
let getValue =
this.mode === mode.TIME ? this._getTimeValue : this._getDateValue
let valueArray = this.valueArray
let startArray = this.startArray
let endArray = this.endArray
......@@ -209,7 +251,11 @@ export default {
const dateArray = this.dateArray
let max = dateArray[2].length
let day = dateArray[2][valueArray[2]]
let realDay = new Date(`${dateArray[0][valueArray[0]]}/${dateArray[1][valueArray[1]]}/${day}`).getDate()
let realDay = new Date(
`${dateArray[0][valueArray[0]]}/${
dateArray[1][valueArray[1]]
}/${day}`
).getDate()
day = Number(day)
if (realDay < day) {
valueArray[2] -= realDay + max - day
......@@ -225,29 +271,56 @@ export default {
if (value !== this.oldValueArray[column]) {
this.oldValueArray[column] = value
if (this.mode === mode.MULTISELECTOR) {
// 触发 View 层 columnchange 事件
UniServiceJSBridge.publishHandler(this.pageId + '-picker-columnchange', {
this.$trigger('columnchange', {}, {
column,
value
}, this.pageId)
}
)
}
})
},
visible (val) {
if (!val) {
this.$nextTick(() => this._setValue())
}
})
}
},
created () {
this.$dispatch('Form', 'uni-form-group-update', {
type: 'add',
vm: this
})
this._createTime()
this._createDate()
this._setValue()
this.$watch('value', this._setValue)
this.$watch('valueSync', this._setValue)
this.$watch('mode', this._setValue)
},
beforeDestroy () {
this.$dispatch('Form', 'uni-form-group-update', {
type: 'remove',
vm: this
})
},
methods: {
_show () {
if (this.disabled) {
return
}
this.valueChangeSource = ''
this._setValue()
var $picker = this.$refs.picker
$picker.remove();
(document.querySelector('uni-app') || document.body).append($picker)
$picker.style.display = 'block'
setTimeout(() => {
this.visible = true
}, 20)
},
_getFormData () {
return {
value: this.valueSync,
key: this.name
}
},
_resetFormData () {
this.valueSync = ''
},
_createTime () {
var hours = []
var minutes = []
......@@ -263,7 +336,7 @@ export default {
},
_createDate () {
var years = []
var year = (new Date()).getFullYear()
var year = new Date().getFullYear()
for (let i = year - 150, end = year + 150; i <= end; i++) {
years.push(String(i))
}
......@@ -292,7 +365,7 @@ export default {
}
},
_setValue () {
var val = this.value
var val = this.valueSync
var valueArray
switch (this.mode) {
case mode.SELECTOR:
......@@ -308,7 +381,9 @@ export default {
mode: mode.TIME
})
}
valueArray = val.split(':').map((val, i) => this.timeArray[i].indexOf(val))
valueArray = val
.split(':')
.map((val, i) => this.timeArray[i].indexOf(val))
break
case mode.DATE:
// 处理默认值为当前日期
......@@ -317,7 +392,9 @@ export default {
mode: mode.DATE
})
}
valueArray = val.split('-').map((val, i) => this.dateArray[i].indexOf(val))
valueArray = val
.split('-')
.map((val, i) => this.dateArray[i].indexOf(val))
break
}
this.oldValueArray = [...valueArray]
......@@ -331,38 +408,60 @@ export default {
case mode.MULTISELECTOR:
return val.map(val => val)
case mode.TIME:
return this.valueArray.map((val, i) => this.timeArray[i][val]).join(':')
return this.valueArray
.map((val, i) => this.timeArray[i][val])
.join(':')
case mode.DATE:
return this.valueArray.map((val, i) => this.dateArray[i][val]).join('-')
return this.valueArray
.map((val, i) => this.dateArray[i][val])
.join('-')
}
},
_change () {
this.$emit('close')
// 触发 View 层 change 事件
UniServiceJSBridge.publishHandler(this.pageId + '-picker-change', {
value: this._getValue()
}, this.pageId)
this._close()
this.valueChangeSource = 'click'
let value = this._getValue()
this.valueSync = Array.isArray(value) ? value.map(val => val) : value
},
_cancel () {
// 通知父组件修改 visible
this.$emit('close')
// 触发 View 层 cancel 事件
UniServiceJSBridge.publishHandler(this.pageId + '-picker-cancel', {}, this.pageId)
this._close()
this.$trigger('cancel', {}, {})
},
_close () {
this.visible = false
setTimeout(() => {
var $picker = this.$refs.picker
$picker.remove()
this.$el.prepend($picker)
$picker.style.display = 'none'
}, 260)
}
}
}
</script>
<style>
uni-picker {
display: block;
}
.uni-picker-container {
display: none;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
box-sizing: border-box;
z-index: 999;
font-size: 16px;
}
uni-picker .uni-picker * {
.uni-picker-container .uni-picker * {
box-sizing: border-box;
}
uni-picker .uni-picker {
.uni-picker-container .uni-picker {
position: fixed;
left: 0;
bottom: 0;
......@@ -375,12 +474,12 @@ uni-picker .uni-picker {
transition: transform 0.3s, visibility 0.3s;
}
uni-picker .uni-picker.uni-picker-toggle {
.uni-picker-container .uni-picker.uni-picker-toggle {
visibility: visible;
transform: translate(0, 0);
}
uni-picker .uni-picker-content {
.uni-picker-container .uni-picker-content {
position: relative;
display: block;
width: 100%;
......@@ -388,7 +487,7 @@ uni-picker .uni-picker-content {
background-color: white;
}
uni-picker .uni-picker-item {
.uni-picker-container .uni-picker-item {
padding: 0;
height: 34px;
line-height: 34px;
......@@ -399,7 +498,7 @@ uni-picker .uni-picker-item {
overflow: hidden;
}
uni-picker .uni-picker-header {
.uni-picker-container .uni-picker-header {
display: block;
position: relative;
text-align: center;
......@@ -408,7 +507,7 @@ uni-picker .uni-picker-header {
background-color: #fff;
}
uni-picker .uni-picker-header:after {
.uni-picker-container .uni-picker-header:after {
content: "";
position: absolute;
left: 0;
......@@ -422,7 +521,7 @@ uni-picker .uni-picker-header:after {
transform: scaleY(0.5);
}
uni-picker .uni-picker-action {
.uni-picker-container .uni-picker-action {
display: block;
max-width: 50%;
top: 0;
......@@ -434,12 +533,12 @@ uni-picker .uni-picker-action {
overflow: hidden;
}
uni-picker .uni-picker-action.uni-picker-action-cancel {
.uni-picker-container .uni-picker-action.uni-picker-action-cancel {
float: left;
color: #888;
}
uni-picker .uni-picker-action.uni-picker-action-confirm {
.uni-picker-container .uni-picker-action.uni-picker-action-confirm {
float: right;
color: #007aff;
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册