1 | ;(function(){
|
2 | (function (global, factory) {
|
3 | if (typeof define === "function" && define.amd) {
|
4 | define(['exports', '../icon', '../_style/global.css', './style/index.css'], factory);
|
5 | } else if (typeof exports !== "undefined") {
|
6 | factory(exports, require('../icon'), require('../_style/global.css'), require('./style/index.css'));
|
7 | } else {
|
8 | var mod = {
|
9 | exports: {}
|
10 | };
|
11 | factory(mod.exports, global.icon, global.global, global.index);
|
12 | global.index = mod.exports;
|
13 | }
|
14 | })(this, function (exports, _icon) {
|
15 | 'use strict';
|
16 |
|
17 | Object.defineProperty(exports, "__esModule", {
|
18 | value: true
|
19 | });
|
20 |
|
21 | var _icon2 = _interopRequireDefault(_icon);
|
22 |
|
23 | function _interopRequireDefault(obj) {
|
24 | return obj && obj.__esModule ? obj : {
|
25 | default: obj
|
26 | };
|
27 | }
|
28 |
|
29 | function _defineProperty(obj, key, value) {
|
30 | if (key in obj) {
|
31 | Object.defineProperty(obj, key, {
|
32 | value: value,
|
33 | enumerable: true,
|
34 | configurable: true,
|
35 | writable: true
|
36 | });
|
37 | } else {
|
38 | obj[key] = value;
|
39 | }
|
40 |
|
41 | return obj;
|
42 | }
|
43 |
|
44 | exports.default = {
|
45 | name: 'md-notice-bar',
|
46 |
|
47 | components: _defineProperty({}, _icon2.default.name, _icon2.default),
|
48 |
|
49 | props: {
|
50 | mode: {
|
51 | type: String,
|
52 | default: ''
|
53 | },
|
54 | type: {
|
55 | type: String,
|
56 | default: 'default' },
|
57 | time: {
|
58 | type: Number,
|
59 | default: 0
|
60 | },
|
61 | round: {
|
62 | type: Boolean,
|
63 | default: false
|
64 | },
|
65 | multiRows: {
|
66 | type: Boolean,
|
67 | default: false
|
68 | },
|
69 | scrollable: {
|
70 | type: Boolean,
|
71 | default: false
|
72 | },
|
73 |
|
74 | icon: {
|
75 | type: String,
|
76 | default: ''
|
77 | },
|
78 | iconSvg: {
|
79 | type: Boolean,
|
80 | default: false
|
81 | },
|
82 |
|
83 | closable: {
|
84 | type: Boolean,
|
85 | default: false
|
86 | }
|
87 | },
|
88 |
|
89 | data: function data() {
|
90 | return {
|
91 | isShow: true,
|
92 | overflow: false
|
93 | };
|
94 | },
|
95 |
|
96 |
|
97 | computed: {
|
98 | customLeft: function customLeft() {
|
99 | return !!this.$slots.left;
|
100 | },
|
101 | customRight: function customRight() {
|
102 | return !!this.$slots.right;
|
103 | },
|
104 | rightIcon: function rightIcon() {
|
105 | return this.mode === 'link' ? 'arrow-right' : 'close';
|
106 | }
|
107 | },
|
108 |
|
109 | updated: function updated() {
|
110 | this.$_checkOverflow();
|
111 | },
|
112 | mounted: function mounted() {
|
113 | if (this.time) {
|
114 | this.$_hide(this.time);
|
115 | }
|
116 | this.$_checkOverflow();
|
117 | },
|
118 |
|
119 |
|
120 | methods: {
|
121 | $_hide: function $_hide(time) {
|
122 | var _this = this;
|
123 |
|
124 | setTimeout(function () {
|
125 | _this.isShow = false;
|
126 | }, time);
|
127 | },
|
128 | $_close: function $_close() {
|
129 | if (this.mode === 'closable' || this.closable) {
|
130 | this.isShow = false;
|
131 | }
|
132 | this.$emit('close');
|
133 | },
|
134 | $_checkOverflow: function $_checkOverflow() {
|
135 | if (!this.scrollable) {
|
136 | return;
|
137 | }
|
138 | var _$refs = this.$refs,
|
139 | wrap = _$refs.wrap,
|
140 | content = _$refs.content;
|
141 |
|
142 | if (!wrap || !content) {
|
143 | return;
|
144 | }
|
145 |
|
146 | var paddingLeft = window.getComputedStyle(content, null).getPropertyValue('padding').split(' ')[3] || '0px';
|
147 | var left = +paddingLeft.match(/\d+/g)[0];
|
148 |
|
149 | this.overflow = content.scrollWidth - left > Math.ceil(wrap.getBoundingClientRect().width);
|
150 | }
|
151 | }
|
152 | };
|
153 | });
|
154 | })()
|
155 | if (module.exports.__esModule) module.exports = module.exports.default
|
156 | var __vue__options__ = (typeof module.exports === "function"? module.exports.options: module.exports)
|
157 | __vue__options__.render = function render () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return (_vm.isShow)?_c('div',{staticClass:"md-notice-bar",class:[
|
158 | _vm.round && 'md-notice-bar-round',
|
159 | _vm.type
|
160 | ]},[_c('div',{staticClass:"md-notice-bar-left",class:[(!_vm.customLeft && !_vm.icon) && 'md-notice-bar-empty']},[(_vm.customLeft)?[_vm._t("left")]:(_vm.icon)?[_c('md-icon',{staticClass:"md-notice-icon",attrs:{"name":_vm.icon,"svg":_vm.iconSvg}})]:_vm._e()],2),_vm._v(" "),_c('div',{ref:"wrap",staticClass:"md-notice-bar-content",class:[
|
161 | _vm.multiRows && 'md-notice-bar-multi-content'
|
162 | ]},[_c('div',{ref:"content",class:[(_vm.overflow && _vm.scrollable) && 'md-notice-bar-content-animate']},[_vm._t("default")],2)]),_vm._v(" "),_c('div',{staticClass:"md-notice-bar-right"},[(_vm.customRight)?[_vm._t("right")]:(_vm.mode || _vm.closable)?[_c('md-icon',{staticClass:"md-notice-icon md-notice-icon-right",attrs:{"name":_vm.rightIcon},nativeOn:{"click":function($event){$event.stopPropagation();return _vm.$_close($event)}}})]:_vm._e()],2)]):_vm._e()}
|
163 | __vue__options__.staticRenderFns = []
|