n20-common-lib 1.2.39 → 1.2.42

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 (188) hide show
  1. package/README.md +2 -2
  2. package/package.json +88 -88
  3. package/src/_qiankun/index.js +113 -113
  4. package/src/_qiankun/postMessage.js +48 -48
  5. package/src/assets/css/_coreLib.scss +35 -35
  6. package/src/assets/css/cl-anchor.scss +23 -23
  7. package/src/assets/css/cl-approve-card.scss +58 -58
  8. package/src/assets/css/cl-dialog.scss +99 -99
  9. package/src/assets/css/cl-drag-list.scss +22 -22
  10. package/src/assets/css/cl-empty.scss +10 -10
  11. package/src/assets/css/cl-expandable-pane.scss +26 -26
  12. package/src/assets/css/cl-expandable.scss +24 -24
  13. package/src/assets/css/cl-file-upload-table.scss +11 -11
  14. package/src/assets/css/cl-filter.scss +4 -4
  15. package/src/assets/css/cl-flow-step.scss +185 -185
  16. package/src/assets/css/cl-footer-box.scss +10 -10
  17. package/src/assets/css/cl-form-item.scss +612 -612
  18. package/src/assets/css/cl-general-card.scss +11 -11
  19. package/src/assets/css/cl-layout-aside.scss +92 -92
  20. package/src/assets/css/cl-layout-content.scss +16 -16
  21. package/src/assets/css/cl-layout-header.scss +73 -73
  22. package/src/assets/css/cl-layout-tabs.scss +87 -87
  23. package/src/assets/css/cl-layout.scss +97 -97
  24. package/src/assets/css/cl-login-temporary.scss +37 -37
  25. package/src/assets/css/cl-message.scss +75 -75
  26. package/src/assets/css/cl-more-tab.scss +98 -98
  27. package/src/assets/css/cl-nav-menu.scss +5 -5
  28. package/src/assets/css/cl-pagination.scss +128 -128
  29. package/src/assets/css/cl-secondary-tab.scss +53 -53
  30. package/src/assets/css/cl-showcolumn.scss +23 -23
  31. package/src/assets/css/cl-sifting.scss +51 -51
  32. package/src/assets/css/cl-statis.scss +42 -42
  33. package/src/assets/css/cl-step.scss +73 -73
  34. package/src/assets/css/cl-suspend.scss +19 -19
  35. package/src/assets/css/cl-tertiary-tab.scss +54 -54
  36. package/src/assets/css/cl-upload.scss +41 -41
  37. package/src/assets/css/cl-worn-pagination.scss +50 -50
  38. package/src/assets/css/el-button.scss +173 -173
  39. package/src/assets/css/el-table.scss +79 -79
  40. package/src/assets/css/element-variables.scss +1061 -1061
  41. package/src/assets/css/element.dev.scss +21 -21
  42. package/src/assets/css/font-icon.scss +27 -27
  43. package/src/assets/css/index.dev.scss +4 -4
  44. package/src/assets/css/index.scss +11 -11
  45. package/src/assets/css/normalize.scss +726 -726
  46. package/src/assets/css/rootvar.scss +139 -139
  47. package/src/assets/css/select.scss +25 -25
  48. package/src/assets/css/title-pop.scss +4 -4
  49. package/src/assets/getJsonc.js +50 -50
  50. package/src/assets/realUrl.js +12 -12
  51. package/src/components/Anchor/AnchorItem.vue +29 -29
  52. package/src/components/Anchor/index.vue +185 -185
  53. package/src/components/ApprovalButtons/index.vue +233 -233
  54. package/src/components/ApprovalCard/index.vue +128 -128
  55. package/src/components/ApprovalRecord/approvalImg.vue +44 -44
  56. package/src/components/ApprovalRecord/flowDialog.vue +45 -45
  57. package/src/components/ApprovalRecord/index.vue +59 -59
  58. package/src/components/Button/button-group.vue +150 -150
  59. package/src/components/Button/icon-group-button.vue +61 -61
  60. package/src/components/Button/index.vue +56 -56
  61. package/src/components/CascaderArea/index.vue +103 -103
  62. package/src/components/ContentLoading/index.vue +41 -41
  63. package/src/components/ContentNull/index.vue +19 -19
  64. package/src/components/DatePicker/index.vue +27 -27
  65. package/src/components/DatePicker/por.vue +169 -169
  66. package/src/components/Dialog/index.vue +26 -26
  67. package/src/components/Dialog/indexO.vue +116 -116
  68. package/src/components/DragList/index.vue +75 -75
  69. package/src/components/Empty/img/abnormal.svg +108 -108
  70. package/src/components/Empty/img/dispose.svg +71 -71
  71. package/src/components/Empty/img/empty.svg +57 -57
  72. package/src/components/Empty/img/general.svg +58 -58
  73. package/src/components/Empty/img/lock.svg +57 -57
  74. package/src/components/Empty/img/network.svg +59 -59
  75. package/src/components/Empty/img/relevant.svg +68 -68
  76. package/src/components/Empty/img/search.svg +72 -72
  77. package/src/components/Empty/index.vue +92 -92
  78. package/src/components/Expandable/index.vue +49 -49
  79. package/src/components/Expandable/main.vue +52 -52
  80. package/src/components/FileExportAsync/index.vue +178 -178
  81. package/src/components/FileUploadTable/index.vue +484 -484
  82. package/src/components/Filters/index.vue +371 -371
  83. package/src/components/Filters/indexO.vue +104 -104
  84. package/src/components/FlowStep/index.vue +68 -68
  85. package/src/components/FooterBox/index.vue +21 -21
  86. package/src/components/GeneralCard/index.vue +15 -15
  87. package/src/components/InputNumber/index.vue +169 -169
  88. package/src/components/InputNumber/numberRange.vue +47 -47
  89. package/src/components/InputSearch/index.vue +75 -75
  90. package/src/components/Layout/AsideNav/index.vue +120 -119
  91. package/src/components/Layout/AsideNav/menuItem.vue +34 -34
  92. package/src/components/Layout/AsideNav/submenuTitle.vue +26 -26
  93. package/src/components/Layout/HeaderWrap/changePwd.vue +215 -215
  94. package/src/components/Layout/HeaderWrap/index.vue +371 -371
  95. package/src/components/Layout/HeaderWrap/noticePop.vue +316 -316
  96. package/src/components/Layout/SubContent/index.vue +127 -127
  97. package/src/components/Layout/TabsNav/index.vue +170 -170
  98. package/src/components/Layout/index.vue +518 -518
  99. package/src/components/Layout/utils.js +12 -12
  100. package/src/components/LoginTemporary/form.vue +570 -570
  101. package/src/components/LoginTemporary/index.vue +139 -139
  102. package/src/components/LoginTemporary/retrievePw.vue +372 -372
  103. package/src/components/MicroApp/index.js +67 -67
  104. package/src/components/MicroFrame/index.vue +95 -95
  105. package/src/components/MoreTab/index.vue +232 -232
  106. package/src/components/NavMenu/index.vue +60 -60
  107. package/src/components/PageLayout/page.vue +15 -15
  108. package/src/components/Pagination/index.vue +165 -165
  109. package/src/components/SecondaryTab/index.vue +58 -58
  110. package/src/components/SelectLazy/index.vue +75 -75
  111. package/src/components/SelectTree/SelectTreeLazy.vue +241 -241
  112. package/src/components/SelectTree/index.vue +205 -205
  113. package/src/components/ShowColumn/index.vue +213 -213
  114. package/src/components/Sifting/index.vue +99 -99
  115. package/src/components/Statis/index.vue +97 -97
  116. package/src/components/Statis/statisItem.vue +54 -54
  117. package/src/components/Statis/statisPopover.vue +55 -55
  118. package/src/components/Step/index.vue +38 -38
  119. package/src/components/Suspend/index.vue +72 -72
  120. package/src/components/Table/index.vue +209 -209
  121. package/src/components/Table/indexO.vue +149 -149
  122. package/src/components/Task/index.vue +26 -26
  123. package/src/components/TertiaryTab/index.vue +63 -63
  124. package/src/components/TimePicker/index.vue +28 -28
  125. package/src/components/Upload/index.vue +242 -242
  126. package/src/components/WornPagination/index.vue +73 -73
  127. package/src/directives/VClickOutside/index.js +19 -19
  128. package/src/directives/VHas/index.js +58 -58
  129. package/src/directives/VMove/index.js +42 -42
  130. package/src/directives/VTitle/index.js +69 -69
  131. package/src/directives/VTitle/tooltip.vue +21 -21
  132. package/src/index.js +232 -232
  133. package/src/plugins/CompatibleOld/index.js +57 -57
  134. package/src/plugins/Print/index.js +4 -4
  135. package/src/plugins/Print/print-js/.babelrc +12 -12
  136. package/src/plugins/Print/print-js/LICENSE +21 -21
  137. package/src/plugins/Print/print-js/README.md +98 -98
  138. package/src/plugins/Print/print-js/dist/print.css +96 -96
  139. package/src/plugins/Print/print-js/dist/print.js +990 -990
  140. package/src/plugins/Print/print-js/package.json +60 -60
  141. package/src/plugins/Print/print-js/src/index.d.ts +45 -45
  142. package/src/plugins/Print/print-js/src/index.js +10 -10
  143. package/src/plugins/Print/print-js/src/js/browser.js +33 -33
  144. package/src/plugins/Print/print-js/src/js/functions.js +103 -103
  145. package/src/plugins/Print/print-js/src/js/html.js +70 -70
  146. package/src/plugins/Print/print-js/src/js/image.js +48 -48
  147. package/src/plugins/Print/print-js/src/js/init.js +168 -168
  148. package/src/plugins/Print/print-js/src/js/json.js +109 -109
  149. package/src/plugins/Print/print-js/src/js/modal.js +62 -62
  150. package/src/plugins/Print/print-js/src/js/pdf.js +62 -62
  151. package/src/plugins/Print/print-js/src/js/print.js +102 -102
  152. package/src/plugins/Print/print-js/src/js/raw-html.js +15 -15
  153. package/src/plugins/Print/print-js/src/sass/index.scss +13 -13
  154. package/src/plugins/Print/print-js/src/sass/modules/_colors.scss +9 -9
  155. package/src/plugins/Print/print-js/src/sass/partials/_modal.scss +40 -40
  156. package/src/plugins/Print/print-js/src/sass/partials/_spinner.scss +45 -45
  157. package/src/plugins/Print/print.js +2 -2
  158. package/src/plugins/Print/print.scss +1 -1
  159. package/src/plugins/SetMenuTree/index.vue +41 -41
  160. package/src/plugins/SetMenuTree/logoIcon.vue +37 -37
  161. package/src/plugins/SetMenuTree/setmenutree.vue +427 -427
  162. package/src/plugins/SetMenuTree/utils.js +74 -74
  163. package/src/plugins/Sign/InfosecNetSignCNGAgent.min.js +2000 -2000
  164. package/src/plugins/Sign/index.js +65 -65
  165. package/src/plugins/Sign/sign.js +1 -1
  166. package/src/plugins/setTabsForSub.js +2 -2
  167. package/src/utils/auth.js +53 -53
  168. package/src/utils/axios.js +203 -203
  169. package/src/utils/downloadBlob.js +19 -19
  170. package/src/utils/forEachs.js +16 -16
  171. package/src/utils/getScrollContainer.js +43 -43
  172. package/src/utils/i18n/cn2hk.json +1270 -1270
  173. package/src/utils/i18n/index.js +50 -50
  174. package/src/utils/list2tree.js +36 -36
  175. package/src/utils/msgboxPor.js +26 -26
  176. package/src/utils/print.js +161 -161
  177. package/src/utils/relaNo.js +72 -72
  178. package/src/utils/repairElementUI.js +95 -66
  179. package/src/utils/urlToGo.js +82 -82
  180. package/style/css/normalize.scss +726 -0
  181. package/style/index.css +3 -3
  182. package/style/index.css.map +1 -1
  183. package/style/pageDemo/demo-1.vue +131 -0
  184. package/style/pageDemo/demo-2.vue +35 -0
  185. package/style/pageDemo/demo-3.vue +22 -0
  186. package/style/pageDemo/seeCode.js +20 -0
  187. package/style/server-config.jsonc +606 -0
  188. package/src/components/NstcG6Components/NstcDialog/NstcDialog.vue +0 -185
@@ -1,518 +1,518 @@
1
- <template>
2
- <div class="layout-wrap">
3
- <headerWrap
4
- class="header-wrap"
5
- @custom-event="(par) => $emit('custom-event', par)"
6
- />
7
- <asideNav
8
- :menus="menusC"
9
- :active-nav="activeNavC"
10
- :collapse.sync="collapse"
11
- @menu-click="menuClick"
12
- />
13
- <tabsNav
14
- class="tabs-nav-wrap"
15
- :tab-list="tabList"
16
- :active-nav="activeNav"
17
- @tab-click="tabClick"
18
- @tab-close="tabClose"
19
- @tab-close-nexts="tabCloseNexts"
20
- @tab-close-others="tabCloseOthers"
21
- @tab-refresh="tabRefresh"
22
- />
23
- <div ref="content-wrap" class="content-wrap">
24
- <keep-alive v-if="dnsKey">
25
- <router-view
26
- ref="content-cache"
27
- :key="$route.path"
28
- class="content-box"
29
- :no-cache="$route.meta.noCache"
30
- />
31
- </keep-alive>
32
- <router-view
33
- v-else
34
- ref="content-cache"
35
- class="content-box"
36
- :no-cache="$route.meta.noCache"
37
- />
38
- </div>
39
- </div>
40
- </template>
41
-
42
- <script>
43
- const TestProduction = process.env.VUE_APP_TestProduction === 'true'
44
- const routerBase = process.env.BASE_URL
45
- const routerBaseRe = new RegExp('^' + routerBase)
46
-
47
- import { addListener, removeListener } from 'resize-detector'
48
- import forEachs from '../../utils/forEachs'
49
- import { setRela } from '../../utils/relaNo'
50
- import asideNav from './AsideNav/index.vue'
51
- import headerWrap from './HeaderWrap/index.vue'
52
- import tabsNav from './TabsNav/index.vue'
53
-
54
- export default {
55
- name: 'Layout',
56
- components: {
57
- asideNav,
58
- headerWrap,
59
- tabsNav
60
- },
61
- props: {
62
- menus: {
63
- type: Array,
64
- default: () => []
65
- },
66
- keepTab: {
67
- type: String,
68
- default: ''
69
- },
70
- isTest: {
71
- type: Boolean,
72
- default: false
73
- }
74
- },
75
- data() {
76
- let headerH = 48
77
- let tabsH = 35
78
- let clientM = 10 + 1
79
-
80
- return {
81
- dnsKey: this.isTest || TestProduction,
82
- headerH,
83
- tabsH,
84
- clientM,
85
- clientHeight:
86
- document.documentElement.offsetHeight - headerH - tabsH - 2 * clientM,
87
- collapse: window.localStorage.getItem('aside-nav-collapse') === 'true',
88
-
89
- menusC: [],
90
- menuList: [],
91
- tabList: [],
92
- activeNav: ''
93
- }
94
- },
95
- computed: {
96
- activeNavC() {
97
- return getShowUuid(this.activeNav, this.menuList)
98
- }
99
- },
100
- watch: {
101
- menus: {
102
- handler() {
103
- this.getMenuList()
104
- },
105
- immediate: true
106
- },
107
- collapse: {
108
- handler(val) {
109
- if (val) {
110
- document.querySelector('body').classList.add('aside-nav--collapse')
111
- } else {
112
- document.querySelector('body').classList.remove('aside-nav--collapse')
113
- }
114
- },
115
- immediate: true
116
- },
117
- clientHeight: {
118
- handler(val) {
119
- document
120
- .querySelector('body')
121
- .style.setProperty('--client-height', val + 'px')
122
- },
123
- immediate: true
124
- }
125
- },
126
- created() {
127
- window._tab_cache_route = undefined
128
- window._pending_update_cache = {}
129
-
130
- setRela()
131
-
132
- this.getCollapse()
133
- this.getTabList()
134
- setTimeout(() => {
135
- this.getActiveNav()
136
- }, 60)
137
-
138
- window.addEventListener('message', this.setMainTab)
139
-
140
- window.addEventListener('beforeunload', this.setTabList)
141
- },
142
- mounted() {
143
- addListener(this.$refs['content-wrap'], this.contentChange)
144
- },
145
- beforeDestroy() {
146
- removeListener(this.$refs['content-wrap'], this.contentChange)
147
- this.setTabList()
148
-
149
- window.removeEventListener('message', this.setMainTab)
150
-
151
- window.removeEventListener('beforeunload', this.setTabList)
152
- },
153
- methods: {
154
- setMainTab(ev) {
155
- const {
156
- targetName,
157
- replaceTab,
158
- addTab,
159
- closeTab,
160
- setTabName,
161
- addTabO,
162
- refreshTab
163
- } = ev.data
164
-
165
- if (targetName === 'main') {
166
- replaceTab && this.tabReplace(replaceTab)
167
- addTab && this.tabAdd(addTab)
168
- addTabO && this.tabAddO(addTabO)
169
- closeTab && this.tabClose(closeTab)
170
- setTabName && this.tabSetName(setTabName)
171
- refreshTab && this.tabRefresh(refreshTab)
172
- }
173
- },
174
- getCollapse() {
175
- this.collapse =
176
- window.localStorage.getItem('aside-nav-collapse') === 'true'
177
- },
178
- contentChange(dom) {
179
- this.clientHeight = dom.clientHeight - 2 * this.clientM
180
- },
181
- getMenuList() {
182
- let menus = JSON.parse(JSON.stringify(this.menus))
183
- let menuList = []
184
- menus.forEach((sub) => {
185
- let base = sub.base
186
- forEachs(sub.menu, (m, i, a, p) => {
187
- if (m.route) {
188
- m.pid = p.uuid
189
- m.route = base + m.route.replace(/\/$/, '')
190
- m.route || (m.route = '/')
191
- m.uuid = m.route
192
-
193
- menuList.push(m)
194
- }
195
- })
196
- })
197
-
198
- menus.forEach((sub) => {
199
- sub.menu = sub.menu.filter((c) => !c.hide)
200
- forEachs(sub.menu, (m) => {
201
- if (m.children) {
202
- let cN = m.children.filter((c) => !c.hide)
203
- m.children = cN.length ? cN : undefined
204
- }
205
- })
206
- })
207
-
208
- this.menusC = menus
209
- this.menuList = menuList
210
- },
211
- getTabList() {
212
- let tabList = JSON.parse(window.sessionStorage.getItem('tab-list')) || []
213
- this.tabList = tabList
214
- },
215
- setTabList() {
216
- window.sessionStorage.setItem('tab-list', JSON.stringify(this.tabList))
217
- },
218
- getActiveNav() {
219
- let tab = this.tabList.find(
220
- (t) => this.$route.path === t.uuid || this.$route.path === t.route
221
- )
222
- if (tab) {
223
- this.activeNav = tab.uuid
224
- } else if (this.keepTab) {
225
- this.$router.replace({
226
- path: this.keepTab
227
- })
228
- }
229
- },
230
- routerPush({ path, query = {} }) {
231
- if (path !== this.$route.path) {
232
- this.$router.push({
233
- path: path,
234
- query: query
235
- })
236
- } else if (JSON.stringify(query) !== JSON.stringify(this.$route.query)) {
237
- this.$router.push({
238
- path: path,
239
- query: query
240
- })
241
- }
242
- },
243
- menuClick(menu) {
244
- this.routerPush({ path: menu.route })
245
- },
246
- tabClick(tab) {
247
- this.activeNav = tab.uuid
248
-
249
- this.routerPush({
250
- path: tab.route,
251
- query: tab.query
252
- })
253
- },
254
- tabReplace(opt) {
255
- let { path } = opt
256
- path = path.replace(routerBaseRe, '/')
257
- path = path.replace(/\/$/, '')
258
-
259
- let tab = this.tabList.find((t) => t.uuid === this.activeNav)
260
- if (tab) {
261
- if (window._tab_cache_route === tab.route) {
262
- setTimeout(() => {
263
- window._tab_cache_route = undefined
264
- }, 100)
265
- } else {
266
- this.removeOcache({ path: tab.route })
267
- }
268
-
269
- this.$set(tab, 'route', path)
270
- for (let k in opt) {
271
- k !== 'path' && this.$set(tab, k, opt[k])
272
- }
273
- }
274
- },
275
- tabAddO(opt) {
276
- let { path, query } = opt
277
- path = path.replace(routerBaseRe, '/')
278
- path = path.replace(/\/$/, '')
279
- path || (path = '/')
280
-
281
- let tab = this.tabList.find((t) => t.route === path)
282
- if (tab) {
283
- this.activeNav = tab.uuid
284
-
285
- let queryStr = JSON.stringify({ ...tab.query, _fromNo: undefined })
286
- let queryStrN = JSON.stringify({ ...query, _fromNo: undefined })
287
-
288
- this.$set(tab, 'route', path)
289
- for (let k in opt) {
290
- k !== 'path' && this.$set(tab, k, opt[k])
291
- }
292
-
293
- queryStr !== queryStrN && this.tabRefresh({ uuid: tab.uuid })
294
- } else {
295
- let tabI = this.tabList.findIndex((t) => t.uuid === path)
296
- tab = this.tabList[tabI]
297
- if (tab) {
298
- if (window._tab_cache_route === tab.route) {
299
- setTimeout(() => {
300
- window._tab_cache_route = undefined
301
- }, 100)
302
- } else {
303
- this.removeOcache({ path: tab.route })
304
- }
305
-
306
- for (let k in opt) {
307
- k !== 'path' && this.$set(tab, k, opt[k])
308
- }
309
- } else {
310
- let tabN = {
311
- ...opt,
312
- route: path,
313
- path: undefined,
314
- uuid: path,
315
- keep: path === this.keepTab ? true : undefined
316
- }
317
- this.tabList.push(tabN)
318
- this.activeNav = path
319
- }
320
- }
321
- },
322
- tabAdd(opt) {
323
- let { path, query } = opt
324
- this.$router.push({ path, query })
325
- this.$nextTick(() => {
326
- this.tabAddO(opt)
327
- })
328
- },
329
- tabClose({ uuid, path }) {
330
- let tabI = -1
331
- if (uuid) {
332
- tabI = this.tabList.findIndex((t) => t.uuid === uuid)
333
- } else if (path) {
334
- tabI = this.tabList.findIndex((t) => t.route === path)
335
- }
336
- if (tabI !== -1) {
337
- uuid = this.tabList[tabI].uuid
338
- let path = this.tabList[tabI].route
339
-
340
- this.tabList.splice(tabI, 1)
341
- if (uuid === this.activeNav) {
342
- let tabN = this.tabList[tabI] || this.tabList[tabI - 1]
343
- if (tabN) {
344
- if (tabN.uuid !== this.activeNav) {
345
- this.routerPush({
346
- path: tabN.route,
347
- query: tabN.query
348
- })
349
- }
350
- } else {
351
- this.routerPush({
352
- path: '/'
353
- })
354
- }
355
- }
356
-
357
- setTimeout(() => {
358
- this.removeOcache({ path: path })
359
- }, 100)
360
- } else {
361
- console.warn('请求关闭的Tab页签不存在')
362
- }
363
- },
364
- tabCloseNexts(uuid) {
365
- let tabI = this.tabList.findIndex((t) => t.uuid === uuid)
366
- let nextTabs = this.tabList.splice(tabI + 1)
367
-
368
- if (!this.tabList.some((t) => t.uuid === this.activeNav)) {
369
- let tab = this.tabList[tabI]
370
- this.activeNav = tab.uuid
371
- this.routerPush({
372
- path: tab.route,
373
- query: tab.query
374
- })
375
- }
376
-
377
- setTimeout(() => {
378
- nextTabs.forEach((t) => {
379
- this.removeOcache({ path: t.route })
380
- })
381
- nextTabs = undefined
382
- }, 100)
383
- },
384
- tabCloseOthers(uuid) {
385
- let tab = this.tabList.find((t) => t.uuid === uuid)
386
- let tabs = []
387
- let otherTabs = []
388
- this.tabList.forEach((t) => {
389
- if (t.uuid === uuid) {
390
- tabs.push(t)
391
- tab = t
392
- } else if (t.keep) {
393
- tabs.push(t)
394
- } else {
395
- otherTabs.push(t)
396
- }
397
- })
398
-
399
- this.tabList = tabs
400
- if (this.activeNav !== tab.uuid) {
401
- this.activeNav = tab.uuid
402
- this.routerPush({
403
- path: tab.route,
404
- query: tab.query
405
- })
406
- }
407
-
408
- setTimeout(() => {
409
- otherTabs.forEach((t) => {
410
- this.removeOcache({ path: t.route })
411
- })
412
- otherTabs = undefined
413
- }, 100)
414
- },
415
- tabRefresh({ uuid, path }) {
416
- let tab = undefined
417
- if (uuid) {
418
- tab = this.tabList.find((t) => uuid === t.uuid)
419
- } else if (path) {
420
- tab = this.tabList.find((t) => t.route === path)
421
- }
422
-
423
- if (
424
- tab.uuid === this.activeNav &&
425
- this.$route.matched[0]['path'] !== '*'
426
- ) {
427
- let path = this.$route.path
428
- let oTab = JSON.parse(
429
- JSON.stringify({
430
- path: this.$route.path,
431
- query: this.$route.query
432
- })
433
- )
434
-
435
- this.$router.replace('/loading')
436
- this.removeOcache({ path: path })
437
- this.$nextTick(() => {
438
- this.$router.replace(oTab)
439
- })
440
- } else {
441
- this.removeOcache({ path: tab.route })
442
- }
443
- },
444
- tabSetName({ uuid, path, title }) {
445
- let tabI = -1
446
- if (uuid) {
447
- tabI = this.tabList.findIndex((t) => t.uuid === uuid)
448
- } else if (path) {
449
- tabI = this.tabList.findIndex((t) => t.route === path)
450
- }
451
- if (tabI !== -1) {
452
- let tab = this.tabList[tabI]
453
- tab.title = title
454
- }
455
- },
456
- removeOcache({ path }) {
457
- if (!this.dnsKey) return
458
-
459
- let componentInstance =
460
- this.$refs['content-cache']?.$vnode.parent.componentInstance
461
-
462
- if (componentInstance) {
463
- let kI = componentInstance.keys.findIndex((k) => k === path)
464
- if (kI !== -1) {
465
- window._pending_update_cache[path] = true
466
- window.postMessage({
467
- updateCache: true,
468
- targetName: '*',
469
- originName: 'main'
470
- })
471
- let isNull = componentInstance.cache[path].componentInstance.isNull
472
- if (isNull) {
473
- return
474
- }
475
- let destroy = componentInstance.cache[path].componentInstance.destroy
476
- destroy && destroy()
477
-
478
- delete componentInstance.cache[path]
479
- componentInstance.keys.splice(kI, 1)
480
-
481
- // console.log({
482
- // cache: componentInstance.cache,
483
- // keys: componentInstance.keys
484
- // })
485
- } else {
486
- window._pending_update_cache[path] = true
487
- window.postMessage({
488
- updateCache: true,
489
- targetName: '*',
490
- originName: 'main'
491
- })
492
- }
493
- } else {
494
- window._pending_update_cache[path] = true
495
- window.postMessage({
496
- updateCache: true,
497
- targetName: '*',
498
- originName: 'main'
499
- })
500
- }
501
- }
502
- }
503
- }
504
-
505
- function getShowUuid(uuid, list) {
506
- let menu = list.find((m) => m.uuid === uuid)
507
- if (menu) {
508
- return menu.hide ? menu.pid : menu.uuid
509
- }
510
-
511
- let pid = uuid.replace(/\/[^\/]+\/*$/, '')
512
- if (pid !== '' && pid !== '/') {
513
- return getShowUuid(pid, list)
514
- }
515
-
516
- return '/'
517
- }
518
- </script>
1
+ <template>
2
+ <div class="layout-wrap">
3
+ <headerWrap
4
+ class="header-wrap"
5
+ @custom-event="(par) => $emit('custom-event', par)"
6
+ />
7
+ <asideNav
8
+ :menus="menusC"
9
+ :active-nav="activeNavC"
10
+ :collapse.sync="collapse"
11
+ @menu-click="menuClick"
12
+ />
13
+ <tabsNav
14
+ class="tabs-nav-wrap"
15
+ :tab-list="tabList"
16
+ :active-nav="activeNav"
17
+ @tab-click="tabClick"
18
+ @tab-close="tabClose"
19
+ @tab-close-nexts="tabCloseNexts"
20
+ @tab-close-others="tabCloseOthers"
21
+ @tab-refresh="tabRefresh"
22
+ />
23
+ <div ref="content-wrap" class="content-wrap">
24
+ <keep-alive v-if="dnsKey">
25
+ <router-view
26
+ ref="content-cache"
27
+ :key="$route.path"
28
+ class="content-box"
29
+ :no-cache="$route.meta.noCache"
30
+ />
31
+ </keep-alive>
32
+ <router-view
33
+ v-else
34
+ ref="content-cache"
35
+ class="content-box"
36
+ :no-cache="$route.meta.noCache"
37
+ />
38
+ </div>
39
+ </div>
40
+ </template>
41
+
42
+ <script>
43
+ const TestProduction = process.env.VUE_APP_TestProduction === 'true'
44
+ const routerBase = process.env.BASE_URL
45
+ const routerBaseRe = new RegExp('^' + routerBase)
46
+
47
+ import { addListener, removeListener } from 'resize-detector'
48
+ import forEachs from '../../utils/forEachs'
49
+ import { setRela } from '../../utils/relaNo'
50
+ import asideNav from './AsideNav/index.vue'
51
+ import headerWrap from './HeaderWrap/index.vue'
52
+ import tabsNav from './TabsNav/index.vue'
53
+
54
+ export default {
55
+ name: 'Layout',
56
+ components: {
57
+ asideNav,
58
+ headerWrap,
59
+ tabsNav
60
+ },
61
+ props: {
62
+ menus: {
63
+ type: Array,
64
+ default: () => []
65
+ },
66
+ keepTab: {
67
+ type: String,
68
+ default: ''
69
+ },
70
+ isTest: {
71
+ type: Boolean,
72
+ default: false
73
+ }
74
+ },
75
+ data() {
76
+ let headerH = 48
77
+ let tabsH = 35
78
+ let clientM = 10 + 1
79
+
80
+ return {
81
+ dnsKey: this.isTest || TestProduction,
82
+ headerH,
83
+ tabsH,
84
+ clientM,
85
+ clientHeight:
86
+ document.documentElement.offsetHeight - headerH - tabsH - 2 * clientM,
87
+ collapse: window.localStorage.getItem('aside-nav-collapse') === 'true',
88
+
89
+ menusC: [],
90
+ menuList: [],
91
+ tabList: [],
92
+ activeNav: ''
93
+ }
94
+ },
95
+ computed: {
96
+ activeNavC() {
97
+ return getShowUuid(this.activeNav, this.menuList)
98
+ }
99
+ },
100
+ watch: {
101
+ menus: {
102
+ handler() {
103
+ this.getMenuList()
104
+ },
105
+ immediate: true
106
+ },
107
+ collapse: {
108
+ handler(val) {
109
+ if (val) {
110
+ document.querySelector('body').classList.add('aside-nav--collapse')
111
+ } else {
112
+ document.querySelector('body').classList.remove('aside-nav--collapse')
113
+ }
114
+ },
115
+ immediate: true
116
+ },
117
+ clientHeight: {
118
+ handler(val) {
119
+ document
120
+ .querySelector('body')
121
+ .style.setProperty('--client-height', val + 'px')
122
+ },
123
+ immediate: true
124
+ }
125
+ },
126
+ created() {
127
+ window._tab_cache_route = undefined
128
+ window._pending_update_cache = {}
129
+
130
+ setRela()
131
+
132
+ this.getCollapse()
133
+ this.getTabList()
134
+ setTimeout(() => {
135
+ this.getActiveNav()
136
+ }, 60)
137
+
138
+ window.addEventListener('message', this.setMainTab)
139
+
140
+ window.addEventListener('beforeunload', this.setTabList)
141
+ },
142
+ mounted() {
143
+ addListener(this.$refs['content-wrap'], this.contentChange)
144
+ },
145
+ beforeDestroy() {
146
+ removeListener(this.$refs['content-wrap'], this.contentChange)
147
+ this.setTabList()
148
+
149
+ window.removeEventListener('message', this.setMainTab)
150
+
151
+ window.removeEventListener('beforeunload', this.setTabList)
152
+ },
153
+ methods: {
154
+ setMainTab(ev) {
155
+ const {
156
+ targetName,
157
+ replaceTab,
158
+ addTab,
159
+ closeTab,
160
+ setTabName,
161
+ addTabO,
162
+ refreshTab
163
+ } = ev.data
164
+
165
+ if (targetName === 'main') {
166
+ replaceTab && this.tabReplace(replaceTab)
167
+ addTab && this.tabAdd(addTab)
168
+ addTabO && this.tabAddO(addTabO)
169
+ closeTab && this.tabClose(closeTab)
170
+ setTabName && this.tabSetName(setTabName)
171
+ refreshTab && this.tabRefresh(refreshTab)
172
+ }
173
+ },
174
+ getCollapse() {
175
+ this.collapse =
176
+ window.localStorage.getItem('aside-nav-collapse') === 'true'
177
+ },
178
+ contentChange(dom) {
179
+ this.clientHeight = dom.clientHeight - 2 * this.clientM
180
+ },
181
+ getMenuList() {
182
+ let menus = JSON.parse(JSON.stringify(this.menus))
183
+ let menuList = []
184
+ menus.forEach((sub) => {
185
+ let base = sub.base
186
+ forEachs(sub.menu, (m, i, a, p) => {
187
+ if (m.route) {
188
+ m.pid = p.uuid
189
+ m.route = base + m.route.replace(/\/$/, '')
190
+ m.route || (m.route = '/')
191
+ m.uuid = m.route
192
+
193
+ menuList.push(m)
194
+ }
195
+ })
196
+ })
197
+
198
+ menus.forEach((sub) => {
199
+ sub.menu = sub.menu.filter((c) => !c.hide)
200
+ forEachs(sub.menu, (m) => {
201
+ if (m.children) {
202
+ let cN = m.children.filter((c) => !c.hide)
203
+ m.children = cN.length ? cN : undefined
204
+ }
205
+ })
206
+ })
207
+
208
+ this.menusC = menus
209
+ this.menuList = menuList
210
+ },
211
+ getTabList() {
212
+ let tabList = JSON.parse(window.sessionStorage.getItem('tab-list')) || []
213
+ this.tabList = tabList
214
+ },
215
+ setTabList() {
216
+ window.sessionStorage.setItem('tab-list', JSON.stringify(this.tabList))
217
+ },
218
+ getActiveNav() {
219
+ let tab = this.tabList.find(
220
+ (t) => this.$route.path === t.uuid || this.$route.path === t.route
221
+ )
222
+ if (tab) {
223
+ this.activeNav = tab.uuid
224
+ } else if (this.keepTab) {
225
+ this.$router.replace({
226
+ path: this.keepTab
227
+ })
228
+ }
229
+ },
230
+ routerPush({ path, query = {} }) {
231
+ if (path !== this.$route.path) {
232
+ this.$router.push({
233
+ path: path,
234
+ query: query
235
+ })
236
+ } else if (JSON.stringify(query) !== JSON.stringify(this.$route.query)) {
237
+ this.$router.push({
238
+ path: path,
239
+ query: query
240
+ })
241
+ }
242
+ },
243
+ menuClick(menu) {
244
+ this.routerPush({ path: menu.route })
245
+ },
246
+ tabClick(tab) {
247
+ this.activeNav = tab.uuid
248
+
249
+ this.routerPush({
250
+ path: tab.route,
251
+ query: tab.query
252
+ })
253
+ },
254
+ tabReplace(opt) {
255
+ let { path } = opt
256
+ path = path.replace(routerBaseRe, '/')
257
+ path = path.replace(/\/$/, '')
258
+
259
+ let tab = this.tabList.find((t) => t.uuid === this.activeNav)
260
+ if (tab) {
261
+ if (window._tab_cache_route === tab.route) {
262
+ setTimeout(() => {
263
+ window._tab_cache_route = undefined
264
+ }, 100)
265
+ } else {
266
+ this.removeOcache({ path: tab.route })
267
+ }
268
+
269
+ this.$set(tab, 'route', path)
270
+ for (let k in opt) {
271
+ k !== 'path' && this.$set(tab, k, opt[k])
272
+ }
273
+ }
274
+ },
275
+ tabAddO(opt) {
276
+ let { path, query } = opt
277
+ path = path.replace(routerBaseRe, '/')
278
+ path = path.replace(/\/$/, '')
279
+ path || (path = '/')
280
+
281
+ let tab = this.tabList.find((t) => t.route === path)
282
+ if (tab) {
283
+ this.activeNav = tab.uuid
284
+
285
+ let queryStr = JSON.stringify({ ...tab.query, _fromNo: undefined })
286
+ let queryStrN = JSON.stringify({ ...query, _fromNo: undefined })
287
+
288
+ this.$set(tab, 'route', path)
289
+ for (let k in opt) {
290
+ k !== 'path' && this.$set(tab, k, opt[k])
291
+ }
292
+
293
+ queryStr !== queryStrN && this.tabRefresh({ uuid: tab.uuid })
294
+ } else {
295
+ let tabI = this.tabList.findIndex((t) => t.uuid === path)
296
+ tab = this.tabList[tabI]
297
+ if (tab) {
298
+ if (window._tab_cache_route === tab.route) {
299
+ setTimeout(() => {
300
+ window._tab_cache_route = undefined
301
+ }, 100)
302
+ } else {
303
+ this.removeOcache({ path: tab.route })
304
+ }
305
+
306
+ for (let k in opt) {
307
+ k !== 'path' && this.$set(tab, k, opt[k])
308
+ }
309
+ } else {
310
+ let tabN = {
311
+ ...opt,
312
+ route: path,
313
+ path: undefined,
314
+ uuid: path,
315
+ keep: path === this.keepTab ? true : undefined
316
+ }
317
+ this.tabList.push(tabN)
318
+ this.activeNav = path
319
+ }
320
+ }
321
+ },
322
+ tabAdd(opt) {
323
+ let { path, query } = opt
324
+ this.$router.push({ path, query })
325
+ this.$nextTick(() => {
326
+ this.tabAddO(opt)
327
+ })
328
+ },
329
+ tabClose({ uuid, path }) {
330
+ let tabI = -1
331
+ if (uuid) {
332
+ tabI = this.tabList.findIndex((t) => t.uuid === uuid)
333
+ } else if (path) {
334
+ tabI = this.tabList.findIndex((t) => t.route === path)
335
+ }
336
+ if (tabI !== -1) {
337
+ uuid = this.tabList[tabI].uuid
338
+ let path = this.tabList[tabI].route
339
+
340
+ this.tabList.splice(tabI, 1)
341
+ if (uuid === this.activeNav) {
342
+ let tabN = this.tabList[tabI] || this.tabList[tabI - 1]
343
+ if (tabN) {
344
+ if (tabN.uuid !== this.activeNav) {
345
+ this.routerPush({
346
+ path: tabN.route,
347
+ query: tabN.query
348
+ })
349
+ }
350
+ } else {
351
+ this.routerPush({
352
+ path: '/'
353
+ })
354
+ }
355
+ }
356
+
357
+ setTimeout(() => {
358
+ this.removeOcache({ path: path })
359
+ }, 100)
360
+ } else {
361
+ console.warn('请求关闭的Tab页签不存在')
362
+ }
363
+ },
364
+ tabCloseNexts(uuid) {
365
+ let tabI = this.tabList.findIndex((t) => t.uuid === uuid)
366
+ let nextTabs = this.tabList.splice(tabI + 1)
367
+
368
+ if (!this.tabList.some((t) => t.uuid === this.activeNav)) {
369
+ let tab = this.tabList[tabI]
370
+ this.activeNav = tab.uuid
371
+ this.routerPush({
372
+ path: tab.route,
373
+ query: tab.query
374
+ })
375
+ }
376
+
377
+ setTimeout(() => {
378
+ nextTabs.forEach((t) => {
379
+ this.removeOcache({ path: t.route })
380
+ })
381
+ nextTabs = undefined
382
+ }, 100)
383
+ },
384
+ tabCloseOthers(uuid) {
385
+ let tab = this.tabList.find((t) => t.uuid === uuid)
386
+ let tabs = []
387
+ let otherTabs = []
388
+ this.tabList.forEach((t) => {
389
+ if (t.uuid === uuid) {
390
+ tabs.push(t)
391
+ tab = t
392
+ } else if (t.keep) {
393
+ tabs.push(t)
394
+ } else {
395
+ otherTabs.push(t)
396
+ }
397
+ })
398
+
399
+ this.tabList = tabs
400
+ if (this.activeNav !== tab.uuid) {
401
+ this.activeNav = tab.uuid
402
+ this.routerPush({
403
+ path: tab.route,
404
+ query: tab.query
405
+ })
406
+ }
407
+
408
+ setTimeout(() => {
409
+ otherTabs.forEach((t) => {
410
+ this.removeOcache({ path: t.route })
411
+ })
412
+ otherTabs = undefined
413
+ }, 100)
414
+ },
415
+ tabRefresh({ uuid, path }) {
416
+ let tab = undefined
417
+ if (uuid) {
418
+ tab = this.tabList.find((t) => uuid === t.uuid)
419
+ } else if (path) {
420
+ tab = this.tabList.find((t) => t.route === path)
421
+ }
422
+
423
+ if (
424
+ tab.uuid === this.activeNav &&
425
+ this.$route.matched[0]['path'] !== '*'
426
+ ) {
427
+ let path = this.$route.path
428
+ let oTab = JSON.parse(
429
+ JSON.stringify({
430
+ path: this.$route.path,
431
+ query: this.$route.query
432
+ })
433
+ )
434
+
435
+ this.$router.replace('/loading')
436
+ this.removeOcache({ path: path })
437
+ this.$nextTick(() => {
438
+ this.$router.replace(oTab)
439
+ })
440
+ } else {
441
+ this.removeOcache({ path: tab.route })
442
+ }
443
+ },
444
+ tabSetName({ uuid, path, title }) {
445
+ let tabI = -1
446
+ if (uuid) {
447
+ tabI = this.tabList.findIndex((t) => t.uuid === uuid)
448
+ } else if (path) {
449
+ tabI = this.tabList.findIndex((t) => t.route === path)
450
+ }
451
+ if (tabI !== -1) {
452
+ let tab = this.tabList[tabI]
453
+ tab.title = title
454
+ }
455
+ },
456
+ removeOcache({ path }) {
457
+ if (!this.dnsKey) return
458
+
459
+ let componentInstance =
460
+ this.$refs['content-cache']?.$vnode.parent.componentInstance
461
+
462
+ if (componentInstance) {
463
+ let kI = componentInstance.keys.findIndex((k) => k === path)
464
+ if (kI !== -1) {
465
+ window._pending_update_cache[path] = true
466
+ window.postMessage({
467
+ updateCache: true,
468
+ targetName: '*',
469
+ originName: 'main'
470
+ })
471
+ let isNull = componentInstance.cache[path].componentInstance.isNull
472
+ if (isNull) {
473
+ return
474
+ }
475
+ let destroy = componentInstance.cache[path].componentInstance.destroy
476
+ destroy && destroy()
477
+
478
+ delete componentInstance.cache[path]
479
+ componentInstance.keys.splice(kI, 1)
480
+
481
+ // console.log({
482
+ // cache: componentInstance.cache,
483
+ // keys: componentInstance.keys
484
+ // })
485
+ } else {
486
+ window._pending_update_cache[path] = true
487
+ window.postMessage({
488
+ updateCache: true,
489
+ targetName: '*',
490
+ originName: 'main'
491
+ })
492
+ }
493
+ } else {
494
+ window._pending_update_cache[path] = true
495
+ window.postMessage({
496
+ updateCache: true,
497
+ targetName: '*',
498
+ originName: 'main'
499
+ })
500
+ }
501
+ }
502
+ }
503
+ }
504
+
505
+ function getShowUuid(uuid, list) {
506
+ let menu = list.find((m) => m.uuid === uuid)
507
+ if (menu) {
508
+ return menu.hide ? menu.pid : menu.uuid
509
+ }
510
+
511
+ let pid = uuid.replace(/\/[^\/]+\/*$/, '')
512
+ if (pid !== '' && pid !== '/') {
513
+ return getShowUuid(pid, list)
514
+ }
515
+
516
+ return '/'
517
+ }
518
+ </script>