vue2-client 1.6.34 → 1.6.36

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 (108) hide show
  1. package/CHANGELOG.md +595 -591
  2. package/index.js +30 -30
  3. package/package.json +1 -1
  4. package/src/assets/img/location.png +0 -0
  5. package/src/base-client/components/common/AddressSearchCombobox/AddressSearchCombobox.vue +176 -92
  6. package/src/base-client/components/common/CitySelect/CitySelect.vue +247 -247
  7. package/src/base-client/components/common/CreateQuery/CreateQueryItem.vue +733 -733
  8. package/src/base-client/components/common/CreateSimpleFormQuery/CreateSimpleFormQueryItem.vue +508 -508
  9. package/src/base-client/components/common/FormGroupEdit/FormGroupEdit.vue +140 -140
  10. package/src/base-client/components/common/FormGroupQuery/FormGroupQuery.vue +165 -165
  11. package/src/base-client/components/common/JSONToTree/jsontotree.vue +275 -275
  12. package/src/base-client/components/common/Upload/Upload.vue +168 -168
  13. package/src/base-client/components/common/XAddForm/XAddForm.vue +326 -326
  14. package/src/base-client/components/common/XCard/XCard.vue +64 -64
  15. package/src/base-client/components/common/XForm/XForm.vue +180 -180
  16. package/src/base-client/components/common/XForm/XFormItem.vue +473 -591
  17. package/src/base-client/components/common/XForm/XTreeSelect.vue +184 -0
  18. package/src/base-client/components/common/XFormTable/XFormTable.vue +336 -336
  19. package/src/base-client/components/common/XFormTable/index.md +97 -97
  20. package/src/base-client/components/common/XTreeOne/XTreeOne.vue +111 -111
  21. package/src/base-client/components/system/QueryParamsDetailsView/QueryParamsDetailsView.vue +281 -281
  22. package/src/base-client/components/ticket/TicketDetailsView/TicketDetailsView.vue +807 -807
  23. package/src/base-client/components/ticket/TicketDetailsView/index.md +29 -29
  24. package/src/base-client/components/ticket/TicketDetailsView/part/TicketDetailsFlow.vue +260 -260
  25. package/src/base-client/components/ticket/TicketSubmitSuccessView/TicketSubmitSuccessView.vue +532 -532
  26. package/src/base-client/components/ticket/TicketSubmitSuccessView/index.md +29 -29
  27. package/src/base-client/plugins/AppData.js +76 -76
  28. package/src/base-client/plugins/GetLoginInfoService.js +179 -179
  29. package/src/base-client/plugins/PagedList.js +177 -177
  30. package/src/base-client/plugins/compatible/LoginServiceOA.js +20 -20
  31. package/src/base-client/plugins/i18n-extend.js +32 -32
  32. package/src/components/Ellipsis/Ellipsis.vue +65 -65
  33. package/src/components/Ellipsis/index.md +38 -38
  34. package/src/components/NumberInfo/index.md +43 -43
  35. package/src/components/STable/README.md +341 -341
  36. package/src/components/STable/index.js +318 -318
  37. package/src/components/Trend/index.md +45 -45
  38. package/src/components/checkbox/ColorCheckbox.vue +157 -157
  39. package/src/components/checkbox/ImgCheckbox.vue +163 -163
  40. package/src/components/exception/ExceptionPage.vue +70 -70
  41. package/src/components/form/FormRow.vue +52 -52
  42. package/src/components/index.js +36 -36
  43. package/src/components/menu/SideMenu.vue +62 -62
  44. package/src/components/menu/menu.js +273 -273
  45. package/src/components/page/header/index.less +40 -40
  46. package/src/components/setting/Setting.vue +235 -235
  47. package/src/components/table/StandardTable.vue +141 -141
  48. package/src/components/table/advance/ActionColumns.vue +158 -158
  49. package/src/components/table/advance/SearchArea.vue +355 -355
  50. package/src/components/tool/AStepItem.vue +60 -60
  51. package/src/components/tool/AvatarList.vue +68 -68
  52. package/src/components/tool/Drawer.vue +142 -142
  53. package/src/components/tool/TagSelect.vue +83 -83
  54. package/src/components/transition/PageToggleTransition.vue +97 -97
  55. package/src/config/default/admin.config.js +18 -18
  56. package/src/config/default/setting.config.js +46 -46
  57. package/src/config/replacer/resolve.config.js +67 -67
  58. package/src/layouts/CommonLayout.vue +42 -42
  59. package/src/layouts/ComponentLayoutOne.vue +47 -47
  60. package/src/layouts/PageLayout.vue +151 -151
  61. package/src/layouts/SinglePageView.vue +116 -116
  62. package/src/layouts/footer/PageFooter.vue +49 -49
  63. package/src/layouts/header/AdminHeader.vue +134 -134
  64. package/src/layouts/header/HeaderAvatar.vue +64 -64
  65. package/src/layouts/header/HeaderNotice.vue +176 -176
  66. package/src/layouts/header/HeaderSearch.vue +67 -67
  67. package/src/layouts/header/InstitutionDetail.vue +181 -181
  68. package/src/layouts/header/index.less +92 -92
  69. package/src/layouts/tabs/TabsHead.vue +190 -190
  70. package/src/layouts/tabs/TabsView.vue +379 -379
  71. package/src/mock/goods/index.js +108 -108
  72. package/src/pages/exception/404.vue +24 -24
  73. package/src/pages/login/Login.vue +365 -365
  74. package/src/pages/report/ReportTable.js +124 -124
  75. package/src/pages/report/ReportTableHome.vue +28 -28
  76. package/src/pages/resourceManage/orgListManage.vue +98 -98
  77. package/src/pages/system/file/index.vue +317 -317
  78. package/src/pages/system/settings/index.vue +126 -126
  79. package/src/pages/system/settings/modifyPassword.vue +109 -109
  80. package/src/router/async/config.async.js +28 -28
  81. package/src/router/async/router.map.js +68 -68
  82. package/src/router/index.js +27 -27
  83. package/src/services/api/DictionaryDetailsViewApi.js +6 -6
  84. package/src/services/api/LogDetailsViewApi.js +10 -10
  85. package/src/services/api/QueryParamsDetailsViewApi.js +6 -6
  86. package/src/services/api/TicketDetailsViewApi.js +34 -34
  87. package/src/services/api/cas.js +79 -79
  88. package/src/services/api/commonTempTable.js +10 -10
  89. package/src/services/api/index.js +17 -17
  90. package/src/services/api/logininfor/index.js +6 -6
  91. package/src/services/api/manage.js +8 -8
  92. package/src/services/apiService.js +14 -14
  93. package/src/services/user.js +64 -64
  94. package/src/store/modules/index.js +4 -4
  95. package/src/theme/default/nprogress.less +76 -76
  96. package/src/theme/default/style.less +58 -58
  97. package/src/utils/colors.js +107 -107
  98. package/src/utils/excel/Blob.js +180 -180
  99. package/src/utils/excel/Export2Excel.js +141 -141
  100. package/src/utils/formatter.js +68 -68
  101. package/src/utils/i18n.js +80 -80
  102. package/src/utils/map-utils.js +1 -1
  103. package/src/utils/request.js +311 -311
  104. package/src/utils/routerUtil.js +366 -366
  105. package/src/utils/theme-color-replacer-extend.js +91 -91
  106. package/src/utils/themeUtil.js +100 -100
  107. package/src/utils/util.js +230 -230
  108. package/vue.config.js +106 -106
@@ -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>