@lambo-design/shared 1.0.0-beta.240 → 1.0.0-beta.241

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (171) hide show
  1. package/config/config.js +51 -51
  2. package/config/env.js +4 -4
  3. package/config/index.js +7 -7
  4. package/config/themes/atrovirens/atrovirens.less +667 -667
  5. package/config/themes/atrovirens/var.less +674 -674
  6. package/config/themes/blue/blue.less +669 -669
  7. package/config/themes/blue/var.less +677 -677
  8. package/config/themes/blue-white/blue-white.less +669 -669
  9. package/config/themes/blue-white/var.less +676 -676
  10. package/config/themes/blue-white-tight/blue-white-tight.less +672 -672
  11. package/config/themes/blue-white-tight/var.less +677 -677
  12. package/config/themes/danqing/danqing.less +668 -668
  13. package/config/themes/danqing/danqing.wxss +572 -572
  14. package/config/themes/danqing/var.less +679 -679
  15. package/config/themes/deep/deep.less +669 -669
  16. package/config/themes/deep/var.less +677 -677
  17. package/config/themes/default/default.less +671 -671
  18. package/config/themes/default/var.less +677 -677
  19. package/config/themes/eap/eap.less +671 -671
  20. package/config/themes/eap/var.less +677 -677
  21. package/config/themes/gold/gold.less +671 -671
  22. package/config/themes/gold/var.less +677 -677
  23. package/config/themes/index.js +28 -28
  24. package/config/themes/lime/lime.less +671 -671
  25. package/config/themes/lime/var.less +678 -678
  26. package/config/themes/orange/orange.less +671 -671
  27. package/config/themes/orange/var.less +678 -678
  28. package/config/themes/red/red.less +671 -671
  29. package/config/themes/red/var.less +677 -677
  30. package/config/themes/theme-atrovirens.js +558 -558
  31. package/config/themes/theme-blue.js +558 -558
  32. package/config/themes/theme-bw.js +558 -558
  33. package/config/themes/theme-bwt.js +559 -559
  34. package/config/themes/theme-danqing.js +558 -558
  35. package/config/themes/theme-deep.js +558 -558
  36. package/config/themes/theme-default.js +558 -558
  37. package/config/themes/theme-eap.js +558 -558
  38. package/config/themes/theme-gold.js +558 -558
  39. package/config/themes/theme-lime.js +558 -558
  40. package/config/themes/theme-orange.js +559 -559
  41. package/config/themes/theme-red.js +558 -558
  42. package/config/themes/theme-white.js +557 -557
  43. package/config/themes/white/var.less +675 -675
  44. package/config/themes/white/white.less +668 -668
  45. package/directives/index.js +23 -23
  46. package/directives/module/draggable.js +56 -56
  47. package/directives/module/permission.js +49 -49
  48. package/directives/module/print.js +1 -1
  49. package/directives/module/vue-print-nb/README.md +63 -63
  50. package/directives/module/vue-print-nb/print.js +94 -94
  51. package/directives/module/vue-print-nb/printarea.js +532 -532
  52. package/index.js +10 -10
  53. package/nstyles/common.less +197 -197
  54. package/nstyles/components/404.less +46 -46
  55. package/nstyles/components/button.less +34 -34
  56. package/nstyles/components/date-picker.less +37 -37
  57. package/nstyles/components/drawer.less +20 -20
  58. package/nstyles/components/dropdown.less +18 -18
  59. package/nstyles/components/excel-flow.less +72 -72
  60. package/nstyles/components/form.less +313 -313
  61. package/nstyles/components/index.less +23 -23
  62. package/nstyles/components/layout/collect.less +10 -10
  63. package/nstyles/components/layout/detail-view.less +107 -107
  64. package/nstyles/components/layout/full-screen.less +7 -7
  65. package/nstyles/components/layout/index.less +7 -7
  66. package/nstyles/components/layout/other-menu.less +142 -142
  67. package/nstyles/components/layout/page-view.less +101 -101
  68. package/nstyles/components/layout/sider-trigger.less +41 -41
  69. package/nstyles/components/layout/tags-nav.less +113 -113
  70. package/nstyles/components/modal.less +85 -85
  71. package/nstyles/components/n-button.less +131 -131
  72. package/nstyles/components/n-image-preview.less +131 -131
  73. package/nstyles/components/n-model/index.less +19 -19
  74. package/nstyles/components/n-model/report-index.less +43 -43
  75. package/nstyles/components/n-panel.less +40 -40
  76. package/nstyles/components/n-picker.less +37 -37
  77. package/nstyles/components/n-sign.less +17 -17
  78. package/nstyles/components/n-tooltip.less +10 -10
  79. package/nstyles/components/panel.less +31 -31
  80. package/nstyles/components/select.less +3 -3
  81. package/nstyles/components/sign.less +27 -27
  82. package/nstyles/components/table.less +315 -315
  83. package/nstyles/components/tree.less +158 -158
  84. package/nstyles/components/upload.less +164 -164
  85. package/nstyles/index.less +5 -5
  86. package/nstyles/reset.less +65 -65
  87. package/nstyles/third/ag.less +174 -174
  88. package/nstyles/third/index.less +11 -11
  89. package/nstyles/third/view-design.less +366 -366
  90. package/nstyles/variables/base.less +143 -143
  91. package/nstyles/variables/index.less +4 -4
  92. package/nstyles/variables/theme/default/button.less +7 -7
  93. package/nstyles/variables/theme/default/common.less +57 -57
  94. package/nstyles/variables/theme/default/index.less +7 -7
  95. package/nstyles/variables/theme/default/layout.less +40 -40
  96. package/nstyles/variables/theme/default/table.less +37 -37
  97. package/nstyles/variables/theme/default/tag.less +3 -3
  98. package/nstyles/variables/theme/default/upload.less +3 -3
  99. package/nstyles/variables/theme/index.less +13 -13
  100. package/nstyles/variables/theme/small/button.less +7 -7
  101. package/nstyles/variables/theme/small/common.less +39 -39
  102. package/nstyles/variables/theme/small/index.less +5 -5
  103. package/nstyles/variables/theme/small/layout.less +21 -21
  104. package/nstyles/variables/theme/small/table.less +17 -17
  105. package/nstyles/variables/theme/small/tag.less +3 -3
  106. package/package.json +1 -1
  107. package/plugin/index.js +12 -12
  108. package/plugin/module/date-format.js +30 -30
  109. package/plugin/module/loading.js +26 -26
  110. package/plugin/module/warn-handler.js +11 -11
  111. package/styles/variables.less +21 -21
  112. package/utils/ajax/cacheconf.js +19 -19
  113. package/utils/ajax/content-type.js +30 -30
  114. package/utils/ajax/index.js +12 -12
  115. package/utils/ajax/interceptors.js +97 -97
  116. package/utils/ajax/sseFetchUtil.js +71 -0
  117. package/utils/assist.js +147 -147
  118. package/utils/base64.js +126 -126
  119. package/utils/blob.js +47 -47
  120. package/utils/bus.js +3 -3
  121. package/utils/crypto/index.js +48 -48
  122. package/utils/crypto/md5.js +152 -152
  123. package/utils/crypto/sm3.js +235 -235
  124. package/utils/date.js +381 -381
  125. package/utils/dict/built-in-dict.js +20 -20
  126. package/utils/dict/index.js +167 -167
  127. package/utils/dom.js +38 -38
  128. package/utils/event.js +72 -72
  129. package/utils/excel.js +655 -655
  130. package/utils/file.js +19 -19
  131. package/utils/form/validate.js +29 -29
  132. package/utils/half-year.js +68 -68
  133. package/utils/index.js +41 -41
  134. package/utils/json.js +29 -29
  135. package/utils/lodop.js +165 -165
  136. package/utils/menu/before-close.js +17 -17
  137. package/utils/menu/index.js +395 -395
  138. package/utils/mime_type.js +67 -67
  139. package/utils/modelerUtil.js +227 -227
  140. package/utils/n/api.js +22 -22
  141. package/utils/n/date.js +57 -57
  142. package/utils/n/index.js +9 -9
  143. package/utils/n/is-type.js +176 -176
  144. package/utils/n/number.js +144 -144
  145. package/utils/n/permission-cache.js +11 -11
  146. package/utils/n/reuqest/axiosN.js +17 -17
  147. package/utils/n/reuqest/content-type.js +19 -19
  148. package/utils/n/reuqest/interceptors.js +95 -95
  149. package/utils/n/reuqest/url-params.js +12 -12
  150. package/utils/n/storage.js +51 -51
  151. package/utils/n/token.js +51 -51
  152. package/utils/n/user-cache.js +11 -11
  153. package/utils/n/user.js +34 -34
  154. package/utils/n/uuid.js +16 -16
  155. package/utils/n-generator-routers.js +208 -208
  156. package/utils/n-router.js +205 -205
  157. package/utils/n-theme.js +30 -30
  158. package/utils/number.js +180 -180
  159. package/utils/oss.js +57 -57
  160. package/utils/platform.js +1334 -1334
  161. package/utils/quarter.js +58 -58
  162. package/utils/storage.js +198 -198
  163. package/utils/style.js +24 -24
  164. package/utils/theme.js +138 -138
  165. package/utils/transfer-queue.js +7 -7
  166. package/utils/transform.js +204 -205
  167. package/utils/type.js +102 -102
  168. package/utils/util.js +795 -795
  169. package/utils/validator.js +181 -181
  170. package/utils/vxetable/index.js +25 -25
  171. package/utils/zoomScroll.js +9 -9
package/directives/module/vue-print-nb/printarea.js CHANGED
@@ -1,532 +1,532 @@
1
- const isIE = () => {
2
- if (!!window.ActiveXobject || 'ActiveXObject' in window) {
3
- return true
4
- } else {
5
- return false
6
- }
7
- }
8
- /**
9
- * 判断是否是IE11
10
- * @returns boolean
11
- */
12
- const isIE11 = () => {
13
- if (/Trident\/7\./.test(navigator.userAgent)) {
14
- return true
15
- } else {
16
- return false
17
- }
18
- }
19
- const isRemove = (dom) => {
20
- if (isIE() || isIE11()) {
21
- dom.removeNode(true)
22
- } else {
23
- dom.remove()
24
- }
25
- return dom
26
- }
27
- export default class {
28
- constructor(option) {
29
- this.standards = {
30
- strict: 'strict',
31
- loose: 'loose',
32
- html5: 'html5',
33
- }
34
- this.previewBody = null
35
- this.close = null
36
- this.previewBodyUtilPrintBtn = null
37
- this.selectArray = [] // 存储select的
38
- this.counter = 0
39
- this.settings = {
40
- standard: this.standards.html5,
41
- ignoreClass: '', // 不需要打印内容的class
42
- }
43
- Object.assign(this.settings, option)
44
- this.init()
45
- }
46
- init() {
47
- console.log(this.settings)
48
- this.counter++
49
- this.settings.id = `printArea_${this.counter}`
50
- let url = ''
51
- if (this.settings.url && !this.settings.asyncUrl) {
52
- url = this.settings.url
53
- }
54
- let _this = this
55
- // 如果是异步的
56
- if (this.settings.asyncUrl) {
57
- _this.settings.asyncUrl(function (url) {
58
- let PrintAreaWindow = _this.getPrintWindow(url) // 创建iframe
59
- if (_this.settings.preview) {
60
- // 打开预览弹窗
61
- _this.previewIfrmaeLoad()
62
- } else {
63
- // 直接打印
64
- _this.print(PrintAreaWindow)
65
- }
66
- }, _this.settings.vue)
67
- return
68
- }
69
- let PrintAreaWindow = this.getPrintWindow(url) // 创建iframe
70
-
71
- if (!this.settings.url) {
72
- this.write(PrintAreaWindow.doc) // 写入内容
73
- }
74
-
75
- if (this.settings.preview) {
76
- // 打开预览弹窗
77
- this.previewIfrmaeLoad()
78
- } else {
79
- // 直接打印
80
- this.print(PrintAreaWindow)
81
- }
82
- }
83
- addEvent(element, type, callback) {
84
- if (element.addEventListener) {
85
- element.addEventListener(type, callback, false)
86
- } else if (element.attachEvent) {
87
- element.attachEvent('on' + type, callback)
88
- } else {
89
- element['on' + type] = callback
90
- }
91
- }
92
- previewIfrmaeLoad() {
93
- let box = document.getElementById('vue-pirnt-nb-previewBox')
94
-
95
- if (box) {
96
- let _this = this
97
- let iframe = box.querySelector('iframe')
98
- this.settings.previewBeforeOpenCallback()
99
- this.addEvent(iframe, 'load', function () {
100
- _this.previewBoxShow()
101
- _this.removeCanvasImg()
102
- _this.settings.previewOpenCallback()
103
- })
104
-
105
- this.addEvent(box.querySelector('.previewBodyUtilPrintBtn'), 'click', function () {
106
- _this.settings.beforeOpenCallback()
107
- _this.settings.openCallback()
108
- iframe.contentWindow.print()
109
- _this.settings.closeCallback()
110
- })
111
- }
112
- }
113
- // 删除所有canva转换的图片
114
- removeCanvasImg() {
115
- let _this = this
116
- try {
117
- if (_this.elsdom) {
118
- // 删除canva转变图片的dom节点
119
- let canvasList = _this.elsdom.querySelectorAll('.canvasImg')
120
- for (let i = 0; i < canvasList.length; i++) {
121
- isRemove(canvasList[i])
122
- }
123
- }
124
- } catch (e) {
125
- console.log(e)
126
- }
127
- }
128
- print(ifrmae) {
129
- var _this = this
130
- let iframe = document.getElementById(this.settings.id) || ifrmae.f
131
- let iframeWin =
132
- document.getElementById(this.settings.id).contentWindow || ifrmae.f.contentWindow
133
- var _loaded = function () {
134
- iframeWin.focus()
135
- _this.settings.openCallback()
136
- iframeWin.print()
137
- isRemove(iframe)
138
- _this.settings.closeCallback()
139
- _this.removeCanvasImg()
140
- }
141
- _this.settings.beforeOpenCallback()
142
- _this.addEvent(iframe, 'load', function () {
143
- _loaded()
144
- })
145
- }
146
- write(PADocument) {
147
- PADocument.open()
148
- PADocument.write(
149
- `${this.docType()}<html style="height:600px">${this.getHead()}${this.getBody()}</html>`,
150
- )
151
- PADocument.close()
152
- }
153
- docType() {
154
- if (this.settings.standard === this.standards.html5) {
155
- return '<!DOCTYPE html>'
156
- }
157
- var transitional = this.settings.standard === this.standards.loose ? ' Transitional' : ''
158
- var dtd = this.settings.standard === this.standards.loose ? 'loose' : 'strict'
159
-
160
- return `<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01${transitional}//EN" "http://www.w3.org/TR/html4/${dtd}.dtd">`
161
- }
162
- getHead() {
163
- let extraHead = ''
164
- let links = ''
165
- let style = ''
166
- if (this.settings.extraHead) {
167
- this.settings.extraHead.replace(/([^,]+)/g, (m) => {
168
- extraHead += m
169
- })
170
- }
171
- // 复制所有link标签
172
- ;[].forEach.call(document.querySelectorAll('link'), function (item) {
173
- if (item.href.indexOf('.css') >= 0) {
174
- links += `<link type="text/css" rel="stylesheet" href="${item.href}" >`
175
- }
176
- })
177
- // 循环获取style标签的样式
178
- let domStyle = document.styleSheets
179
- if (domStyle && domStyle.length > 0) {
180
- for (let i = 0; i < domStyle.length; i++) {
181
- try {
182
- if (domStyle[i].cssRules || domStyle[i].rules) {
183
- let rules = domStyle[i].cssRules || domStyle[i].rules
184
- for (let b = 0; b < rules.length; b++) {
185
- style += rules[b].cssText
186
- }
187
- }
188
- } catch (e) {
189
- console.log(domStyle[i].href + e)
190
- }
191
- }
192
- }
193
-
194
- if (this.settings.extraCss) {
195
- this.settings.extraCss.replace(/([^,\s]+)/g, (m) => {
196
- links += `<link type="text/css" rel="stylesheet" href="${m}">`
197
- })
198
- }
199
-
200
- return `<head><title>${this.settings.popTitle}</title>${extraHead}${links}<style type="text/css">${style}</style></head>`
201
- }
202
-
203
- getBody() {
204
- let ids = this.settings.ids
205
- ids = ids.replace(new RegExp('#', 'g'), '')
206
- this.elsdom = this.beforeHanler(document.getElementById(ids))
207
- let ele = this.getFormData(this.elsdom)
208
- ele = this.ignoreText(ele)
209
- ele = this.handleTableStyle(ele)
210
-
211
- let htm = ele.outerHTML
212
- if (this.settings.fontFamily && this.settings.fontFamily != '') {
213
- return `<body style="font-family:${this.settings.fontFamily}">` + htm + `</body>`
214
- } else {
215
- return `<body>` + htm + `</body>`
216
- }
217
- }
218
- // 设置忽视元素
219
- ignoreText(ele) {
220
- const copy = ele.cloneNode(true)
221
- console.log(this.settings.ignoreClass)
222
- const ignoreNodes = copy.querySelectorAll('.' + this.settings.ignoreClass)
223
-
224
- console.log(ignoreNodes)
225
- const nodes = copy.childNodes
226
- const reducer = (el, data, ignoreNode) => {
227
- for (let i = 0; i < data.length; i++) {
228
- const item = data[i]
229
- if (item == ignoreNode) {
230
- el.removeChild(ignoreNode)
231
- break
232
- } else if (item.childNodes && item.childNodes.length) {
233
- reducer(item, item.childNodes, ignoreNode)
234
- }
235
- }
236
- }
237
- if (ignoreNodes && ignoreNodes.length) {
238
- for (let i = 0; i < ignoreNodes.length; i++) {
239
- const ignoreNode = ignoreNodes[i]
240
- reducer(copy, nodes, ignoreNode)
241
- }
242
- }
243
- return copy
244
- }
245
- // 设置el-table样式
246
- handleTableStyle(ele) {
247
- const copy = ele.cloneNode(true)
248
- const tableNodes = copy.querySelectorAll('.ivu-table-header table,.ivu-table-body table')
249
- /*** 这里先注释,有需要的可以按照这个例子自己自定义 */
250
- const tableBorderNodes = copy.querySelectorAll('.ivu-table-border')
251
- const thBorderNodes = copy.querySelectorAll('.ivu-table-border th, .ivu-table-border td')
252
- const pageBottom = copy.querySelectorAll('.page-bottom')
253
-
254
- // 给页尾增加内容
255
- for (let i = 0; i < pageBottom.length; i++) {
256
- // const element = pageBottom[i];
257
- // element.style.width = '100%'
258
- // element.style.position = 'absolute'
259
- // element.style.bottom = '0px'
260
- // element.style.display = 'flex'
261
- // element.style.flexDirection = 'row'
262
- // element.style.justifyContent = 'spaceBetween'
263
- // element.style.marginTop = '100px'
264
- }
265
- // // 给表格添加下边框和右边框(根据自己的打印预览样式修改,不同电脑显示的效果不一样)
266
- for (let i = 0; i < tableBorderNodes.length; i++) {
267
- const element = tableBorderNodes[i]
268
- element.style.border = 'none'
269
- element.style.border = '1px solid black'
270
- }
271
- // // 给表格th添加边框
272
- for (let i = 0; i < thBorderNodes.length; i++) {
273
- const element = thBorderNodes[i]
274
- element.style.borderRight = '1px solid black'
275
- element.style.borderBottom = '1px solid black'
276
- }
277
- /**------------------------------- */
278
- // 处理宽度
279
- for (let i = 0; i < tableNodes.length; i++) {
280
- const tableItem = tableNodes[i]
281
- tableItem.style.width = '100%' // 将宽度设置为百分比
282
- const child = tableItem.childNodes
283
- for (let j = 0; j < child.length; j++) {
284
- const element = child[j]
285
- if (element.localName === 'colgroup') {
286
- // 去除默认的表格宽度设置
287
- const colElement = element.childNodes
288
- for (let l = 0; l < colElement.length; l++) {
289
- const col = colElement[l]
290
- if (col.localName === 'col') {
291
- let colWidth = parseFloat(col.getAttribute('width'))
292
- colWidth = parseInt((colWidth * 100) / 595)
293
- col.setAttribute('width', colWidth)
294
- }
295
- }
296
- }
297
- }
298
- }
299
- return copy
300
- }
301
- // 处理canva转成图片
302
- beforeHanler(elsdom) {
303
- let canvasList = elsdom.querySelectorAll('canvas')
304
- // canvas转换png图片
305
- for (let i = 0; i < canvasList.length; i++) {
306
- if (!canvasList[i].style.display) {
307
- let _parent = canvasList[i].parentNode
308
- let _canvasUrl = canvasList[i].toDataURL('image/png')
309
- let _img = new Image()
310
- _img.className = 'canvasImg'
311
- _img.style.display = 'none'
312
- _img.src = _canvasUrl
313
- _parent.appendChild(_img)
314
- }
315
- }
316
- return elsdom
317
- }
318
- // 根据type去处理form表单
319
- getFormData(ele) {
320
- let copy = ele.cloneNode(true)
321
- let copiedInputs = copy.querySelectorAll('input,select,textarea')
322
- let canvasImgList = copy.querySelectorAll('.canvasImg,canvas')
323
- let selectCount = -1
324
- // 处理所有canvas
325
- for (let i = 0; i < canvasImgList.length; i++) {
326
- let _parent = canvasImgList[i].parentNode
327
- let item = canvasImgList[i]
328
- // 删除克隆后的canvas节点
329
- if (item.tagName.toLowerCase() === 'canvas') {
330
- _parent.removeChild(item)
331
- } else {
332
- item.style.display = 'block'
333
- }
334
- }
335
- // 处理所有输入框
336
- for (let i = 0; i < copiedInputs.length; i++) {
337
- let item = copiedInputs[i]
338
- let typeInput = item.getAttribute('type')
339
- let copiedInput = copiedInputs[i]
340
- // 获取select标签
341
- if (!typeInput) {
342
- typeInput =
343
- item.tagName === 'SELECT' ? 'select' : item.tagName === 'TEXTAREA' ? 'textarea' : ''
344
- }
345
- // 处理input框
346
- if (item.tagName === 'INPUT') {
347
- // 除了单选框 多选框比较特别
348
- if (typeInput === 'radio' || typeInput === 'checkbox') {
349
- if (item.checked) {
350
- copiedInput.setAttribute('checked', item.checked)
351
- }
352
- } else {
353
- copiedInput.value = item.value
354
- copiedInput.setAttribute('value', item.value)
355
- }
356
- // 处理select
357
- } else if (typeInput === 'select') {
358
- selectCount++
359
- for (let b = 0; b < ele.querySelectorAll('select').length; b++) {
360
- let select = ele.querySelectorAll('select')[b] // 获取原始层每一个select
361
- !select.getAttribute('newbs') && select.setAttribute('newbs', b) // 添加标识
362
- if (select.getAttribute('newbs') == selectCount) {
363
- let opSelectedIndex = ele.querySelectorAll('select')[selectCount].selectedIndex
364
- item.options[opSelectedIndex].setAttribute('selected', true)
365
- }
366
- }
367
- // 处理textarea
368
- } else {
369
- copiedInput.innerHTML = item.value
370
- copiedInput.setAttribute('html', item.value)
371
- }
372
- }
373
-
374
- return copy
375
- }
376
- getPrintWindow(url) {
377
- var f = this.Iframe(url)
378
- return {
379
- f: f,
380
- win: f.contentWindow || f,
381
- doc: f.doc,
382
- }
383
- }
384
- previewBoxShow() {
385
- let box = document.getElementById('vue-pirnt-nb-previewBox')
386
- if (box) {
387
- document.querySelector('html').setAttribute('style', 'overflow: hidden')
388
- box.style.display = 'block'
389
- }
390
- }
391
-
392
- previewBoxHide() {
393
- let box = document.getElementById('vue-pirnt-nb-previewBox')
394
- if (box) {
395
- document.querySelector('html').setAttribute('style', 'overflow: visible;')
396
-
397
- box.querySelector('iframe') && isRemove(box.querySelector('iframe'))
398
- box.style.display = 'none'
399
- }
400
- }
401
- previewBox() {
402
- let box = document.getElementById('vue-pirnt-nb-previewBox')
403
- let previewBodyClass = 'previewBody'
404
- if (box) {
405
- box.querySelector('iframe') && isRemove(box.querySelector('iframe'))
406
- return {
407
- close: box.querySelector('.previewClose'),
408
- previewBody: box.querySelector(`.${previewBodyClass}`),
409
- }
410
- }
411
- let previewContent = document.createElement('div')
412
- previewContent.setAttribute('id', 'vue-pirnt-nb-previewBox')
413
- previewContent.setAttribute(
414
- 'style',
415
- 'position: fixed;top: 0px;left: 0px;width: 100%;height: 100%;background: white;display:none',
416
- )
417
- previewContent.style.zIndex = this.settings.zIndex
418
- // 打印预览弹窗的header
419
- let previewHeader = document.createElement('div')
420
- previewHeader.setAttribute('class', 'previewHeader')
421
- previewHeader.setAttribute('style', 'padding: 5px 20px;')
422
- previewHeader.innerHTML = this.settings.previewTitle
423
- previewContent.appendChild(previewHeader)
424
- // close关闭按钮
425
- this.close = document.createElement('div')
426
- let close = this.close
427
- close.setAttribute('class', 'previewClose')
428
- close.setAttribute(
429
- 'style',
430
- 'position: absolute;top: 5px;right: 20px;width: 25px;height: 20px;cursor: pointer;',
431
- )
432
- let closeBefore = document.createElement('div')
433
- let closeAfter = document.createElement('div')
434
- closeBefore.setAttribute('class', 'closeBefore')
435
- closeBefore.setAttribute(
436
- 'style',
437
- 'position: absolute;width: 3px;height: 100%;background: #040404;transform: rotate(45deg); top: 0px;left: 50%;',
438
- )
439
- closeAfter.setAttribute('class', 'closeAfter')
440
- closeAfter.setAttribute(
441
- 'style',
442
- 'position: absolute;width: 3px;height: 100%;background: #040404;transform: rotate(-45deg); top: 0px;left: 50%;',
443
- )
444
- close.appendChild(closeBefore)
445
- close.appendChild(closeAfter)
446
- previewHeader.appendChild(close)
447
-
448
- // 打印预览弹窗的body
449
- this.previewBody = document.createElement('div')
450
- let previewBody = this.previewBody
451
- previewBody.setAttribute('class', previewBodyClass)
452
- previewBody.setAttribute('style', 'display: flex;flex-direction: column; height: 100%;')
453
- previewContent.appendChild(previewBody)
454
- // 打印预览弹窗的body的工具栏
455
- let previewBodyUtil = document.createElement('div')
456
- previewBodyUtil.setAttribute('class', 'previewBodyUtil')
457
- previewBodyUtil.setAttribute('style', 'height: 32px;background: #474747;position: relative;')
458
- previewBody.appendChild(previewBodyUtil)
459
- // 打印的按钮
460
- this.previewBodyUtilPrintBtn = document.createElement('div')
461
- let previewBodyUtilPrintBtn = this.previewBodyUtilPrintBtn
462
- previewBodyUtilPrintBtn.setAttribute('class', 'previewBodyUtilPrintBtn')
463
- previewBodyUtilPrintBtn.innerHTML = this.settings.previewPrintBtnLabel
464
- previewBodyUtilPrintBtn.setAttribute(
465
- 'style',
466
- 'position: absolute;padding: 2px 10px;margin-top: 3px;left: 24px;font-size: 14px;color: white;cursor: pointer;background-color: rgba(0,0,0,.12);background-image: linear-gradient(hsla(0,0%,100%,.05),hsla(0,0%,100%,0));background-clip: padding-box;border: 1px solid rgba(0,0,0,.35);border-color: rgba(0,0,0,.32) rgba(0,0,0,.38) rgba(0,0,0,.42);box-shadow: inset 0 1px 0 hsla(0,0%,100%,.05), inset 0 0 1px hsla(0,0%,100%,.15), 0 1px 0 hsla(0,0%,100%,.05);',
467
- )
468
- previewBodyUtil.appendChild(previewBodyUtilPrintBtn)
469
-
470
- // 添加整个预览到body
471
- document.body.appendChild(previewContent)
472
-
473
- return {
474
- close: this.close,
475
- previewBody: this.previewBody,
476
- }
477
- }
478
- iframeBox(frameId, url) {
479
- let iframe = document.createElement('iframe')
480
- iframe.style.border = '0px'
481
- iframe.style.position = 'absolute'
482
- iframe.style.width = '0px'
483
- iframe.style.height = '0px'
484
- iframe.style.right = '0px'
485
- iframe.style.top = '0px'
486
- iframe.setAttribute('id', frameId)
487
- iframe.setAttribute('src', url)
488
-
489
- return iframe
490
- }
491
- Iframe(url) {
492
- let frameId = this.settings.id
493
- // 局部打印 用当前的时间做ifrmae的url
494
- url = !url ? new Date().getTime() : url
495
- let _this = this
496
-
497
- let iframe = this.iframeBox(frameId, url)
498
-
499
- // let that = this
500
- try {
501
- // 直接打印 不预览
502
- if (!this.settings.preview) {
503
- document.body.appendChild(iframe)
504
- } else {
505
- iframe.setAttribute('style', 'border: 0px;flex: 1;')
506
- // 预览打印
507
- let previewBox = this.previewBox()
508
- let previewBody = previewBox.previewBody
509
- let close = previewBox.close
510
- // 添加ifrmae到预览弹窗
511
- previewBody.appendChild(iframe)
512
- this.addEvent(close, 'click', function () {
513
- _this.previewBoxHide()
514
- })
515
- }
516
-
517
- iframe.doc = null
518
- iframe.doc = iframe.contentDocument
519
- ? iframe.contentDocument
520
- : iframe.contentWindow
521
- ? iframe.contentWindow.document
522
- : iframe.document
523
- } catch (e) {
524
- throw new Error(e + '. iframes may not be supported in this browser.')
525
- }
526
- if (iframe.doc == null) {
527
- throw new Error('Cannot find document.')
528
- }
529
-
530
- return iframe
531
- }
532
- }
1
+ const isIE = () => {
2
+ if (!!window.ActiveXobject || 'ActiveXObject' in window) {
3
+ return true
4
+ } else {
5
+ return false
6
+ }
7
+ }
8
+ /**
9
+ * 判断是否是IE11
10
+ * @returns boolean
11
+ */
12
+ const isIE11 = () => {
13
+ if (/Trident\/7\./.test(navigator.userAgent)) {
14
+ return true
15
+ } else {
16
+ return false
17
+ }
18
+ }
19
+ const isRemove = (dom) => {
20
+ if (isIE() || isIE11()) {
21
+ dom.removeNode(true)
22
+ } else {
23
+ dom.remove()
24
+ }
25
+ return dom
26
+ }
27
+ export default class {
28
+ constructor(option) {
29
+ this.standards = {
30
+ strict: 'strict',
31
+ loose: 'loose',
32
+ html5: 'html5',
33
+ }
34
+ this.previewBody = null
35
+ this.close = null
36
+ this.previewBodyUtilPrintBtn = null
37
+ this.selectArray = [] // 存储select的
38
+ this.counter = 0
39
+ this.settings = {
40
+ standard: this.standards.html5,
41
+ ignoreClass: '', // 不需要打印内容的class
42
+ }
43
+ Object.assign(this.settings, option)
44
+ this.init()
45
+ }
46
+ init() {
47
+ console.log(this.settings)
48
+ this.counter++
49
+ this.settings.id = `printArea_${this.counter}`
50
+ let url = ''
51
+ if (this.settings.url && !this.settings.asyncUrl) {
52
+ url = this.settings.url
53
+ }
54
+ let _this = this
55
+ // 如果是异步的
56
+ if (this.settings.asyncUrl) {
57
+ _this.settings.asyncUrl(function (url) {
58
+ let PrintAreaWindow = _this.getPrintWindow(url) // 创建iframe
59
+ if (_this.settings.preview) {
60
+ // 打开预览弹窗
61
+ _this.previewIfrmaeLoad()
62
+ } else {
63
+ // 直接打印
64
+ _this.print(PrintAreaWindow)
65
+ }
66
+ }, _this.settings.vue)
67
+ return
68
+ }
69
+ let PrintAreaWindow = this.getPrintWindow(url) // 创建iframe
70
+
71
+ if (!this.settings.url) {
72
+ this.write(PrintAreaWindow.doc) // 写入内容
73
+ }
74
+
75
+ if (this.settings.preview) {
76
+ // 打开预览弹窗
77
+ this.previewIfrmaeLoad()
78
+ } else {
79
+ // 直接打印
80
+ this.print(PrintAreaWindow)
81
+ }
82
+ }
83
+ addEvent(element, type, callback) {
84
+ if (element.addEventListener) {
85
+ element.addEventListener(type, callback, false)
86
+ } else if (element.attachEvent) {
87
+ element.attachEvent('on' + type, callback)
88
+ } else {
89
+ element['on' + type] = callback
90
+ }
91
+ }
92
+ previewIfrmaeLoad() {
93
+ let box = document.getElementById('vue-pirnt-nb-previewBox')
94
+
95
+ if (box) {
96
+ let _this = this
97
+ let iframe = box.querySelector('iframe')
98
+ this.settings.previewBeforeOpenCallback()
99
+ this.addEvent(iframe, 'load', function () {
100
+ _this.previewBoxShow()
101
+ _this.removeCanvasImg()
102
+ _this.settings.previewOpenCallback()
103
+ })
104
+
105
+ this.addEvent(box.querySelector('.previewBodyUtilPrintBtn'), 'click', function () {
106
+ _this.settings.beforeOpenCallback()
107
+ _this.settings.openCallback()
108
+ iframe.contentWindow.print()
109
+ _this.settings.closeCallback()
110
+ })
111
+ }
112
+ }
113
+ // 删除所有canva转换的图片
114
+ removeCanvasImg() {
115
+ let _this = this
116
+ try {
117
+ if (_this.elsdom) {
118
+ // 删除canva转变图片的dom节点
119
+ let canvasList = _this.elsdom.querySelectorAll('.canvasImg')
120
+ for (let i = 0; i < canvasList.length; i++) {
121
+ isRemove(canvasList[i])
122
+ }
123
+ }
124
+ } catch (e) {
125
+ console.log(e)
126
+ }
127
+ }
128
+ print(ifrmae) {
129
+ var _this = this
130
+ let iframe = document.getElementById(this.settings.id) || ifrmae.f
131
+ let iframeWin =
132
+ document.getElementById(this.settings.id).contentWindow || ifrmae.f.contentWindow
133
+ var _loaded = function () {
134
+ iframeWin.focus()
135
+ _this.settings.openCallback()
136
+ iframeWin.print()
137
+ isRemove(iframe)
138
+ _this.settings.closeCallback()
139
+ _this.removeCanvasImg()
140
+ }
141
+ _this.settings.beforeOpenCallback()
142
+ _this.addEvent(iframe, 'load', function () {
143
+ _loaded()
144
+ })
145
+ }
146
+ write(PADocument) {
147
+ PADocument.open()
148
+ PADocument.write(
149
+ `${this.docType()}<html style="height:600px">${this.getHead()}${this.getBody()}</html>`,
150
+ )
151
+ PADocument.close()
152
+ }
153
+ docType() {
154
+ if (this.settings.standard === this.standards.html5) {
155
+ return '<!DOCTYPE html>'
156
+ }
157
+ var transitional = this.settings.standard === this.standards.loose ? ' Transitional' : ''
158
+ var dtd = this.settings.standard === this.standards.loose ? 'loose' : 'strict'
159
+
160
+ return `<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01${transitional}//EN" "http://www.w3.org/TR/html4/${dtd}.dtd">`
161
+ }
162
+ getHead() {
163
+ let extraHead = ''
164
+ let links = ''
165
+ let style = ''
166
+ if (this.settings.extraHead) {
167
+ this.settings.extraHead.replace(/([^,]+)/g, (m) => {
168
+ extraHead += m
169
+ })
170
+ }
171
+ // 复制所有link标签
172
+ ;[].forEach.call(document.querySelectorAll('link'), function (item) {
173
+ if (item.href.indexOf('.css') >= 0) {
174
+ links += `<link type="text/css" rel="stylesheet" href="${item.href}" >`
175
+ }
176
+ })
177
+ // 循环获取style标签的样式
178
+ let domStyle = document.styleSheets
179
+ if (domStyle && domStyle.length > 0) {
180
+ for (let i = 0; i < domStyle.length; i++) {
181
+ try {
182
+ if (domStyle[i].cssRules || domStyle[i].rules) {
183
+ let rules = domStyle[i].cssRules || domStyle[i].rules
184
+ for (let b = 0; b < rules.length; b++) {
185
+ style += rules[b].cssText
186
+ }
187
+ }
188
+ } catch (e) {
189
+ console.log(domStyle[i].href + e)
190
+ }
191
+ }
192
+ }
193
+
194
+ if (this.settings.extraCss) {
195
+ this.settings.extraCss.replace(/([^,\s]+)/g, (m) => {
196
+ links += `<link type="text/css" rel="stylesheet" href="${m}">`
197
+ })
198
+ }
199
+
200
+ return `<head><title>${this.settings.popTitle}</title>${extraHead}${links}<style type="text/css">${style}</style></head>`
201
+ }
202
+
203
+ getBody() {
204
+ let ids = this.settings.ids
205
+ ids = ids.replace(new RegExp('#', 'g'), '')
206
+ this.elsdom = this.beforeHanler(document.getElementById(ids))
207
+ let ele = this.getFormData(this.elsdom)
208
+ ele = this.ignoreText(ele)
209
+ ele = this.handleTableStyle(ele)
210
+
211
+ let htm = ele.outerHTML
212
+ if (this.settings.fontFamily && this.settings.fontFamily != '') {
213
+ return `<body style="font-family:${this.settings.fontFamily}">` + htm + `</body>`
214
+ } else {
215
+ return `<body>` + htm + `</body>`
216
+ }
217
+ }
218
+ // 设置忽视元素
219
+ ignoreText(ele) {
220
+ const copy = ele.cloneNode(true)
221
+ console.log(this.settings.ignoreClass)
222
+ const ignoreNodes = copy.querySelectorAll('.' + this.settings.ignoreClass)
223
+
224
+ console.log(ignoreNodes)
225
+ const nodes = copy.childNodes
226
+ const reducer = (el, data, ignoreNode) => {
227
+ for (let i = 0; i < data.length; i++) {
228
+ const item = data[i]
229
+ if (item == ignoreNode) {
230
+ el.removeChild(ignoreNode)
231
+ break
232
+ } else if (item.childNodes && item.childNodes.length) {
233
+ reducer(item, item.childNodes, ignoreNode)
234
+ }
235
+ }
236
+ }
237
+ if (ignoreNodes && ignoreNodes.length) {
238
+ for (let i = 0; i < ignoreNodes.length; i++) {
239
+ const ignoreNode = ignoreNodes[i]
240
+ reducer(copy, nodes, ignoreNode)
241
+ }
242
+ }
243
+ return copy
244
+ }
245
+ // 设置el-table样式
246
+ handleTableStyle(ele) {
247
+ const copy = ele.cloneNode(true)
248
+ const tableNodes = copy.querySelectorAll('.ivu-table-header table,.ivu-table-body table')
249
+ /*** 这里先注释,有需要的可以按照这个例子自己自定义 */
250
+ const tableBorderNodes = copy.querySelectorAll('.ivu-table-border')
251
+ const thBorderNodes = copy.querySelectorAll('.ivu-table-border th, .ivu-table-border td')
252
+ const pageBottom = copy.querySelectorAll('.page-bottom')
253
+
254
+ // 给页尾增加内容
255
+ for (let i = 0; i < pageBottom.length; i++) {
256
+ // const element = pageBottom[i];
257
+ // element.style.width = '100%'
258
+ // element.style.position = 'absolute'
259
+ // element.style.bottom = '0px'
260
+ // element.style.display = 'flex'
261
+ // element.style.flexDirection = 'row'
262
+ // element.style.justifyContent = 'spaceBetween'
263
+ // element.style.marginTop = '100px'
264
+ }
265
+ // // 给表格添加下边框和右边框(根据自己的打印预览样式修改,不同电脑显示的效果不一样)
266
+ for (let i = 0; i < tableBorderNodes.length; i++) {
267
+ const element = tableBorderNodes[i]
268
+ element.style.border = 'none'
269
+ element.style.border = '1px solid black'
270
+ }
271
+ // // 给表格th添加边框
272
+ for (let i = 0; i < thBorderNodes.length; i++) {
273
+ const element = thBorderNodes[i]
274
+ element.style.borderRight = '1px solid black'
275
+ element.style.borderBottom = '1px solid black'
276
+ }
277
+ /**------------------------------- */
278
+ // 处理宽度
279
+ for (let i = 0; i < tableNodes.length; i++) {
280
+ const tableItem = tableNodes[i]
281
+ tableItem.style.width = '100%' // 将宽度设置为百分比
282
+ const child = tableItem.childNodes
283
+ for (let j = 0; j < child.length; j++) {
284
+ const element = child[j]
285
+ if (element.localName === 'colgroup') {
286
+ // 去除默认的表格宽度设置
287
+ const colElement = element.childNodes
288
+ for (let l = 0; l < colElement.length; l++) {
289
+ const col = colElement[l]
290
+ if (col.localName === 'col') {
291
+ let colWidth = parseFloat(col.getAttribute('width'))
292
+ colWidth = parseInt((colWidth * 100) / 595)
293
+ col.setAttribute('width', colWidth)
294
+ }
295
+ }
296
+ }
297
+ }
298
+ }
299
+ return copy
300
+ }
301
+ // 处理canva转成图片
302
+ beforeHanler(elsdom) {
303
+ let canvasList = elsdom.querySelectorAll('canvas')
304
+ // canvas转换png图片
305
+ for (let i = 0; i < canvasList.length; i++) {
306
+ if (!canvasList[i].style.display) {
307
+ let _parent = canvasList[i].parentNode
308
+ let _canvasUrl = canvasList[i].toDataURL('image/png')
309
+ let _img = new Image()
310
+ _img.className = 'canvasImg'
311
+ _img.style.display = 'none'
312
+ _img.src = _canvasUrl
313
+ _parent.appendChild(_img)
314
+ }
315
+ }
316
+ return elsdom
317
+ }
318
+ // 根据type去处理form表单
319
+ getFormData(ele) {
320
+ let copy = ele.cloneNode(true)
321
+ let copiedInputs = copy.querySelectorAll('input,select,textarea')
322
+ let canvasImgList = copy.querySelectorAll('.canvasImg,canvas')
323
+ let selectCount = -1
324
+ // 处理所有canvas
325
+ for (let i = 0; i < canvasImgList.length; i++) {
326
+ let _parent = canvasImgList[i].parentNode
327
+ let item = canvasImgList[i]
328
+ // 删除克隆后的canvas节点
329
+ if (item.tagName.toLowerCase() === 'canvas') {
330
+ _parent.removeChild(item)
331
+ } else {
332
+ item.style.display = 'block'
333
+ }
334
+ }
335
+ // 处理所有输入框
336
+ for (let i = 0; i < copiedInputs.length; i++) {
337
+ let item = copiedInputs[i]
338
+ let typeInput = item.getAttribute('type')
339
+ let copiedInput = copiedInputs[i]
340
+ // 获取select标签
341
+ if (!typeInput) {
342
+ typeInput =
343
+ item.tagName === 'SELECT' ? 'select' : item.tagName === 'TEXTAREA' ? 'textarea' : ''
344
+ }
345
+ // 处理input框
346
+ if (item.tagName === 'INPUT') {
347
+ // 除了单选框 多选框比较特别
348
+ if (typeInput === 'radio' || typeInput === 'checkbox') {
349
+ if (item.checked) {
350
+ copiedInput.setAttribute('checked', item.checked)
351
+ }
352
+ } else {
353
+ copiedInput.value = item.value
354
+ copiedInput.setAttribute('value', item.value)
355
+ }
356
+ // 处理select
357
+ } else if (typeInput === 'select') {
358
+ selectCount++
359
+ for (let b = 0; b < ele.querySelectorAll('select').length; b++) {
360
+ let select = ele.querySelectorAll('select')[b] // 获取原始层每一个select
361
+ !select.getAttribute('newbs') && select.setAttribute('newbs', b) // 添加标识
362
+ if (select.getAttribute('newbs') == selectCount) {
363
+ let opSelectedIndex = ele.querySelectorAll('select')[selectCount].selectedIndex
364
+ item.options[opSelectedIndex].setAttribute('selected', true)
365
+ }
366
+ }
367
+ // 处理textarea
368
+ } else {
369
+ copiedInput.innerHTML = item.value
370
+ copiedInput.setAttribute('html', item.value)
371
+ }
372
+ }
373
+
374
+ return copy
375
+ }
376
+ getPrintWindow(url) {
377
+ var f = this.Iframe(url)
378
+ return {
379
+ f: f,
380
+ win: f.contentWindow || f,
381
+ doc: f.doc,
382
+ }
383
+ }
384
+ previewBoxShow() {
385
+ let box = document.getElementById('vue-pirnt-nb-previewBox')
386
+ if (box) {
387
+ document.querySelector('html').setAttribute('style', 'overflow: hidden')
388
+ box.style.display = 'block'
389
+ }
390
+ }
391
+
392
+ previewBoxHide() {
393
+ let box = document.getElementById('vue-pirnt-nb-previewBox')
394
+ if (box) {
395
+ document.querySelector('html').setAttribute('style', 'overflow: visible;')
396
+
397
+ box.querySelector('iframe') && isRemove(box.querySelector('iframe'))
398
+ box.style.display = 'none'
399
+ }
400
+ }
401
+ previewBox() {
402
+ let box = document.getElementById('vue-pirnt-nb-previewBox')
403
+ let previewBodyClass = 'previewBody'
404
+ if (box) {
405
+ box.querySelector('iframe') && isRemove(box.querySelector('iframe'))
406
+ return {
407
+ close: box.querySelector('.previewClose'),
408
+ previewBody: box.querySelector(`.${previewBodyClass}`),
409
+ }
410
+ }
411
+ let previewContent = document.createElement('div')
412
+ previewContent.setAttribute('id', 'vue-pirnt-nb-previewBox')
413
+ previewContent.setAttribute(
414
+ 'style',
415
+ 'position: fixed;top: 0px;left: 0px;width: 100%;height: 100%;background: white;display:none',
416
+ )
417
+ previewContent.style.zIndex = this.settings.zIndex
418
+ // 打印预览弹窗的header
419
+ let previewHeader = document.createElement('div')
420
+ previewHeader.setAttribute('class', 'previewHeader')
421
+ previewHeader.setAttribute('style', 'padding: 5px 20px;')
422
+ previewHeader.innerHTML = this.settings.previewTitle
423
+ previewContent.appendChild(previewHeader)
424
+ // close关闭按钮
425
+ this.close = document.createElement('div')
426
+ let close = this.close
427
+ close.setAttribute('class', 'previewClose')
428
+ close.setAttribute(
429
+ 'style',
430
+ 'position: absolute;top: 5px;right: 20px;width: 25px;height: 20px;cursor: pointer;',
431
+ )
432
+ let closeBefore = document.createElement('div')
433
+ let closeAfter = document.createElement('div')
434
+ closeBefore.setAttribute('class', 'closeBefore')
435
+ closeBefore.setAttribute(
436
+ 'style',
437
+ 'position: absolute;width: 3px;height: 100%;background: #040404;transform: rotate(45deg); top: 0px;left: 50%;',
438
+ )
439
+ closeAfter.setAttribute('class', 'closeAfter')
440
+ closeAfter.setAttribute(
441
+ 'style',
442
+ 'position: absolute;width: 3px;height: 100%;background: #040404;transform: rotate(-45deg); top: 0px;left: 50%;',
443
+ )
444
+ close.appendChild(closeBefore)
445
+ close.appendChild(closeAfter)
446
+ previewHeader.appendChild(close)
447
+
448
+ // 打印预览弹窗的body
449
+ this.previewBody = document.createElement('div')
450
+ let previewBody = this.previewBody
451
+ previewBody.setAttribute('class', previewBodyClass)
452
+ previewBody.setAttribute('style', 'display: flex;flex-direction: column; height: 100%;')
453
+ previewContent.appendChild(previewBody)
454
+ // 打印预览弹窗的body的工具栏
455
+ let previewBodyUtil = document.createElement('div')
456
+ previewBodyUtil.setAttribute('class', 'previewBodyUtil')
457
+ previewBodyUtil.setAttribute('style', 'height: 32px;background: #474747;position: relative;')
458
+ previewBody.appendChild(previewBodyUtil)
459
+ // 打印的按钮
460
+ this.previewBodyUtilPrintBtn = document.createElement('div')
461
+ let previewBodyUtilPrintBtn = this.previewBodyUtilPrintBtn
462
+ previewBodyUtilPrintBtn.setAttribute('class', 'previewBodyUtilPrintBtn')
463
+ previewBodyUtilPrintBtn.innerHTML = this.settings.previewPrintBtnLabel
464
+ previewBodyUtilPrintBtn.setAttribute(
465
+ 'style',
466
+ 'position: absolute;padding: 2px 10px;margin-top: 3px;left: 24px;font-size: 14px;color: white;cursor: pointer;background-color: rgba(0,0,0,.12);background-image: linear-gradient(hsla(0,0%,100%,.05),hsla(0,0%,100%,0));background-clip: padding-box;border: 1px solid rgba(0,0,0,.35);border-color: rgba(0,0,0,.32) rgba(0,0,0,.38) rgba(0,0,0,.42);box-shadow: inset 0 1px 0 hsla(0,0%,100%,.05), inset 0 0 1px hsla(0,0%,100%,.15), 0 1px 0 hsla(0,0%,100%,.05);',
467
+ )
468
+ previewBodyUtil.appendChild(previewBodyUtilPrintBtn)
469
+
470
+ // 添加整个预览到body
471
+ document.body.appendChild(previewContent)
472
+
473
+ return {
474
+ close: this.close,
475
+ previewBody: this.previewBody,
476
+ }
477
+ }
478
+ iframeBox(frameId, url) {
479
+ let iframe = document.createElement('iframe')
480
+ iframe.style.border = '0px'
481
+ iframe.style.position = 'absolute'
482
+ iframe.style.width = '0px'
483
+ iframe.style.height = '0px'
484
+ iframe.style.right = '0px'
485
+ iframe.style.top = '0px'
486
+ iframe.setAttribute('id', frameId)
487
+ iframe.setAttribute('src', url)
488
+
489
+ return iframe
490
+ }
491
+ Iframe(url) {
492
+ let frameId = this.settings.id
493
+ // 局部打印 用当前的时间做ifrmae的url
494
+ url = !url ? new Date().getTime() : url
495
+ let _this = this
496
+
497
+ let iframe = this.iframeBox(frameId, url)
498
+
499
+ // let that = this
500
+ try {
501
+ // 直接打印 不预览
502
+ if (!this.settings.preview) {
503
+ document.body.appendChild(iframe)
504
+ } else {
505
+ iframe.setAttribute('style', 'border: 0px;flex: 1;')
506
+ // 预览打印
507
+ let previewBox = this.previewBox()
508
+ let previewBody = previewBox.previewBody
509
+ let close = previewBox.close
510
+ // 添加ifrmae到预览弹窗
511
+ previewBody.appendChild(iframe)
512
+ this.addEvent(close, 'click', function () {
513
+ _this.previewBoxHide()
514
+ })
515
+ }
516
+
517
+ iframe.doc = null
518
+ iframe.doc = iframe.contentDocument
519
+ ? iframe.contentDocument
520
+ : iframe.contentWindow
521
+ ? iframe.contentWindow.document
522
+ : iframe.document
523
+ } catch (e) {
524
+ throw new Error(e + '. iframes may not be supported in this browser.')
525
+ }
526
+ if (iframe.doc == null) {
527
+ throw new Error('Cannot find document.')
528
+ }
529
+
530
+ return iframe
531
+ }
532
+ }