| | |
| | | import layerVue from './layer.vue' |
| | | const Notification = function (Vue, globalOption = { |
| | | msgtime: 1.5 // msg消失时间 |
| | | }) { |
| | | const NotificationConstructor = Vue.extend(layerVue) |
| | | const Layer = function (Vue) { |
| | | const LayerVueExtend = Vue.extend(layerVue) |
| | | const self = {} |
| | | const defOptions = { |
| | | type: 0, // 0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层),5msg,6prompt |
| | | title: '信息', |
| | | content: '', |
| | | area: 'auto', |
| | | offset: 'auto', |
| | | icon: -1, |
| | | btn: '确定', |
| | | time: 0, |
| | | maxmin: false, // 最大最小化 |
| | | shade: true, |
| | | yes: '', |
| | | cancel: '', |
| | | tips: [0, {}], // 支持上右下左四个方向,通过1-4进行方向设定,可以设定tips: [1, '#c00'] |
| | | tipsMore: false, // 是否允许多个tips |
| | | shadeClose: true, |
| | | scrollbar: true, // 是否允许浏览器出现滚动条:默认是允许 |
| | | resize: false // 是否允许拉伸,默认是不允许 |
| | | btn: '确定' |
| | | } |
| | | self.instances = {} |
| | | self.instancesVue = [] |
| | |
| | | * @param {[type]} options [description] |
| | | * @return {[type]} [description] |
| | | */ |
| | | self.open = function (options) { |
| | | options = mergeJson(options, defOptions) |
| | | self.open = function (opt) { |
| | | /* let option = { |
| | | type: 1, |
| | | content: opt.content, |
| | | area: opt.area |
| | | } */ |
| | | self.closeAll() |
| | | var options = mergeJson(opt, defOptions) |
| | | const id = `notification_${new Date().getTime()}_${seed++}` |
| | | options.id = id |
| | | options.layer = self |
| | | const instance = new NotificationConstructor({ |
| | | options.content.content = Vue.extend(options.content.content) |
| | | const instance = new LayerVueExtend({ |
| | | data: options |
| | | }) |
| | | if (options.type === 1) { |
| | | options.content.content = Vue.extend(options.content.content) |
| | | } |
| | | instance.id = id |
| | | instance.vm = instance.$mount() |
| | | self.instances[id] = { |
| | |
| | | type: options.type |
| | | } |
| | | document.body.appendChild(instance.vm.$el) |
| | | instance.init() |
| | | self.instancesVue[id] = { |
| | | mask: '', |
| | | main: instance.vm, |
| | |
| | | } |
| | | return id |
| | | } |
| | | /** |
| | | * [description] |
| | | * @param {[type]} options [description] |
| | | * @return {[type]} [description] |
| | | */ |
| | | self.iframe = function (opt) { |
| | | let option = { |
| | | type: 1, |
| | | content: opt.content, |
| | | area: opt.area |
| | | } |
| | | option = mergeJson(option, opt) |
| | | console.log(option) |
| | | return self.open(option) |
| | | } |
| | | |
| | | /** |
| | | * 关闭一个弹窗 |
| | | * @param {[type]} id [description] |
| | | * @return {[type]} [description] |
| | | */ |
| | | self.close = function (id) { |
| | | const oElm = document.getElementById(id) |
| | | const oElm = document.getElementById(id).parentElement |
| | | if (oElm) { |
| | | document.body.removeChild(oElm) |
| | | delete self.instances[id] |
| | |
| | | * @param {[type]} id [description] |
| | | * @return {[type]} [description] |
| | | */ |
| | | self.closeAll = function (type = -1) { |
| | | const types = { |
| | | page: 0, |
| | | iframe: 1 |
| | | } |
| | | if (type === -1) { |
| | | for (const k in self.instances) { |
| | | self.close(k) |
| | | } |
| | | } else { |
| | | const targetType = types[type] |
| | | for (const k in self.instances) { |
| | | if (self.instances[k].type === targetType) { |
| | | self.close(k) |
| | | } |
| | | } |
| | | self.closeAll = function () { |
| | | for (const k in self.instances) { |
| | | self.close(k) |
| | | } |
| | | } |
| | | /** |
| | |
| | | } |
| | | |
| | | // module.exports = Notification; |
| | | export default Notification |
| | | export default Layer |