use-dataList.ts 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367
  1. /*
  2. * Licensed to the Apache Software Foundation (ASF) under one or more
  3. * contributor license agreements. See the NOTICE file distributed with
  4. * this work for additional information regarding copyright ownership.
  5. * The ASF licenses this file to You under the Apache License, Version 2.0
  6. * (the "License"); you may not use this file except in compliance with
  7. * the License. You may obtain a copy of the License at
  8. *
  9. * http://www.apache.org/licenses/LICENSE-2.0
  10. *
  11. * Unless required by applicable law or agreed to in writing, software
  12. * distributed under the License is distributed on an "AS IS" BASIS,
  13. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14. * See the License for the specific language governing permissions and
  15. * limitations under the License.
  16. */
  17. import { reactive, h } from 'vue'
  18. import { NEllipsis, NIcon } from 'naive-ui'
  19. import { useI18n } from 'vue-i18n'
  20. import {
  21. HomeOutlined,
  22. ProfileOutlined,
  23. FolderOutlined,
  24. DatabaseOutlined,
  25. DesktopOutlined,
  26. SafetyCertificateOutlined,
  27. UserOutlined,
  28. LogoutOutlined,
  29. FundProjectionScreenOutlined,
  30. PartitionOutlined,
  31. SettingOutlined,
  32. FileSearchOutlined,
  33. RobotOutlined,
  34. AppstoreOutlined,
  35. UsergroupAddOutlined,
  36. UserAddOutlined,
  37. WarningOutlined,
  38. InfoCircleOutlined,
  39. ControlOutlined,
  40. SlackOutlined,
  41. EnvironmentOutlined,
  42. KeyOutlined,
  43. SafetyOutlined,
  44. GroupOutlined,
  45. ContainerOutlined,
  46. ApartmentOutlined,
  47. BarsOutlined,
  48. CloudServerOutlined,
  49. ClusterOutlined
  50. } from '@vicons/antd'
  51. import { useRoute } from 'vue-router'
  52. import { useUserStore } from '@/store/user/user'
  53. import { timezoneList } from '@/common/timezone'
  54. import type { UserInfoRes } from '@/service/modules/users/types'
  55. export function useDataList() {
  56. const { t } = useI18n()
  57. const route = useRoute()
  58. const userStore = useUserStore()
  59. const renderIcon = (icon: any) => {
  60. return () => h(NIcon, null, { default: () => h(icon) })
  61. }
  62. const localesOptions = [
  63. {
  64. label: 'English',
  65. key: 'en_US'
  66. },
  67. {
  68. label: '中文',
  69. key: 'zh_CN'
  70. }
  71. ]
  72. const timezoneOptions = () =>
  73. timezoneList.map((item) => ({ label: item, value: item }))
  74. const state = reactive({
  75. isShowSide: false,
  76. localesOptions,
  77. timezoneOptions: timezoneOptions(),
  78. userDropdownOptions: [],
  79. menuOptions: [],
  80. headerMenuOptions: [],
  81. sideMenuOptions: []
  82. })
  83. const changeMenuOption = (state: any) => {
  84. const projectCode = route.params.projectCode || ''
  85. const projectName = route.query.projectName || ''
  86. state.menuOptions = [
  87. {
  88. label: () => h(NEllipsis, null, { default: () => t('menu.home') }),
  89. key: 'home',
  90. icon: renderIcon(HomeOutlined)
  91. },
  92. {
  93. label: () => h(NEllipsis, null, { default: () => t('menu.project') }),
  94. key: 'projects',
  95. icon: renderIcon(ProfileOutlined),
  96. children: [
  97. {
  98. label: t('menu.project_overview') + (projectName? `[${projectName}]` : ''),
  99. key: `/projects/${projectCode}`,
  100. icon: renderIcon(FundProjectionScreenOutlined),
  101. payload: {projectName:projectName}
  102. },
  103. {
  104. label: t('menu.workflow'),
  105. key: 'workflow',
  106. icon: renderIcon(PartitionOutlined),
  107. children: [
  108. {
  109. label: t('menu.workflow_relation'),
  110. key: `/projects/${projectCode}/workflow/relation`,
  111. payload: {projectName:projectName}
  112. },
  113. {
  114. label: t('menu.workflow_definition'),
  115. key: `/projects/${projectCode}/workflow-definition`,
  116. payload: {projectName:projectName}
  117. },
  118. {
  119. label: t('menu.workflow_instance'),
  120. key: `/projects/${projectCode}/workflow/instances`,
  121. payload: {projectName:projectName}
  122. }
  123. ]
  124. },
  125. {
  126. label: t('menu.task'),
  127. key: 'task',
  128. icon: renderIcon(SettingOutlined),
  129. children: [
  130. {
  131. label: t('menu.task_definition'),
  132. key: `/projects/${projectCode}/task/definitions`,
  133. payload: {projectName:projectName}
  134. },
  135. {
  136. label: t('menu.task_instance'),
  137. key: `/projects/${projectCode}/task/instances`,
  138. payload: {projectName:projectName}
  139. }
  140. ]
  141. }
  142. ]
  143. },
  144. {
  145. label: () => h(NEllipsis, null, { default: () => t('menu.resources') }),
  146. key: 'resource',
  147. icon: renderIcon(FolderOutlined),
  148. children: [
  149. {
  150. label: t('menu.file_manage'),
  151. key: '/resource/file-manage',
  152. icon: renderIcon(FileSearchOutlined)
  153. },
  154. {
  155. label: t('menu.udf_manage'),
  156. key: 'udf-manage',
  157. icon: renderIcon(RobotOutlined),
  158. children: [
  159. {
  160. label: t('menu.resource_manage'),
  161. key: '/resource/resource-manage'
  162. },
  163. {
  164. label: t('menu.function_manage'),
  165. key: '/resource/function-manage'
  166. }
  167. ]
  168. },
  169. {
  170. label: t('menu.task_group_manage'),
  171. key: 'task-group-manage',
  172. icon: renderIcon(GroupOutlined),
  173. children: [
  174. {
  175. label: t('menu.task_group_option'),
  176. key: '/resource/task-group-option'
  177. },
  178. {
  179. label: t('menu.task_group_queue'),
  180. key: '/resource/task-group-queue'
  181. }
  182. ]
  183. }
  184. ]
  185. },
  186. {
  187. label: () =>
  188. h(NEllipsis, null, { default: () => t('menu.data_quality') }),
  189. key: 'data-quality',
  190. icon: renderIcon(ContainerOutlined),
  191. children: [
  192. {
  193. label: t('menu.task_result'),
  194. key: '/data-quality/task-result',
  195. icon: renderIcon(ApartmentOutlined)
  196. },
  197. {
  198. label: t('menu.rule'),
  199. key: '/data-quality/rule',
  200. icon: renderIcon(BarsOutlined)
  201. }
  202. ]
  203. },
  204. {
  205. label: () =>
  206. h(NEllipsis, null, { default: () => t('menu.datasource') }),
  207. key: 'datasource',
  208. icon: renderIcon(DatabaseOutlined),
  209. children: []
  210. },
  211. {
  212. label: () => h(NEllipsis, null, { default: () => t('menu.monitor') }),
  213. key: 'monitor',
  214. icon: renderIcon(DesktopOutlined),
  215. children: [
  216. {
  217. label: t('menu.service_manage'),
  218. key: 'service-manage',
  219. icon: renderIcon(AppstoreOutlined),
  220. children: [
  221. {
  222. label: t('menu.master'),
  223. key: '/monitor/master'
  224. },
  225. {
  226. label: t('menu.worker'),
  227. key: '/monitor/worker'
  228. },
  229. {
  230. label: t('menu.db'),
  231. key: '/monitor/db'
  232. }
  233. ]
  234. },
  235. {
  236. label: t('menu.statistical_manage'),
  237. key: 'statistical-manage',
  238. icon: renderIcon(AppstoreOutlined),
  239. children: [
  240. {
  241. label: t('menu.statistics'),
  242. key: '/monitor/statistics'
  243. },
  244. {
  245. label: t('menu.audit_log'),
  246. key: '/monitor/audit-log'
  247. }
  248. ]
  249. }
  250. ]
  251. },
  252. {
  253. label: () => h(NEllipsis, null, { default: () => t('menu.security') }),
  254. key: 'security',
  255. icon: renderIcon(SafetyCertificateOutlined),
  256. children:
  257. (userStore.getUserInfo as UserInfoRes).userType === 'ADMIN_USER'
  258. ? [
  259. {
  260. label: t('menu.tenant_manage'),
  261. key: '/security/tenant-manage',
  262. icon: renderIcon(UsergroupAddOutlined)
  263. },
  264. {
  265. label: t('menu.user_manage'),
  266. key: '/security/user-manage',
  267. icon: renderIcon(UserAddOutlined)
  268. },
  269. {
  270. label: t('menu.alarm_group_manage'),
  271. key: '/security/alarm-group-manage',
  272. icon: renderIcon(WarningOutlined)
  273. },
  274. {
  275. label: t('menu.alarm_instance_manage'),
  276. key: '/security/alarm-instance-manage',
  277. icon: renderIcon(InfoCircleOutlined)
  278. },
  279. {
  280. label: t('menu.worker_group_manage'),
  281. key: '/security/worker-group-manage',
  282. icon: renderIcon(ControlOutlined)
  283. },
  284. {
  285. label: t('menu.yarn_queue_manage'),
  286. key: '/security/yarn-queue-manage',
  287. icon: renderIcon(SlackOutlined)
  288. },
  289. {
  290. label: t('menu.environment_manage'),
  291. key: '/security/environment-manage',
  292. icon: renderIcon(EnvironmentOutlined)
  293. },
  294. {
  295. label: t('menu.cluster_manage'),
  296. key: '/security/cluster-manage',
  297. icon: renderIcon(ClusterOutlined)
  298. },
  299. {
  300. label: t('menu.k8s_namespace_manage'),
  301. key: '/security/k8s-namespace-manage',
  302. icon: renderIcon(CloudServerOutlined)
  303. },
  304. {
  305. label: t('menu.token_manage'),
  306. key: '/security/token-manage',
  307. icon: renderIcon(SafetyOutlined)
  308. }
  309. ]
  310. : [
  311. {
  312. label: t('menu.token_manage'),
  313. key: '/security/token-manage',
  314. icon: renderIcon(SafetyOutlined)
  315. }
  316. ]
  317. }
  318. ]
  319. }
  320. const changeHeaderMenuOptions = (state: any) => {
  321. state.headerMenuOptions = state.menuOptions.map(
  322. (item: { label: string; key: string; icon: any }) => {
  323. return {
  324. label: item.label,
  325. key: item.key,
  326. icon: item.icon
  327. }
  328. }
  329. )
  330. }
  331. const changeUserDropdown = (state: any) => {
  332. state.userDropdownOptions = [
  333. {
  334. label: t('user_dropdown.profile'),
  335. key: 'profile',
  336. icon: renderIcon(UserOutlined)
  337. },
  338. {
  339. label: t('user_dropdown.password'),
  340. key: 'password',
  341. icon: renderIcon(KeyOutlined),
  342. disabled: userStore.getSecurityConfigType !== 'PASSWORD'
  343. },
  344. {
  345. label: t('user_dropdown.logout'),
  346. key: 'logout',
  347. icon: renderIcon(LogoutOutlined)
  348. }
  349. ]
  350. }
  351. return {
  352. state,
  353. changeHeaderMenuOptions,
  354. changeMenuOption,
  355. changeUserDropdown
  356. }
  357. }