vuejs-loading-screen
Version:
Blocking screen while process worked
310 lines (279 loc) • 9.56 kB
JavaScript
;function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
}
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArrayLimit(arr, i) {
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _s, _e;
try {
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
}
function _unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}
function _arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
return arr2;
}
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var script = {
name: "VueLoading",
data: function data() {
return {
isLoading: false,
options: {
bg: "#41b883ad",
icon: "fas fa-spinner",
size: "3",
icon_color: "#ffffff",
slot: null
}
};
},
methods: {
changeStatus: function changeStatus(isLoading) {
this.isLoading = isLoading;
},
changeIsLoadingOptions: function changeIsLoadingOptions(newOptions) {
var _this = this;
Object.keys(this.options).forEach(function (key) {
if (newOptions[key]) {
_this.options[key] = newOptions[key];
}
});
}
}
};function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
if (typeof shadowMode !== 'boolean') {
createInjectorSSR = createInjector;
createInjector = shadowMode;
shadowMode = false;
}
// Vue.extend constructor export interop.
const options = typeof script === 'function' ? script.options : script;
// render functions
if (template && template.render) {
options.render = template.render;
options.staticRenderFns = template.staticRenderFns;
options._compiled = true;
// functional template
if (isFunctionalTemplate) {
options.functional = true;
}
}
// scopedId
if (scopeId) {
options._scopeId = scopeId;
}
let hook;
if (moduleIdentifier) {
// server build
hook = function (context) {
// 2.3 injection
context =
context || // cached call
(this.$vnode && this.$vnode.ssrContext) || // stateful
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
// 2.2 with runInNewContext: true
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__;
}
// inject component styles
if (style) {
style.call(this, createInjectorSSR(context));
}
// register component module identifier for async chunk inference
if (context && context._registeredComponents) {
context._registeredComponents.add(moduleIdentifier);
}
};
// used by ssr in case component is cached and beforeCreate
// never gets called
options._ssrRegister = hook;
}
else if (style) {
hook = shadowMode
? function (context) {
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
}
: function (context) {
style.call(this, createInjector(context));
};
}
if (hook) {
if (options.functional) {
// register for functional component in vue file
const originalRender = options.render;
options.render = function renderWithStyleInjection(h, context) {
hook.call(context);
return originalRender(h, context);
};
}
else {
// inject component registration as beforeCreate hook
const existing = options.beforeCreate;
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
}
}
return script;
}function createInjectorSSR(context) {
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__;
}
if (!context)
return () => { };
if (!('styles' in context)) {
context._styles = context._styles || {};
Object.defineProperty(context, 'styles', {
enumerable: true,
get: () => context._renderStyles(context._styles)
});
context._renderStyles = context._renderStyles || renderStyles;
}
return (id, style) => addStyle(id, style, context);
}
function addStyle(id, css, context) {
const group = css.media || 'default' ;
const style = context._styles[group] || (context._styles[group] = { ids: [], css: '' });
if (!style.ids.includes(id)) {
style.media = css.media;
style.ids.push(id);
let code = css.source;
style.css += code + '\n';
}
}
function renderStyles(styles) {
let css = '';
for (const key in styles) {
const style = styles[key];
css +=
'<style data-vue-ssr-id="' +
Array.from(style.ids).join(' ') +
'"' +
(style.media ? ' media="' + style.media + '"' : '') +
'>' +
style.css +
'</style>';
}
return css;
}/* script */
var __vue_script__ = script;
/* template */
var __vue_render__ = function __vue_render__() {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c('div', {
directives: [{
name: "show",
rawName: "v-show",
value: _vm.isLoading,
expression: "isLoading"
}],
staticClass: "loading",
style: "background-color: " + _vm.options.bg + ";"
}, [_vm._ssrNode(_vm.options.slot ? "<div data-v-4a0f5a62>" + _vm._s(_vm.options.slot) + "</div>" : "<i" + _vm._ssrClass("fa-spin", _vm.options.icon + " fa-" + _vm.options.size + "x") + _vm._ssrStyle(null, "color: " + _vm.options.icon_color, null) + " data-v-4a0f5a62></i> <span class=\"sr-only\" data-v-4a0f5a62>Loading...</span>")]);
};
var __vue_staticRenderFns__ = [];
/* style */
var __vue_inject_styles__ = function __vue_inject_styles__(inject) {
if (!inject) return;
inject("data-v-4a0f5a62_0", {
source: ".loading[data-v-4a0f5a62]{position:fixed;left:0;top:0;right:0;bottom:0;height:100vh;z-index:99999!important;width:100%;display:flex;align-items:center;justify-content:center}.loading i[data-v-4a0f5a62]{position:absolute;opacity:1}",
map: undefined,
media: undefined
});
};
/* scoped */
var __vue_scope_id__ = "data-v-4a0f5a62";
/* module identifier */
var __vue_module_identifier__ = "data-v-4a0f5a62";
/* functional template */
var __vue_is_functional_template__ = false;
/* style inject shadow dom */
var __vue_component__ = /*#__PURE__*/normalizeComponent({
render: __vue_render__,
staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, createInjectorSSR, undefined);
var Loading = __vue_component__;var plugin = {
install: function install(Vue, options) {
var myPluginVue = Vue.extend(Loading);
Vue.prototype.$isLoading = function (isLoading) {
vm.changeStatus(isLoading);
};
Vue.prototype.$changeIsLoadingOptions = function (newOptions) {
vm.changeIsLoadingOptions(newOptions);
};
var vm = new myPluginVue({
data: function data() {
return {
isLoading: false
};
}
}).$mount();
document.body.appendChild(vm.$el);
if (options) {
Object.keys(options).forEach(function (key) {
if (options[key]) {
vm.options[key] = options[key];
}
});
}
}
};var components=/*#__PURE__*/Object.freeze({__proto__:null,'default':plugin});// only expose one global var, with component exports exposed as properties of
// that global var (eg. plugin.component)
Object.entries(components).forEach(function (_ref) {
var _ref2 = _slicedToArray(_ref, 2),
componentName = _ref2[0],
component = _ref2[1];
if (componentName !== 'default') {
plugin[componentName] = component;
}
});module.exports=plugin;