@lambo-design/shared 1.0.0-beta.32 → 1.0.0-beta.320

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 (236) hide show
  1. package/config/config.js +20 -3
  2. package/config/index.js +7 -2
  3. package/config/locale.js +61 -0
  4. package/config/themes/atrovirens/atrovirens.css +589 -0
  5. package/config/themes/atrovirens/atrovirens.css.map +1 -0
  6. package/config/themes/atrovirens/atrovirens.less +680 -0
  7. package/config/themes/atrovirens/var.less +688 -0
  8. package/config/themes/blue/blue.css +589 -0
  9. package/config/themes/blue/blue.css.map +1 -0
  10. package/config/themes/blue/blue.less +683 -0
  11. package/config/themes/blue/var.less +691 -0
  12. package/config/themes/blue-white/blue-white.css +589 -0
  13. package/config/themes/blue-white/blue-white.css.map +1 -0
  14. package/config/themes/blue-white/blue-white.less +684 -0
  15. package/config/themes/blue-white/var.less +690 -0
  16. package/config/themes/blue-white-big/blue-white-big.css +589 -0
  17. package/config/themes/blue-white-big/blue-white-big.css.map +1 -0
  18. package/config/themes/blue-white-big/blue-white-big.less +684 -0
  19. package/config/themes/blue-white-big/var.less +690 -0
  20. package/config/themes/blue-white-tight/blue-white-tight.css +590 -0
  21. package/config/themes/blue-white-tight/blue-white-tight.css.map +1 -0
  22. package/config/themes/blue-white-tight/blue-white-tight.less +684 -0
  23. package/config/themes/blue-white-tight/var.less +692 -0
  24. package/config/themes/canglan/canglan.css +588 -0
  25. package/config/themes/canglan/canglan.css.map +1 -0
  26. package/config/themes/canglan/canglan.less +681 -0
  27. package/config/themes/canglan/var.less +692 -0
  28. package/config/themes/cuiwei/cuiwei.css +589 -0
  29. package/config/themes/cuiwei/cuiwei.css.map +1 -0
  30. package/config/themes/cuiwei/cuiwei.less +681 -0
  31. package/config/themes/cuiwei/var.less +690 -0
  32. package/config/themes/danqing/danqing.css +589 -0
  33. package/config/themes/danqing/danqing.css.map +1 -0
  34. package/config/themes/danqing/danqing.less +681 -0
  35. package/config/themes/danqing/danqing.wxss +576 -0
  36. package/config/themes/danqing/var.less +695 -0
  37. package/config/themes/deep/deep.css +589 -0
  38. package/config/themes/deep/deep.css.map +1 -0
  39. package/config/themes/deep/deep.less +681 -0
  40. package/config/themes/deep/var.less +693 -0
  41. package/config/themes/default/default.css +403 -57
  42. package/config/themes/default/default.css.map +1 -1
  43. package/config/themes/default/default.less +380 -16
  44. package/config/themes/default/var.less +389 -11
  45. package/config/themes/eap/eap.css +589 -0
  46. package/config/themes/eap/eap.css.map +1 -0
  47. package/config/themes/eap/eap.less +684 -0
  48. package/config/themes/eap/var.less +692 -0
  49. package/config/themes/gold/gold.css +589 -0
  50. package/config/themes/gold/gold.css.map +1 -0
  51. package/config/themes/gold/gold.less +684 -0
  52. package/config/themes/gold/var.less +385 -5
  53. package/config/themes/index.js +26 -4
  54. package/config/themes/lime/lime.css +589 -0
  55. package/config/themes/lime/lime.css.map +1 -0
  56. package/config/themes/lime/lime.less +684 -0
  57. package/config/themes/lime/var.less +384 -5
  58. package/config/themes/orange/orange.css +353 -7
  59. package/config/themes/orange/orange.css.map +1 -1
  60. package/config/themes/orange/orange.less +365 -0
  61. package/config/themes/orange/var.less +385 -5
  62. package/config/themes/red/red.css +353 -7
  63. package/config/themes/red/red.css.map +1 -1
  64. package/config/themes/red/red.less +365 -0
  65. package/config/themes/red/var.less +385 -5
  66. package/config/themes/sichuan/sichuan.css +589 -0
  67. package/config/themes/sichuan/sichuan.css.map +1 -0
  68. package/config/themes/sichuan/sichuan.less +684 -0
  69. package/config/themes/sichuan/var.less +690 -0
  70. package/config/themes/theme-atrovirens.js +571 -0
  71. package/config/themes/theme-blue.js +571 -0
  72. package/config/themes/theme-bw.js +571 -0
  73. package/config/themes/theme-bwb.js +571 -0
  74. package/config/themes/theme-bwt.js +572 -0
  75. package/config/themes/theme-canglan.js +573 -0
  76. package/config/themes/theme-cuiwei.js +573 -0
  77. package/config/themes/theme-danqing.js +574 -0
  78. package/config/themes/theme-deep.js +571 -0
  79. package/config/themes/theme-default.js +378 -60
  80. package/config/themes/theme-eap.js +571 -0
  81. package/config/themes/theme-gold.js +326 -8
  82. package/config/themes/theme-lime.js +326 -8
  83. package/config/themes/theme-orange.js +560 -29
  84. package/config/themes/theme-red.js +563 -33
  85. package/config/themes/theme-sichuan.js +571 -0
  86. package/config/themes/theme-white.js +571 -0
  87. package/config/themes/white/var.less +691 -0
  88. package/config/themes/white/white.css +589 -0
  89. package/config/themes/white/white.css.map +1 -0
  90. package/config/themes/white/white.less +684 -0
  91. package/directives/module/print.js +1 -0
  92. package/directives/module/vue-print-nb/README.md +63 -0
  93. package/directives/module/vue-print-nb/print.js +94 -0
  94. package/directives/module/vue-print-nb/printarea.js +532 -0
  95. package/index.js +7 -1
  96. package/nstyles/common.less +197 -0
  97. package/nstyles/components/404.less +46 -0
  98. package/nstyles/components/button.less +34 -0
  99. package/nstyles/components/date-picker.less +41 -0
  100. package/nstyles/components/drawer.less +20 -0
  101. package/nstyles/components/dropdown.less +18 -0
  102. package/nstyles/components/excel-flow.less +72 -0
  103. package/nstyles/components/form.less +314 -0
  104. package/nstyles/components/index.less +23 -0
  105. package/nstyles/components/layout/collect.less +10 -0
  106. package/nstyles/components/layout/detail-view.less +107 -0
  107. package/nstyles/components/layout/full-screen.less +7 -0
  108. package/nstyles/components/layout/index.less +7 -0
  109. package/nstyles/components/layout/other-menu.less +142 -0
  110. package/nstyles/components/layout/page-view.less +101 -0
  111. package/nstyles/components/layout/sider-trigger.less +41 -0
  112. package/nstyles/components/layout/tags-nav.less +113 -0
  113. package/nstyles/components/modal.less +90 -0
  114. package/nstyles/components/n-button.less +131 -0
  115. package/nstyles/components/n-image-preview.less +131 -0
  116. package/nstyles/components/n-model/index.less +19 -0
  117. package/nstyles/components/n-model/report-index.less +43 -0
  118. package/nstyles/components/n-panel.less +41 -0
  119. package/nstyles/components/n-picker.less +37 -0
  120. package/nstyles/components/n-sign.less +17 -0
  121. package/nstyles/components/n-tooltip.less +10 -0
  122. package/nstyles/components/panel.less +31 -0
  123. package/nstyles/components/select.less +3 -0
  124. package/nstyles/components/sign.less +27 -0
  125. package/nstyles/components/table.less +413 -0
  126. package/nstyles/components/tree.less +166 -0
  127. package/nstyles/components/upload.less +174 -0
  128. package/nstyles/index.less +5 -0
  129. package/nstyles/reset.less +73 -0
  130. package/nstyles/third/ag.less +226 -0
  131. package/nstyles/third/icons/sort-desc.svg +1 -0
  132. package/nstyles/third/icons/sort-up.svg +1 -0
  133. package/nstyles/third/icons/sorting.svg +1 -0
  134. package/nstyles/third/index.less +11 -0
  135. package/nstyles/third/view-design.less +378 -0
  136. package/nstyles/variables/base.less +143 -0
  137. package/nstyles/variables/index.less +4 -0
  138. package/nstyles/variables/theme/default/button.less +7 -0
  139. package/nstyles/variables/theme/default/common.less +60 -0
  140. package/nstyles/variables/theme/default/index.less +7 -0
  141. package/nstyles/variables/theme/default/layout.less +40 -0
  142. package/nstyles/variables/theme/default/table.less +37 -0
  143. package/nstyles/variables/theme/default/tag.less +3 -0
  144. package/nstyles/variables/theme/default/upload.less +3 -0
  145. package/nstyles/variables/theme/index.less +13 -0
  146. package/nstyles/variables/theme/lsv/button.less +7 -0
  147. package/nstyles/variables/theme/lsv/common.less +39 -0
  148. package/nstyles/variables/theme/lsv/index.less +5 -0
  149. package/nstyles/variables/theme/lsv/layout.less +21 -0
  150. package/nstyles/variables/theme/lsv/table.less +20 -0
  151. package/nstyles/variables/theme/lsv/tag.less +3 -0
  152. package/nstyles/variables/theme/small/button.less +7 -0
  153. package/nstyles/variables/theme/small/common.less +41 -0
  154. package/nstyles/variables/theme/small/index.less +5 -0
  155. package/nstyles/variables/theme/small/layout.less +21 -0
  156. package/nstyles/variables/theme/small/table.less +17 -0
  157. package/nstyles/variables/theme/small/tag.less +3 -0
  158. package/package.json +28 -7
  159. package/plugin/index.js +12 -0
  160. package/plugin/module/date-format.js +30 -0
  161. package/plugin/module/loading.js +26 -0
  162. package/plugin/module/warn-handler.js +11 -0
  163. package/styles/image/indicator-card-header.png +0 -0
  164. package/styles/image/inspur.png +0 -0
  165. package/styles/image/lan_navigator.png +0 -0
  166. package/styles/image/layout-header-bg-canglan.png +0 -0
  167. package/styles/image/layout-header-bg-cuiwei.png +0 -0
  168. package/styles/image/lv_navigator.png +0 -0
  169. package/utils/ajax/abort-controller.js +70 -0
  170. package/utils/ajax/cancel-reason.js +25 -0
  171. package/utils/ajax/cancel-token.js +83 -0
  172. package/utils/ajax/content-type.js +30 -0
  173. package/utils/ajax/headers.js +11 -0
  174. package/utils/ajax/interceptors.js +45 -10
  175. package/utils/ajax/sseFetchUtil.js +118 -0
  176. package/utils/ajax/throttle.js +49 -0
  177. package/utils/assist.js +155 -27
  178. package/utils/base64.js +126 -0
  179. package/utils/blob.js +47 -0
  180. package/utils/context-menu.js +65 -0
  181. package/utils/crypto/aes.js +23 -0
  182. package/utils/crypto/index.js +10 -0
  183. package/utils/crypto/rsa.js +23 -0
  184. package/utils/date.js +334 -305
  185. package/utils/dict/built-in-dict.js +20 -0
  186. package/utils/dict/index.js +191 -0
  187. package/utils/event.js +72 -0
  188. package/utils/excel.js +502 -290
  189. package/utils/file.js +19 -0
  190. package/utils/form/validate.js +29 -0
  191. package/utils/half-year.js +68 -0
  192. package/utils/index.js +37 -0
  193. package/utils/json.js +44 -0
  194. package/utils/locale/en-US.js +174 -0
  195. package/utils/locale/zh-CN.js +174 -0
  196. package/utils/lodop.js +5 -0
  197. package/utils/menu/index.js +292 -15
  198. package/utils/mime_type.js +67 -0
  199. package/utils/modelerUtil.js +4 -1
  200. package/utils/n/api.js +38 -0
  201. package/utils/n/date.js +57 -0
  202. package/utils/n/index.js +10 -0
  203. package/utils/n/is-type.js +176 -0
  204. package/utils/n/number.js +144 -0
  205. package/utils/n/permission-cache.js +11 -0
  206. package/utils/n/reuqest/axiosN.js +17 -0
  207. package/utils/n/reuqest/content-type.js +19 -0
  208. package/utils/n/reuqest/interceptors.js +95 -0
  209. package/utils/n/reuqest/url-params.js +12 -0
  210. package/utils/n/storage.js +51 -0
  211. package/utils/n/token.js +51 -0
  212. package/utils/n/user-cache.js +11 -0
  213. package/utils/n/user.js +34 -0
  214. package/utils/n/uuid.js +16 -0
  215. package/utils/n-generator-routers.js +208 -0
  216. package/utils/n-router.js +205 -0
  217. package/utils/n-theme.js +30 -0
  218. package/utils/number.js +72 -15
  219. package/utils/oss.js +57 -0
  220. package/utils/platform.js +824 -32
  221. package/utils/quarter.js +58 -0
  222. package/utils/storage.js +198 -0
  223. package/utils/style.js +24 -0
  224. package/utils/theme.js +98 -3
  225. package/utils/transfer-queue.js +7 -0
  226. package/utils/transform.js +205 -0
  227. package/utils/type.js +102 -0
  228. package/utils/util.js +795 -0
  229. package/utils/vForm.js +349 -0
  230. package/utils/validator.js +181 -0
  231. package/config/themes/gold/default.css +0 -243
  232. package/config/themes/gold/default.css.map +0 -1
  233. package/config/themes/gold/default.less +0 -320
  234. package/config/themes/lime/default.css +0 -243
  235. package/config/themes/lime/default.css.map +0 -1
  236. package/config/themes/lime/default.less +0 -320
@@ -0,0 +1 @@
1
+ export { default as print } from './vue-print-nb/print.js'
@@ -0,0 +1,63 @@
1
+ # vue-print-nb打印组件
2
+
3
+ 这是一个简单方便的打印组件。
4
+
5
+ ## 用法
6
+ HTML:
7
+ ```html
8
+ <div id="printMe">打印我</div>
9
+
10
+ <!-- 简单用法 -->
11
+ <button v-print="'#printMe'">打印</button>
12
+ <!-- 可传参用法 -->
13
+ <button v-print="printObj">打印</button>
14
+ ```
15
+ javascript:
16
+ ```javascript
17
+ export default {
18
+ data() {
19
+ return {
20
+ printObj: {
21
+ id:'' //需要打印的元素
22
+ ignoreClass:'', //忽视打印的元素
23
+ beforeOpenCallback (vue) {
24
+ console.log('打开之前')
25
+ },
26
+ openCallback (vue) {
27
+ console.log('执行了打印')
28
+ },
29
+ closeCallback (vue) {
30
+ console.log('关闭了打印工具')
31
+ }
32
+ }
33
+ };
34
+ }
35
+ }
36
+ ```
37
+
38
+ ## v-print API
39
+
40
+ | Parame | Explain | Type | OptionalValue | DefaultValue |
41
+ | ------------------------- | ---------------------------------------------------------------- | ------------- | ------------------------------------------------- | ------------ |
42
+ | id | 打印元素的ID | String | — | — |
43
+ | standard | 文档类型(仅打印本地范围) | String | html5/loose/strict | html5 |
44
+ | extraHead | `<head></head>`在节点中添加DOM节点,并使用 `,`(仅打印本地范围) | String | — | — |
45
+ | extraCss | `<link>` 新的CSS样式表,并使用 `,`(仅打印本地范围) | String | — | - |
46
+ | popTitle | `<title></title>` 标签内容 (仅打印本地范围) | String | — | - |
47
+ | openCallback | 调用打印工具的成功回调函数 | Function | Returns the instance of `Vue` called at that time | - |
48
+ | closeCallback | 关闭打印工具成功的回调函数 | Function | Returns the instance of `Vue` called at that time | - |
49
+ | beforeOpenCallback | 调用打印工具前的回调函数 | Function | Returns the instance of `Vue` called at that time | - |
50
+ | url | 打印指定的URL。(不允许同时设置ID) | string | - | - |
51
+ | asyncUrl | Return URL through 'resolve()' and Vue | Function | - | - |
52
+ | preview | 预览工具 | Boolean | - | false |
53
+ | previewTitle | 预览工具标题 | String | - | '打印预览' |
54
+ | previewPrintBtnLabel | 预览工具按钮的名称 | String | - | '打印' |
55
+ | zIndex | 预览工具的CSS:索引 | String,Number | - | 20002 |
56
+ | previewBeforeOpenCallback | 启动预览工具前的回调函数 | Function | Returns the instance of `Vue` | - |
57
+ | previewOpenCallback | 完全打开预览工具后的回调函数 | Function | Returns the instance of `Vue` | - |
58
+ | clickMounted | 单击打印按钮的回调函数 | Function | Returns the instance of `Vue` | - |
59
+
60
+
61
+ 源码存放在components\vue-print-nb\src\packages下,如果想修改可以参考以下文章:
62
+
63
+ [博客园](https://www.cnblogs.com/steamed-twisted-roll/p/10683680.html)
@@ -0,0 +1,94 @@
1
+ /*
2
+ * @Author: lee
3
+ * @Date: 2021-05-10 11:45:50
4
+ * @LastEditors: lee
5
+ * @LastEditTime: 2021-05-20 15:39:43
6
+ * @Description: file content
7
+ */
8
+ import Print from './printarea.js'
9
+ /**
10
+ * @file 打印
11
+ * 指令`v-print`,默认打印整个窗口
12
+ * 传入参数`v-print="'#id'"` , 参数为需要打印局部的盒子标识.
13
+ */
14
+ const addEvent = (element, type, callback) => {
15
+ if (element.addEventListener) {
16
+ element.addEventListener(type, callback, false)
17
+ } else if (element.attachEvent) {
18
+ element.attachEvent('on' + type, callback)
19
+ } else {
20
+ element['on' + type] = callback
21
+ }
22
+ }
23
+ export default {
24
+ directiveName: 'print',
25
+ bind(el, binding, vnode) {
26
+ let vue = vnode.context
27
+ let id = ''
28
+ addEvent(el, 'click', () => {
29
+ vue.$nextTick(() => {
30
+ // if (binding?.value?.clickMounted) {
31
+ // binding.value.clickMounted(vue)
32
+ // }
33
+ if (binding && binding.value && typeof binding.value.clickMounted === 'function') {
34
+ binding.value.clickMounted(vue);
35
+ }
36
+ if (typeof binding.value === 'string') {
37
+ // 全局打印
38
+ id = binding.value
39
+ localPrint()
40
+ } else if (typeof binding.value === 'object' && !!binding.value.id) {
41
+ // 局部打印
42
+ id = binding.value.id
43
+ let ids = id.replace(new RegExp('#', 'g'), '')
44
+ let elsdom = document.getElementById(ids)
45
+ if (!elsdom) console.log('id in Error'), (id = '')
46
+ localPrint()
47
+ // } else if (binding?.value?.preview) {
48
+ } else if (binding && binding.value && binding.value.preview) {
49
+ localPrint()
50
+ } else {
51
+ window.print()
52
+ return
53
+ }
54
+ })
55
+ })
56
+
57
+ const localPrint = () => {
58
+ new Print({
59
+ ids: id, // * 局部打印必传入id
60
+ vue,
61
+ url: binding.value.url, // 打印指定的网址,这里不能跟id共存 如果共存id的优先级会比较高
62
+ standard: '', // 文档类型,默认是html5,可选 html5,loose,strict
63
+ extraHead: binding.value.extraHead, // 附加在head标签上的额外标签,使用逗号分隔
64
+ extraCss: binding.value.extraCss, // 额外的css连接,多个逗号分开
65
+ previewTitle: binding.value.previewTitle || '打印预览', // 打印预览的标题
66
+ zIndex: binding.value.zIndex || 20002, // 预览窗口的z-index
67
+ previewPrintBtnLabel: binding.value.previewPrintBtnLabel || '打印', // 打印预览的标题
68
+ popTitle: binding.value.popTitle, // title的标题
69
+ preview: binding.value.preview || false, // 是否启动预览模式
70
+ asyncUrl: binding.value.asyncUrl,
71
+ ignoreClass: binding.value.ignoreClass, //不打印的元素
72
+ fontFamily: binding.value.fontFamily, // 打印字体
73
+ previewBeforeOpenCallback() {
74
+ // 预览窗口打开之前的callback
75
+ binding.value.previewBeforeOpenCallback && binding.value.previewBeforeOpenCallback(vue)
76
+ },
77
+ previewOpenCallback() {
78
+ // 预览窗口打开之后的callback
79
+ binding.value.previewOpenCallback && binding.value.previewOpenCallback(vue)
80
+ },
81
+ openCallback() {
82
+ // 调用打印之后的回调事件
83
+ binding.value.openCallback && binding.value.openCallback(vue)
84
+ },
85
+ closeCallback() {
86
+ binding.value.closeCallback && binding.value.closeCallback(vue)
87
+ },
88
+ beforeOpenCallback() {
89
+ binding.value.beforeOpenCallback && binding.value.beforeOpenCallback(vue)
90
+ },
91
+ })
92
+ }
93
+ },
94
+ }
@@ -0,0 +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
+ }