派生自 wuyushui/SewerAndRainNetwork

徐旺旺
2021-04-22 509cc4618a091a03d64d9985c0f1b74afd0fd3ff
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
import layerVue from './layer.vue'
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: '',
    btn: '确定'
  }
  self.instances = {}
  self.instancesVue = []
  self.iframeMinList = []
  let seed = 0
 
  /**
   * [function description]
   * @method function
   * @param  {[type]} options [description]
   * @return {[type]}         [description]
   */
  self.open = function (opt) {
    self.closeAll()
    var options = mergeJson(opt, defOptions)
    const id = `notification_${new Date().getTime()}_${seed++}`
    options.id = id
    options.layer = self
    options.content.content = Vue.extend(options.content.content)
    const instance = new LayerVueExtend({
      data: options
    })
    instance.id = id
    instance.vm = instance.$mount()
    self.instances[id] = {
      inst: instance,
      type: options.type
    }
    document.body.appendChild(instance.vm.$el)
    instance.init()
    self.instancesVue[id] = {
      mask: '',
      main: instance.vm,
      iframe: ''
    }
    return id
  }
 
  /**
   * 关闭一个弹窗
   * @param  {[type]} id [description]
   * @return {[type]}    [description]
   */
  self.close = function (id) {
    const oElm = document.getElementById(id).parentElement
    if (oElm) {
      document.body.removeChild(oElm)
      delete self.instances[id]
      self.instancesVue[id].main.$destroy()
      if (self.instancesVue[id].iframe !== '') {
        const minindex = parseInt(self.instancesVue[id].main.$el.getAttribute('minindex') || -2)
        if (minindex > -1) {
          self.iframeMinList[minindex] = -1
        }
        self.instancesVue[id].iframe.$destroy()
      }
      // 取消隐藏滚动条
      if (!self.instancesVue[id].main.scrollbar) {
        let scrollbarCount = 0
        for (const key in self.instancesVue) {
          if (!self.instancesVue[key].main.scrollbar) {
            scrollbarCount++
          }
        }
        if (scrollbarCount === 1) {
          const htmlDom = document.getElementsByTagName('html')[0]
          htmlDom.style.marginRight = 'auto'
          htmlDom.classList.remove('vl-html-scrollbar-hidden')
        }
      }
      // 控制遮罩,删除掉当前的遮罩
      if (self.instancesVue[id].main.shade) {
        const layerMask = document.getElementById(id + '_mask')
        const maskId = id + '_mask'
        document.body.removeChild(layerMask)
        if (self.instancesVue[maskId]) {
          self.instancesVue[maskId].mask.$destroy()
        }
      }
      delete self.instancesVue[id]
    } else {
      setTimeout(function () {
        const oElm = document.getElementById(id)
        if (oElm) {
          document.body.removeChild(oElm)
          delete self.instances[id]
          self.instancesVue[id].main.$destroy()
          if (self.instancesVue[id].iframe !== '') {
            self.instancesVue[id].iframe.$destroy()
          }
        }
      }, 200)
    }
  }
  /**
   * 关闭一个弹窗
   * @param  {[type]} id [description]
   * @return {[type]}    [description]
   */
  self.closeAll = function () {
    for (const k in self.instances) {
      self.close(k)
    }
  }
  /**
   * 手动最大化
   */
  self.full = function (id = '') {
    document.querySelector('#' + id + ' .lv-icon-max').click()
  }
  /**
   * 手动最小化
   */
  self.min = function (id = '') {
    document.querySelector('#' + id + ' .lv-icon-mini').click()
  }
  /**
   * 手动最小化
   */
  self.restore = function (id = '') {
    document.querySelector('#' + id + ' .lv-icon-huanyuan').click()
  }
 
  /**
   * 合并json
   * @method mergeJson
   * @param  {[type]}  optons [description]
   * @param  {[type]}  def    [description]
   * @return {[type]}         [description]
   */
  function mergeJson (options, def) {
    for (const key in def) {
      if (options[key] === undefined) {
        options[key] = def[key]
      }
    }
    return options
  }
 
  return self
}
 
// module.exports = Notification;
export default Layer