Blame view

node_modules/element-ui/packages/notification/src/main.js 2.41 KB
2a09d1a4   liuqimichale   添加宜春 天水 宣化
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
  import Vue from 'vue';
  import Main from './main.vue';
  import { PopupManager } from 'element-ui/src/utils/popup';
  import { isVNode } from 'element-ui/src/utils/vdom';
  const NotificationConstructor = Vue.extend(Main);
  
  let instance;
  let instances = [];
  let seed = 1;
  
  const Notification = function(options) {
    if (Vue.prototype.$isServer) return;
    options = options || {};
    const userOnClose = options.onClose;
    const id = 'notification_' + seed++;
    const position = options.position || 'top-right';
  
    options.onClose = function() {
      Notification.close(id, userOnClose);
    };
  
    instance = new NotificationConstructor({
      data: options
    });
  
    if (isVNode(options.message)) {
      instance.$slots.default = [options.message];
      options.message = 'REPLACED_BY_VNODE';
    }
    instance.id = id;
    instance.$mount();
    document.body.appendChild(instance.$el);
    instance.visible = true;
    instance.dom = instance.$el;
    instance.dom.style.zIndex = PopupManager.nextZIndex();
  
    let verticalOffset = options.offset || 0;
    instances.filter(item => item.position === position).forEach(item => {
      verticalOffset += item.$el.offsetHeight + 16;
    });
    verticalOffset += 16;
    instance.verticalOffset = verticalOffset;
    instances.push(instance);
    return instance;
  };
  
  ['success', 'warning', 'info', 'error'].forEach(type => {
    Notification[type] = options => {
      if (typeof options === 'string' || isVNode(options)) {
        options = {
          message: options
        };
      }
      options.type = type;
      return Notification(options);
    };
  });
  
  Notification.close = function(id, userOnClose) {
    let index = -1;
    const len = instances.length;
    const instance = instances.filter((instance, i) => {
      if (instance.id === id) {
        index = i;
        return true;
      }
      return false;
    })[0];
    if (!instance) return;
  
    if (typeof userOnClose === 'function') {
      userOnClose(instance);
    }
    instances.splice(index, 1);
  
    if (len <= 1) return;
    const position = instance.position;
    const removedHeight = instance.dom.offsetHeight;
    for (let i = index; i < len - 1 ; i++) {
      if (instances[i].position === position) {
        instances[i].dom.style[instance.verticalProperty] =
          parseInt(instances[i].dom.style[instance.verticalProperty], 10) - removedHeight - 16 + 'px';
      }
    }
  };
  
  Notification.closeAll = function() {
    for (let i = instances.length - 1; i >= 0; i--) {
      instances[i].close();
    }
  };
  
  export default Notification;