@lambo-design/shared 1.0.0-beta.236 → 1.0.0-beta.239

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 (172) 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.css +4 -4
  13. package/config/themes/danqing/danqing.css.map +1 -1
  14. package/config/themes/danqing/danqing.less +668 -668
  15. package/config/themes/danqing/danqing.wxss +572 -572
  16. package/config/themes/danqing/var.less +679 -679
  17. package/config/themes/deep/deep.less +669 -669
  18. package/config/themes/deep/var.less +677 -677
  19. package/config/themes/default/default.less +671 -671
  20. package/config/themes/default/var.less +677 -677
  21. package/config/themes/eap/eap.less +671 -671
  22. package/config/themes/eap/var.less +677 -677
  23. package/config/themes/gold/gold.less +671 -671
  24. package/config/themes/gold/var.less +677 -677
  25. package/config/themes/index.js +28 -28
  26. package/config/themes/lime/lime.less +671 -671
  27. package/config/themes/lime/var.less +678 -678
  28. package/config/themes/orange/orange.less +671 -671
  29. package/config/themes/orange/var.less +678 -678
  30. package/config/themes/red/red.less +671 -671
  31. package/config/themes/red/var.less +677 -677
  32. package/config/themes/theme-atrovirens.js +558 -558
  33. package/config/themes/theme-blue.js +558 -558
  34. package/config/themes/theme-bw.js +558 -558
  35. package/config/themes/theme-bwt.js +559 -559
  36. package/config/themes/theme-danqing.js +558 -558
  37. package/config/themes/theme-deep.js +558 -558
  38. package/config/themes/theme-default.js +558 -558
  39. package/config/themes/theme-eap.js +558 -558
  40. package/config/themes/theme-gold.js +558 -558
  41. package/config/themes/theme-lime.js +558 -558
  42. package/config/themes/theme-orange.js +559 -559
  43. package/config/themes/theme-red.js +558 -558
  44. package/config/themes/theme-white.js +557 -557
  45. package/config/themes/white/var.less +675 -675
  46. package/config/themes/white/white.less +668 -668
  47. package/directives/index.js +23 -23
  48. package/directives/module/draggable.js +56 -56
  49. package/directives/module/permission.js +49 -49
  50. package/directives/module/print.js +1 -1
  51. package/directives/module/vue-print-nb/README.md +63 -63
  52. package/directives/module/vue-print-nb/print.js +94 -94
  53. package/directives/module/vue-print-nb/printarea.js +532 -532
  54. package/index.js +10 -10
  55. package/nstyles/common.less +197 -197
  56. package/nstyles/components/404.less +46 -46
  57. package/nstyles/components/button.less +34 -34
  58. package/nstyles/components/date-picker.less +37 -37
  59. package/nstyles/components/drawer.less +20 -20
  60. package/nstyles/components/dropdown.less +18 -18
  61. package/nstyles/components/excel-flow.less +72 -72
  62. package/nstyles/components/form.less +313 -303
  63. package/nstyles/components/index.less +23 -23
  64. package/nstyles/components/layout/collect.less +10 -10
  65. package/nstyles/components/layout/detail-view.less +107 -107
  66. package/nstyles/components/layout/full-screen.less +7 -7
  67. package/nstyles/components/layout/index.less +7 -7
  68. package/nstyles/components/layout/other-menu.less +142 -142
  69. package/nstyles/components/layout/page-view.less +101 -101
  70. package/nstyles/components/layout/sider-trigger.less +41 -41
  71. package/nstyles/components/layout/tags-nav.less +113 -113
  72. package/nstyles/components/modal.less +85 -85
  73. package/nstyles/components/n-button.less +131 -131
  74. package/nstyles/components/n-image-preview.less +131 -131
  75. package/nstyles/components/n-model/index.less +19 -19
  76. package/nstyles/components/n-model/report-index.less +43 -43
  77. package/nstyles/components/n-panel.less +40 -40
  78. package/nstyles/components/n-picker.less +37 -37
  79. package/nstyles/components/n-sign.less +17 -17
  80. package/nstyles/components/n-tooltip.less +10 -10
  81. package/nstyles/components/panel.less +31 -31
  82. package/nstyles/components/select.less +3 -3
  83. package/nstyles/components/sign.less +27 -27
  84. package/nstyles/components/table.less +315 -315
  85. package/nstyles/components/tree.less +158 -158
  86. package/nstyles/components/upload.less +164 -164
  87. package/nstyles/index.less +5 -5
  88. package/nstyles/reset.less +65 -65
  89. package/nstyles/third/ag.less +174 -174
  90. package/nstyles/third/index.less +11 -11
  91. package/nstyles/third/view-design.less +366 -366
  92. package/nstyles/variables/base.less +143 -143
  93. package/nstyles/variables/index.less +4 -4
  94. package/nstyles/variables/theme/default/button.less +7 -7
  95. package/nstyles/variables/theme/default/common.less +57 -57
  96. package/nstyles/variables/theme/default/index.less +7 -7
  97. package/nstyles/variables/theme/default/layout.less +40 -40
  98. package/nstyles/variables/theme/default/table.less +37 -37
  99. package/nstyles/variables/theme/default/tag.less +3 -3
  100. package/nstyles/variables/theme/default/upload.less +3 -3
  101. package/nstyles/variables/theme/index.less +13 -13
  102. package/nstyles/variables/theme/small/button.less +7 -7
  103. package/nstyles/variables/theme/small/common.less +39 -39
  104. package/nstyles/variables/theme/small/index.less +5 -5
  105. package/nstyles/variables/theme/small/layout.less +21 -21
  106. package/nstyles/variables/theme/small/table.less +17 -17
  107. package/nstyles/variables/theme/small/tag.less +3 -3
  108. package/package.json +1 -1
  109. package/plugin/index.js +12 -12
  110. package/plugin/module/date-format.js +30 -30
  111. package/plugin/module/loading.js +26 -26
  112. package/plugin/module/warn-handler.js +11 -11
  113. package/styles/variables.less +21 -21
  114. package/utils/ajax/cacheconf.js +19 -19
  115. package/utils/ajax/content-type.js +30 -30
  116. package/utils/ajax/index.js +12 -12
  117. package/utils/ajax/interceptors.js +97 -97
  118. package/utils/assist.js +147 -147
  119. package/utils/base64.js +126 -126
  120. package/utils/blob.js +47 -47
  121. package/utils/bus.js +3 -3
  122. package/utils/crypto/index.js +48 -48
  123. package/utils/crypto/md5.js +152 -152
  124. package/utils/crypto/sm3.js +235 -235
  125. package/utils/date.js +381 -381
  126. package/utils/dict/built-in-dict.js +20 -20
  127. package/utils/dict/index.js +167 -167
  128. package/utils/dom.js +38 -38
  129. package/utils/event.js +72 -72
  130. package/utils/excel.js +655 -655
  131. package/utils/file.js +19 -19
  132. package/utils/form/validate.js +29 -29
  133. package/utils/half-year.js +68 -68
  134. package/utils/index.js +41 -41
  135. package/utils/json.js +29 -29
  136. package/utils/lodop.js +165 -165
  137. package/utils/menu/before-close.js +17 -17
  138. package/utils/menu/index.js +395 -395
  139. package/utils/mime_type.js +67 -67
  140. package/utils/modelerUtil.js +227 -227
  141. package/utils/n/api.js +22 -22
  142. package/utils/n/date.js +57 -57
  143. package/utils/n/index.js +9 -9
  144. package/utils/n/is-type.js +176 -176
  145. package/utils/n/number.js +144 -144
  146. package/utils/n/permission-cache.js +11 -11
  147. package/utils/n/reuqest/axiosN.js +17 -17
  148. package/utils/n/reuqest/content-type.js +19 -19
  149. package/utils/n/reuqest/interceptors.js +95 -95
  150. package/utils/n/reuqest/url-params.js +12 -12
  151. package/utils/n/storage.js +51 -51
  152. package/utils/n/token.js +51 -51
  153. package/utils/n/user-cache.js +11 -11
  154. package/utils/n/user.js +34 -34
  155. package/utils/n/uuid.js +16 -16
  156. package/utils/n-generator-routers.js +208 -208
  157. package/utils/n-router.js +205 -205
  158. package/utils/n-theme.js +30 -30
  159. package/utils/number.js +180 -180
  160. package/utils/oss.js +57 -57
  161. package/utils/platform.js +1334 -1334
  162. package/utils/quarter.js +58 -58
  163. package/utils/storage.js +198 -198
  164. package/utils/style.js +24 -24
  165. package/utils/theme.js +138 -138
  166. package/utils/transfer-queue.js +7 -7
  167. package/utils/transform.js +179 -0
  168. package/utils/type.js +102 -102
  169. package/utils/util.js +795 -795
  170. package/utils/validator.js +181 -181
  171. package/utils/vxetable/index.js +25 -25
  172. 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
+ }