You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
168 lines
3.7 KiB
168 lines
3.7 KiB
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
|
|
exports.__esModule = true;
|
|
exports.default = void 0;
|
|
|
|
var _utils = require("../utils");
|
|
|
|
var _lockClick = require("./lock-click");
|
|
|
|
var _popup = require("../mixins/popup");
|
|
|
|
var _icon = _interopRequireDefault(require("../icon"));
|
|
|
|
var _loading = _interopRequireDefault(require("../loading"));
|
|
|
|
// Utils
|
|
// Mixins
|
|
// Components
|
|
var _createNamespace = (0, _utils.createNamespace)('toast'),
|
|
createComponent = _createNamespace[0],
|
|
bem = _createNamespace[1];
|
|
|
|
var _default = createComponent({
|
|
mixins: [(0, _popup.PopupMixin)()],
|
|
props: {
|
|
icon: String,
|
|
className: null,
|
|
iconPrefix: String,
|
|
loadingType: String,
|
|
forbidClick: Boolean,
|
|
closeOnClick: Boolean,
|
|
message: [Number, String],
|
|
type: {
|
|
type: String,
|
|
default: 'text'
|
|
},
|
|
position: {
|
|
type: String,
|
|
default: 'middle'
|
|
},
|
|
transition: {
|
|
type: String,
|
|
default: 'van-fade'
|
|
},
|
|
lockScroll: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
data: function data() {
|
|
return {
|
|
clickable: false
|
|
};
|
|
},
|
|
mounted: function mounted() {
|
|
this.toggleClickable();
|
|
},
|
|
destroyed: function destroyed() {
|
|
this.toggleClickable();
|
|
},
|
|
watch: {
|
|
value: 'toggleClickable',
|
|
forbidClick: 'toggleClickable'
|
|
},
|
|
methods: {
|
|
onClick: function onClick() {
|
|
if (this.closeOnClick) {
|
|
this.close();
|
|
}
|
|
},
|
|
toggleClickable: function toggleClickable() {
|
|
var clickable = this.value && this.forbidClick;
|
|
|
|
if (this.clickable !== clickable) {
|
|
this.clickable = clickable;
|
|
(0, _lockClick.lockClick)(clickable);
|
|
}
|
|
},
|
|
|
|
/* istanbul ignore next */
|
|
onAfterEnter: function onAfterEnter() {
|
|
this.$emit('opened');
|
|
|
|
if (this.onOpened) {
|
|
this.onOpened();
|
|
}
|
|
},
|
|
onAfterLeave: function onAfterLeave() {
|
|
this.$emit('closed');
|
|
},
|
|
genIcon: function genIcon() {
|
|
var h = this.$createElement;
|
|
var icon = this.icon,
|
|
type = this.type,
|
|
iconPrefix = this.iconPrefix,
|
|
loadingType = this.loadingType;
|
|
var hasIcon = icon || type === 'success' || type === 'fail';
|
|
|
|
if (hasIcon) {
|
|
return h(_icon.default, {
|
|
"class": bem('icon'),
|
|
"attrs": {
|
|
"classPrefix": iconPrefix,
|
|
"name": icon || type
|
|
}
|
|
});
|
|
}
|
|
|
|
if (type === 'loading') {
|
|
return h(_loading.default, {
|
|
"class": bem('loading'),
|
|
"attrs": {
|
|
"type": loadingType
|
|
}
|
|
});
|
|
}
|
|
},
|
|
genMessage: function genMessage() {
|
|
var h = this.$createElement;
|
|
var type = this.type,
|
|
message = this.message;
|
|
|
|
if (!(0, _utils.isDef)(message) || message === '') {
|
|
return;
|
|
}
|
|
|
|
if (type === 'html') {
|
|
return h("div", {
|
|
"class": bem('text'),
|
|
"domProps": {
|
|
"innerHTML": message
|
|
}
|
|
});
|
|
}
|
|
|
|
return h("div", {
|
|
"class": bem('text')
|
|
}, [message]);
|
|
}
|
|
},
|
|
render: function render() {
|
|
var _ref;
|
|
|
|
var h = arguments[0];
|
|
return h("transition", {
|
|
"attrs": {
|
|
"name": this.transition
|
|
},
|
|
"on": {
|
|
"afterEnter": this.onAfterEnter,
|
|
"afterLeave": this.onAfterLeave
|
|
}
|
|
}, [h("div", {
|
|
"directives": [{
|
|
name: "show",
|
|
value: this.value
|
|
}],
|
|
"class": [bem([this.position, (_ref = {}, _ref[this.type] = !this.icon, _ref)]), this.className],
|
|
"on": {
|
|
"click": this.onClick
|
|
}
|
|
}, [this.genIcon(), this.genMessage()])]);
|
|
}
|
|
});
|
|
|
|
exports.default = _default; |