vue2-client 1.6.49 → 1.7.0

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 (119) hide show
  1. package/.env +15 -15
  2. package/CHANGELOG.md +628 -625
  3. package/index.js +30 -30
  4. package/package.json +81 -81
  5. package/src/base-client/components/common/AddressSearchCombobox/AddressSearchCombobox.vue +316 -316
  6. package/src/base-client/components/common/CitySelect/CitySelect.vue +247 -247
  7. package/src/base-client/components/common/CreateQuery/CreateQuery.vue +667 -667
  8. package/src/base-client/components/common/CreateQuery/CreateQueryItem.vue +733 -733
  9. package/src/base-client/components/common/CreateSimpleFormQuery/CreateSimpleFormQuery.vue +468 -462
  10. package/src/base-client/components/common/CreateSimpleFormQuery/CreateSimpleFormQueryItem.vue +508 -508
  11. package/src/base-client/components/common/FormGroupEdit/FormGroupEdit.vue +146 -140
  12. package/src/base-client/components/common/FormGroupQuery/FormGroupQuery.vue +165 -165
  13. package/src/base-client/components/common/JSONToTree/jsontotree.vue +275 -275
  14. package/src/base-client/components/common/Upload/Upload.vue +168 -168
  15. package/src/base-client/components/common/XAddForm/XAddForm.vue +325 -325
  16. package/src/base-client/components/common/XAddNativeForm/XAddNativeForm.vue +279 -279
  17. package/src/base-client/components/common/XCard/XCard.vue +64 -64
  18. package/src/base-client/components/common/XForm/XForm.vue +180 -180
  19. package/src/base-client/components/common/XForm/XFormItem.vue +513 -513
  20. package/src/base-client/components/common/XForm/XTreeSelect.vue +184 -184
  21. package/src/base-client/components/common/XFormCol/XFormCol.vue +38 -38
  22. package/src/base-client/components/common/XFormTable/XFormTable.vue +344 -336
  23. package/src/base-client/components/common/XFormTable/index.md +97 -97
  24. package/src/base-client/components/common/XImportExcel/XImportExcel.vue +132 -132
  25. package/src/base-client/components/common/XTable/XTable.vue +506 -506
  26. package/src/base-client/components/common/XTreeOne/XTreeOne.vue +111 -111
  27. package/src/base-client/components/system/DictionaryDetailsView/DictionaryDetailsView.vue +231 -231
  28. package/src/base-client/components/system/QueryParamsDetailsView/QueryParamsDetailsView.vue +281 -281
  29. package/src/base-client/components/ticket/TicketDetailsView/TicketDetailsView.vue +807 -807
  30. package/src/base-client/components/ticket/TicketDetailsView/index.md +29 -29
  31. package/src/base-client/components/ticket/TicketDetailsView/part/TicketDetailsFlow.vue +260 -260
  32. package/src/base-client/components/ticket/TicketSubmitSuccessView/TicketSubmitSuccessView.vue +532 -532
  33. package/src/base-client/components/ticket/TicketSubmitSuccessView/index.md +29 -29
  34. package/src/base-client/plugins/AppData.js +76 -76
  35. package/src/base-client/plugins/GetLoginInfoService.js +179 -179
  36. package/src/base-client/plugins/PagedList.js +177 -177
  37. package/src/base-client/plugins/compatible/LoginServiceOA.js +20 -20
  38. package/src/base-client/plugins/i18n-extend.js +32 -32
  39. package/src/components/Ellipsis/Ellipsis.vue +65 -65
  40. package/src/components/Ellipsis/index.md +38 -38
  41. package/src/components/NumberInfo/index.md +43 -43
  42. package/src/components/STable/README.md +341 -341
  43. package/src/components/STable/index.js +318 -318
  44. package/src/components/Trend/index.md +45 -45
  45. package/src/components/checkbox/ColorCheckbox.vue +157 -157
  46. package/src/components/checkbox/ImgCheckbox.vue +163 -163
  47. package/src/components/exception/ExceptionPage.vue +70 -70
  48. package/src/components/form/FormRow.vue +52 -52
  49. package/src/components/index.js +36 -36
  50. package/src/components/menu/SideMenu.vue +62 -62
  51. package/src/components/menu/menu.js +273 -273
  52. package/src/components/page/header/index.less +40 -40
  53. package/src/components/setting/Setting.vue +235 -235
  54. package/src/components/table/StandardTable.vue +141 -141
  55. package/src/components/table/advance/ActionColumns.vue +158 -158
  56. package/src/components/table/advance/SearchArea.vue +355 -355
  57. package/src/components/tool/AStepItem.vue +60 -60
  58. package/src/components/tool/AvatarList.vue +68 -68
  59. package/src/components/tool/Drawer.vue +142 -142
  60. package/src/components/tool/TagSelect.vue +83 -83
  61. package/src/components/transition/PageToggleTransition.vue +97 -97
  62. package/src/config/CreateQueryConfig.js +307 -307
  63. package/src/config/default/admin.config.js +18 -18
  64. package/src/config/replacer/resolve.config.js +67 -67
  65. package/src/layouts/CommonLayout.vue +42 -42
  66. package/src/layouts/ComponentLayoutOne.vue +47 -47
  67. package/src/layouts/PageLayout.vue +151 -151
  68. package/src/layouts/SinglePageView.vue +116 -116
  69. package/src/layouts/footer/PageFooter.vue +49 -49
  70. package/src/layouts/header/AdminHeader.vue +134 -134
  71. package/src/layouts/header/HeaderAvatar.vue +64 -64
  72. package/src/layouts/header/HeaderNotice.vue +176 -176
  73. package/src/layouts/header/HeaderSearch.vue +67 -67
  74. package/src/layouts/header/InstitutionDetail.vue +181 -181
  75. package/src/layouts/header/index.less +92 -92
  76. package/src/layouts/tabs/TabsHead.vue +190 -190
  77. package/src/layouts/tabs/TabsView.vue +379 -379
  78. package/src/mock/goods/index.js +108 -108
  79. package/src/pages/CreateQueryPage.vue +84 -84
  80. package/src/pages/login/Login.vue +369 -369
  81. package/src/pages/report/ReportTable.js +124 -124
  82. package/src/pages/report/ReportTableHome.vue +28 -28
  83. package/src/pages/resourceManage/orgListManage.vue +98 -98
  84. package/src/pages/system/dictionary/index.vue +43 -43
  85. package/src/pages/system/file/index.vue +317 -317
  86. package/src/pages/system/monitor/loginInfor/index.vue +36 -36
  87. package/src/pages/system/monitor/operLog/index.vue +36 -36
  88. package/src/pages/system/settings/index.vue +126 -126
  89. package/src/pages/system/settings/modifyPassword.vue +109 -109
  90. package/src/router/async/config.async.js +28 -28
  91. package/src/router/async/router.map.js +66 -68
  92. package/src/router/index.js +27 -27
  93. package/src/services/api/DictionaryDetailsViewApi.js +6 -6
  94. package/src/services/api/LogDetailsViewApi.js +10 -10
  95. package/src/services/api/QueryParamsDetailsViewApi.js +6 -6
  96. package/src/services/api/TicketDetailsViewApi.js +34 -34
  97. package/src/services/api/cas.js +79 -79
  98. package/src/services/api/common.js +137 -132
  99. package/src/services/api/commonTempTable.js +10 -10
  100. package/src/services/api/index.js +17 -17
  101. package/src/services/api/logininfor/index.js +6 -6
  102. package/src/services/api/manage.js +8 -8
  103. package/src/services/apiService.js +14 -14
  104. package/src/services/user.js +67 -67
  105. package/src/store/modules/index.js +4 -4
  106. package/src/theme/default/nprogress.less +76 -76
  107. package/src/theme/default/style.less +58 -58
  108. package/src/utils/EncryptUtil.js +53 -53
  109. package/src/utils/colors.js +107 -107
  110. package/src/utils/excel/Blob.js +180 -180
  111. package/src/utils/excel/Export2Excel.js +141 -141
  112. package/src/utils/formatter.js +68 -68
  113. package/src/utils/i18n.js +80 -80
  114. package/src/utils/map-utils.js +37 -37
  115. package/src/utils/theme-color-replacer-extend.js +91 -91
  116. package/src/utils/themeUtil.js +100 -100
  117. package/src/utils/util.js +230 -230
  118. package/vue.config.js +106 -106
  119. package/src/pages/system/queryParams/index.vue +0 -43
@@ -1,116 +1,116 @@
1
- <template>
2
- <page-toggle-transition :disabled="animate.disabled" :animate="animate.name" :direction="animate.direction">
3
- <template v-if="login">
4
- <a-spin tip="加载中,马上好" :spinning="!isLoaded">
5
- <a-card>
6
- <iframe
7
- ref="singlepage"
8
- :src="url"
9
- :name="this.fullPath"
10
- class="single-page-iframe"
11
- @load="load">
12
- </iframe>
13
- </a-card>
14
- </a-spin>
15
- </template>
16
- </page-toggle-transition>
17
- </template>
18
-
19
- <script>
20
- import PageToggleTransition from '@vue2-client/components/transition/PageToggleTransition'
21
- import { ACCESS_TOKEN } from '@vue2-client/store/mutation-types'
22
- import { mapState, mapMutations } from 'vuex'
23
- import { CASLogin, doOtherValidate } from '@vue2-client/services/api/cas'
24
-
25
- export default {
26
- name: 'SinglePageView',
27
- components: { PageToggleTransition },
28
- props: {
29
- singlePageUrl: {
30
- type: String,
31
- default: ''
32
- },
33
- fullPath: {
34
- type: String,
35
- default: ''
36
- }
37
- },
38
- data () {
39
- return {
40
- iframe: null,
41
- url: '',
42
- isLoaded: false,
43
- }
44
- },
45
- computed: {
46
- ...mapState('setting', ['animate', 'iframeSrc']),
47
- ...mapState('account', { login: 'login', currUser: 'user' })
48
- },
49
- created () {
50
- this.isLoaded = false
51
- if (this.singlePageUrl.indexOf('sso:') !== -1) {
52
- const serviceKey = this.singlePageUrl.substring(4)
53
- CASLogin(serviceKey, true).then(res => {
54
- const redirectUrl = res.redirectUrl
55
- if (redirectUrl.indexOf('logic@') !== -1) {
56
- const logicName = redirectUrl.substring(6)
57
- doOtherValidate(logicName, res.st, serviceKey).then(validateRes => {
58
- this.url = validateRes.redirectUrl
59
- })
60
- } else {
61
- const join = redirectUrl.split('?')[1] ? '&' : '?'
62
- this.url = redirectUrl + join + 'ticket=' + res.st + '&timestrap=' + new Date().getTime()
63
- }
64
- }).catch(msg => {
65
- console.warn(msg)
66
- this.$message.error(msg)
67
- })
68
- } else if (this.singlePageUrl.indexOf('http') !== -1) {
69
- if (this.singlePageUrl.indexOf('?goto=') !== -1) {
70
- this.singlePageUrl = this.singlePageUrl + '&f_user_id=' + this.currUser.username + '&password=' + this.currUser.password
71
- }
72
- this.url = this.singlePageUrl
73
- } else {
74
- this.url = this.iframeSrc
75
- }
76
- },
77
- mounted () {
78
- if (!this.login) {
79
- this.setLogin(JSON.parse(sessionStorage.getItem(process.env.VUE_APP_LOGIN_KEY)))
80
- }
81
- this.iframe = this.$refs.singlepage.contentWindow
82
- this.path = this.$route.path
83
- },
84
- methods: {
85
- ...mapMutations('account', ['setLogin']),
86
- load () {
87
- if (this.singlePageUrl.indexOf('sso:') === -1) {
88
- const appdata = {
89
- singleValues: this.$appdata.getSingleValues(),
90
- params: this.$appdata.getParams()
91
- }
92
- const data = {
93
- token: localStorage.getItem(ACCESS_TOKEN),
94
- login: this.login,
95
- appdata: appdata,
96
- page: this.singlePageUrl
97
- }
98
- console.log('发送参数', data)
99
- if (this.iframe) {
100
- this.iframe.postMessage(data, '*')
101
- }
102
- }
103
- this.$emit('load', this.fullPath)
104
- this.isLoaded = true
105
- }
106
- }
107
- }
108
- </script>
109
-
110
- <style lang="less">
111
- .single-page-iframe {
112
- width: 100%;
113
- height: calc(100vh - 117px);
114
- border: none;
115
- }
116
- </style>
1
+ <template>
2
+ <page-toggle-transition :disabled="animate.disabled" :animate="animate.name" :direction="animate.direction">
3
+ <template v-if="login">
4
+ <a-spin tip="加载中,马上好" :spinning="!isLoaded">
5
+ <a-card>
6
+ <iframe
7
+ ref="singlepage"
8
+ :src="url"
9
+ :name="this.fullPath"
10
+ class="single-page-iframe"
11
+ @load="load">
12
+ </iframe>
13
+ </a-card>
14
+ </a-spin>
15
+ </template>
16
+ </page-toggle-transition>
17
+ </template>
18
+
19
+ <script>
20
+ import PageToggleTransition from '@vue2-client/components/transition/PageToggleTransition'
21
+ import { ACCESS_TOKEN } from '@vue2-client/store/mutation-types'
22
+ import { mapState, mapMutations } from 'vuex'
23
+ import { CASLogin, doOtherValidate } from '@vue2-client/services/api/cas'
24
+
25
+ export default {
26
+ name: 'SinglePageView',
27
+ components: { PageToggleTransition },
28
+ props: {
29
+ singlePageUrl: {
30
+ type: String,
31
+ default: ''
32
+ },
33
+ fullPath: {
34
+ type: String,
35
+ default: ''
36
+ }
37
+ },
38
+ data () {
39
+ return {
40
+ iframe: null,
41
+ url: '',
42
+ isLoaded: false,
43
+ }
44
+ },
45
+ computed: {
46
+ ...mapState('setting', ['animate', 'iframeSrc']),
47
+ ...mapState('account', { login: 'login', currUser: 'user' })
48
+ },
49
+ created () {
50
+ this.isLoaded = false
51
+ if (this.singlePageUrl.indexOf('sso:') !== -1) {
52
+ const serviceKey = this.singlePageUrl.substring(4)
53
+ CASLogin(serviceKey, true).then(res => {
54
+ const redirectUrl = res.redirectUrl
55
+ if (redirectUrl.indexOf('logic@') !== -1) {
56
+ const logicName = redirectUrl.substring(6)
57
+ doOtherValidate(logicName, res.st, serviceKey).then(validateRes => {
58
+ this.url = validateRes.redirectUrl
59
+ })
60
+ } else {
61
+ const join = redirectUrl.split('?')[1] ? '&' : '?'
62
+ this.url = redirectUrl + join + 'ticket=' + res.st + '&timestrap=' + new Date().getTime()
63
+ }
64
+ }).catch(msg => {
65
+ console.warn(msg)
66
+ this.$message.error(msg)
67
+ })
68
+ } else if (this.singlePageUrl.indexOf('http') !== -1) {
69
+ if (this.singlePageUrl.indexOf('?goto=') !== -1) {
70
+ this.singlePageUrl = this.singlePageUrl + '&f_user_id=' + this.currUser.username + '&password=' + this.currUser.password
71
+ }
72
+ this.url = this.singlePageUrl
73
+ } else {
74
+ this.url = this.iframeSrc
75
+ }
76
+ },
77
+ mounted () {
78
+ if (!this.login) {
79
+ this.setLogin(JSON.parse(sessionStorage.getItem(process.env.VUE_APP_LOGIN_KEY)))
80
+ }
81
+ this.iframe = this.$refs.singlepage.contentWindow
82
+ this.path = this.$route.path
83
+ },
84
+ methods: {
85
+ ...mapMutations('account', ['setLogin']),
86
+ load () {
87
+ if (this.singlePageUrl.indexOf('sso:') === -1) {
88
+ const appdata = {
89
+ singleValues: this.$appdata.getSingleValues(),
90
+ params: this.$appdata.getParams()
91
+ }
92
+ const data = {
93
+ token: localStorage.getItem(ACCESS_TOKEN),
94
+ login: this.login,
95
+ appdata: appdata,
96
+ page: this.singlePageUrl
97
+ }
98
+ console.log('发送参数', data)
99
+ if (this.iframe) {
100
+ this.iframe.postMessage(data, '*')
101
+ }
102
+ }
103
+ this.$emit('load', this.fullPath)
104
+ this.isLoaded = true
105
+ }
106
+ }
107
+ }
108
+ </script>
109
+
110
+ <style lang="less">
111
+ .single-page-iframe {
112
+ width: 100%;
113
+ height: calc(100vh - 117px);
114
+ border: none;
115
+ }
116
+ </style>
@@ -1,49 +1,49 @@
1
- <template>
2
- <div class="footer">
3
- <div class="links">
4
- <a target="_blank" :key="index" :href="item.link ? item.link : 'javascript: void(0)'" v-for="(item, index) in linkList">
5
- <a-icon v-if="item.icon" :type="item.icon"/>{{ item.name }}
6
- </a>
7
- </div>
8
- <div class="copyright" v-if="!copyrightStyle">
9
- Copyright<a-icon type="copyright" />{{ copyright }}
10
- </div>
11
- <div class="copyright2" :style="copyrightStyle" v-else>
12
- {{ copyright }}
13
- </div>
14
- </div>
15
- </template>
16
-
17
- <script>
18
- export default {
19
- name: 'PageFooter',
20
- // eslint-disable-next-line vue/require-prop-types
21
- props: ['copyright', 'linkList', 'copyrightStyle']
22
- }
23
- </script>
24
-
25
- <style lang="less" scoped>
26
- .footer{
27
- padding: 48px 16px 24px;
28
- /*margin: 48px 0 24px;*/
29
- text-align: center;
30
- .copyright{
31
- color: @text-color-second;
32
- font-size: 14px;
33
- i {
34
- margin: 0 4px;
35
- }
36
- }
37
- .links{
38
- margin-bottom: 8px;
39
- a:not(:last-child) {
40
- margin-right: 40px;
41
- }
42
- a{
43
- color: @text-color-second;
44
- -webkit-transition: all .3s;
45
- transition: all .3s;
46
- }
47
- }
48
- }
49
- </style>
1
+ <template>
2
+ <div class="footer">
3
+ <div class="links">
4
+ <a target="_blank" :key="index" :href="item.link ? item.link : 'javascript: void(0)'" v-for="(item, index) in linkList">
5
+ <a-icon v-if="item.icon" :type="item.icon"/>{{ item.name }}
6
+ </a>
7
+ </div>
8
+ <div class="copyright" v-if="!copyrightStyle">
9
+ Copyright<a-icon type="copyright" />{{ copyright }}
10
+ </div>
11
+ <div class="copyright2" :style="copyrightStyle" v-else>
12
+ {{ copyright }}
13
+ </div>
14
+ </div>
15
+ </template>
16
+
17
+ <script>
18
+ export default {
19
+ name: 'PageFooter',
20
+ // eslint-disable-next-line vue/require-prop-types
21
+ props: ['copyright', 'linkList', 'copyrightStyle']
22
+ }
23
+ </script>
24
+
25
+ <style lang="less" scoped>
26
+ .footer{
27
+ padding: 48px 16px 24px;
28
+ /*margin: 48px 0 24px;*/
29
+ text-align: center;
30
+ .copyright{
31
+ color: @text-color-second;
32
+ font-size: 14px;
33
+ i {
34
+ margin: 0 4px;
35
+ }
36
+ }
37
+ .links{
38
+ margin-bottom: 8px;
39
+ a:not(:last-child) {
40
+ margin-right: 40px;
41
+ }
42
+ a{
43
+ color: @text-color-second;
44
+ -webkit-transition: all .3s;
45
+ transition: all .3s;
46
+ }
47
+ }
48
+ }
49
+ </style>
@@ -1,134 +1,134 @@
1
- <template>
2
- <a-layout-header :class="[headerTheme, 'admin-header']">
3
- <div :class="['admin-header-wide', layout, pageWidth]">
4
- <router-link v-if="isMobile || layout === 'head'" :class="['logo', isMobile ? null : 'pc', headerTheme]" to="/">
5
- <img :src="logoSrc" width="32" alt="logo"/>
6
- <h1 v-if="!isMobile">{{ systemName }}</h1>
7
- </router-link>
8
- <a-divider v-if="isMobile" type="vertical" />
9
- <a-icon v-if="layout !== 'head'" :type="collapsed ? 'menu-unfold' : 'menu-fold'" class="trigger" @click="toggleCollapse"/>
10
- <div v-if="layout !== 'side' && !isMobile" :style="`width: ${menuWidth};`" class="admin-header-menu">
11
- <i-menu :options="menuData" :theme="headerTheme" class="head-menu" mode="horizontal" @select="onSelect"/>
12
- </div>
13
- <div :class="['admin-header-right', headerTheme]">
14
- <component class="header-item" :is="dynamicComponents['HeaderSearch']" @active="val => searchActive = val"/>
15
- <a-tooltip class="header-item" placement="bottom" title="清理查询缓存" >
16
- <a @click="handleToClearCache">
17
- <a-icon type="reload" />
18
- </a>
19
- </a-tooltip>
20
- <component class="header-item" :is="dynamicComponents['HeaderNotice']"/>
21
- <header-avatar class="header-item"/>
22
- <a-dropdown class="lang header-item">
23
- <div>
24
- <a-icon type="global"/> {{ langAlias }}
25
- </div>
26
- <a-menu slot="overlay" :selected-keys="[lang]" @click="val => setLang(val.key)">
27
- <a-menu-item v-for=" lang in langList" :key="lang.key">{{ lang.key.toLowerCase() + ' ' + lang.name }}</a-menu-item>
28
- </a-menu>
29
- </a-dropdown>
30
- </div>
31
- </div>
32
- </a-layout-header>
33
- </template>
34
-
35
- <script>
36
- import HeaderSearch from './HeaderSearch'
37
- import HeaderAvatar from './HeaderAvatar'
38
- import IMenu from '@vue2-client/components/menu/menu'
39
- import { mapState, mapMutations } from 'vuex'
40
- import { Modal } from 'ant-design-vue'
41
- import { indexedDB } from '@vue2-client/utils/indexedDB'
42
-
43
- const loadComponents = (value) => {
44
- const component = {
45
- HeaderSearch: import('./HeaderSearch'),
46
- HeaderNotice: import('./HeaderNotice'),
47
- }
48
- if (!value) {
49
- return component
50
- }
51
- for (const item in component) {
52
- const path = value[item]
53
- if (path) {
54
- component[item] = import(`@/layouts/header/${path}`)
55
- }
56
- }
57
- return component
58
- }
59
-
60
- export default {
61
- name: 'AdminHeader',
62
- components: { IMenu, HeaderAvatar, HeaderSearch },
63
- // eslint-disable-next-line vue/require-prop-types
64
- props: ['collapsed', 'menuData'],
65
- data () {
66
- return {
67
- langList: [
68
- { key: 'CN', name: '简体中文', alias: '简体' },
69
- { key: 'HK', name: '繁體中文', alias: '繁體' },
70
- { key: 'US', name: 'English', alias: 'English' }
71
- ],
72
- searchActive: false,
73
- dynamicComponents: {}
74
- }
75
- },
76
- computed: {
77
- ...mapState('setting', ['theme', 'isMobile', 'layout', 'systemName', 'logoSrc', 'lang', 'pageWidth', 'customizeComponent']),
78
- headerTheme () {
79
- if (this.layout === 'side' && this.theme.mode === 'dark' && !this.isMobile) {
80
- return 'light'
81
- }
82
- return this.theme.mode
83
- },
84
- langAlias () {
85
- const lang = this.langList.find(item => item.key === this.lang)
86
- return lang.alias
87
- },
88
- menuWidth () {
89
- const { layout, searchActive } = this
90
- const headWidth = layout === 'head' ? '100% - 188px' : '100%'
91
- const extraWidth = searchActive ? '600px' : '400px'
92
- return `calc(${headWidth} - ${extraWidth})`
93
- }
94
- },
95
- created () {
96
- const components = loadComponents(this.customizeComponent)
97
- for (const item in components) {
98
- const value = components[item]
99
- if (typeof value === 'function') {
100
- this.$set(this.dynamicComponents, item, value)
101
- } else {
102
- components[item].then(result => {
103
- this.$set(this.dynamicComponents, item, result.default)
104
- })
105
- }
106
- }
107
- },
108
- methods: {
109
- toggleCollapse () {
110
- this.$emit('toggleCollapse')
111
- },
112
- onSelect (obj) {
113
- this.$emit('menuSelect', obj)
114
- },
115
- handleToClearCache () {
116
- Modal.confirm({
117
- title: '信息',
118
- content: '您确定要清除查询配置缓存吗?',
119
- onOk: () => {
120
- indexedDB.clear(() => {
121
- location.reload()
122
- })
123
- },
124
- onCancel () {}
125
- })
126
- },
127
- ...mapMutations('setting', ['setLang'])
128
- }
129
- }
130
- </script>
131
-
132
- <style lang="less" scoped>
133
- @import "index";
134
- </style>
1
+ <template>
2
+ <a-layout-header :class="[headerTheme, 'admin-header']">
3
+ <div :class="['admin-header-wide', layout, pageWidth]">
4
+ <router-link v-if="isMobile || layout === 'head'" :class="['logo', isMobile ? null : 'pc', headerTheme]" to="/">
5
+ <img :src="logoSrc" width="32" alt="logo"/>
6
+ <h1 v-if="!isMobile">{{ systemName }}</h1>
7
+ </router-link>
8
+ <a-divider v-if="isMobile" type="vertical" />
9
+ <a-icon v-if="layout !== 'head'" :type="collapsed ? 'menu-unfold' : 'menu-fold'" class="trigger" @click="toggleCollapse"/>
10
+ <div v-if="layout !== 'side' && !isMobile" :style="`width: ${menuWidth};`" class="admin-header-menu">
11
+ <i-menu :options="menuData" :theme="headerTheme" class="head-menu" mode="horizontal" @select="onSelect"/>
12
+ </div>
13
+ <div :class="['admin-header-right', headerTheme]">
14
+ <component class="header-item" :is="dynamicComponents['HeaderSearch']" @active="val => searchActive = val"/>
15
+ <a-tooltip class="header-item" placement="bottom" title="清理查询缓存" >
16
+ <a @click="handleToClearCache">
17
+ <a-icon type="reload" />
18
+ </a>
19
+ </a-tooltip>
20
+ <component class="header-item" :is="dynamicComponents['HeaderNotice']"/>
21
+ <header-avatar class="header-item"/>
22
+ <a-dropdown class="lang header-item">
23
+ <div>
24
+ <a-icon type="global"/> {{ langAlias }}
25
+ </div>
26
+ <a-menu slot="overlay" :selected-keys="[lang]" @click="val => setLang(val.key)">
27
+ <a-menu-item v-for=" lang in langList" :key="lang.key">{{ lang.key.toLowerCase() + ' ' + lang.name }}</a-menu-item>
28
+ </a-menu>
29
+ </a-dropdown>
30
+ </div>
31
+ </div>
32
+ </a-layout-header>
33
+ </template>
34
+
35
+ <script>
36
+ import HeaderSearch from './HeaderSearch'
37
+ import HeaderAvatar from './HeaderAvatar'
38
+ import IMenu from '@vue2-client/components/menu/menu'
39
+ import { mapState, mapMutations } from 'vuex'
40
+ import { Modal } from 'ant-design-vue'
41
+ import { indexedDB } from '@vue2-client/utils/indexedDB'
42
+
43
+ const loadComponents = (value) => {
44
+ const component = {
45
+ HeaderSearch: import('./HeaderSearch'),
46
+ HeaderNotice: import('./HeaderNotice'),
47
+ }
48
+ if (!value) {
49
+ return component
50
+ }
51
+ for (const item in component) {
52
+ const path = value[item]
53
+ if (path) {
54
+ component[item] = import(`@/layouts/header/${path}`)
55
+ }
56
+ }
57
+ return component
58
+ }
59
+
60
+ export default {
61
+ name: 'AdminHeader',
62
+ components: { IMenu, HeaderAvatar, HeaderSearch },
63
+ // eslint-disable-next-line vue/require-prop-types
64
+ props: ['collapsed', 'menuData'],
65
+ data () {
66
+ return {
67
+ langList: [
68
+ { key: 'CN', name: '简体中文', alias: '简体' },
69
+ { key: 'HK', name: '繁體中文', alias: '繁體' },
70
+ { key: 'US', name: 'English', alias: 'English' }
71
+ ],
72
+ searchActive: false,
73
+ dynamicComponents: {}
74
+ }
75
+ },
76
+ computed: {
77
+ ...mapState('setting', ['theme', 'isMobile', 'layout', 'systemName', 'logoSrc', 'lang', 'pageWidth', 'customizeComponent']),
78
+ headerTheme () {
79
+ if (this.layout === 'side' && this.theme.mode === 'dark' && !this.isMobile) {
80
+ return 'light'
81
+ }
82
+ return this.theme.mode
83
+ },
84
+ langAlias () {
85
+ const lang = this.langList.find(item => item.key === this.lang)
86
+ return lang.alias
87
+ },
88
+ menuWidth () {
89
+ const { layout, searchActive } = this
90
+ const headWidth = layout === 'head' ? '100% - 188px' : '100%'
91
+ const extraWidth = searchActive ? '600px' : '400px'
92
+ return `calc(${headWidth} - ${extraWidth})`
93
+ }
94
+ },
95
+ created () {
96
+ const components = loadComponents(this.customizeComponent)
97
+ for (const item in components) {
98
+ const value = components[item]
99
+ if (typeof value === 'function') {
100
+ this.$set(this.dynamicComponents, item, value)
101
+ } else {
102
+ components[item].then(result => {
103
+ this.$set(this.dynamicComponents, item, result.default)
104
+ })
105
+ }
106
+ }
107
+ },
108
+ methods: {
109
+ toggleCollapse () {
110
+ this.$emit('toggleCollapse')
111
+ },
112
+ onSelect (obj) {
113
+ this.$emit('menuSelect', obj)
114
+ },
115
+ handleToClearCache () {
116
+ Modal.confirm({
117
+ title: '信息',
118
+ content: '您确定要清除查询配置缓存吗?',
119
+ onOk: () => {
120
+ indexedDB.clear(() => {
121
+ location.reload()
122
+ })
123
+ },
124
+ onCancel () {}
125
+ })
126
+ },
127
+ ...mapMutations('setting', ['setLang'])
128
+ }
129
+ }
130
+ </script>
131
+
132
+ <style lang="less" scoped>
133
+ @import "index";
134
+ </style>