[Fix][UI Next][V1.0.0-Alpha] Fixed a problem where safari ICONS are not displayed (#8662)

dolphinscheduler-ui-next/src/views/projects/task/definition/use-table.ts

@@ -17,7 +17,7 @@
 
 import { useAsyncState } from '@vueuse/core'
 import { reactive, h, ref } from 'vue'
-import { NButton, NPopconfirm, NSpace, NTag, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NPopconfirm, NSpace, NTag, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import {
   DeleteOutlined,
@@ -143,7 +143,7 @@ export function useTable(onEdit: Function) {
                         }
                       },
                       {
-                        icon: () => h(EditOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                       }
                     ),
                   default: () => t('project.task.edit')
@@ -169,7 +169,7 @@ export function useTable(onEdit: Function) {
                         }
                       },
                       {
-                        icon: () => h(DragOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(DragOutlined) })
                       }
                     ),
                   default: () => t('project.task.move')
@@ -192,7 +192,7 @@ export function useTable(onEdit: Function) {
                         }
                       },
                       {
-                        icon: () => h(ExclamationCircleOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(ExclamationCircleOutlined) })
                       }
                     ),
                   default: () => t('project.task.version')
@@ -223,7 +223,7 @@ export function useTable(onEdit: Function) {
                                 row.processReleaseState === 'ONLINE'
                             },
                             {
-                              icon: () => h(DeleteOutlined)
+                              icon: () => h(NIcon, null, { default: () => h(DeleteOutlined) })
                             }
                           ),
                         default: () => t('project.task.delete')

dolphinscheduler-ui-next/src/views/projects/task/instance/use-table.ts

@@ -23,7 +23,7 @@ import {
   forceSuccess,
   downloadLog
 } from '@/service/modules/task-instances'
-import { NButton, NSpace, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NSpace, NTooltip } from 'naive-ui'
 import {
   AlignLeftOutlined,
   CheckCircleOutlined,
@@ -145,7 +145,7 @@ export function useTable() {
                         }
                       },
                       {
-                        icon: () => h(CheckCircleOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(CheckCircleOutlined) })
                       }
                     ),
                   default: () => t('project.task.serial_wait')
@@ -165,7 +165,7 @@ export function useTable() {
                         onClick: () => handleLog(row)
                       },
                       {
-                        icon: () => h(AlignLeftOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(AlignLeftOutlined) })
                       }
                     ),
                   default: () => t('project.task.view_log')
@@ -185,7 +185,7 @@ export function useTable() {
                         onClick: () => downloadLog(row.id)
                       },
                       {
-                        icon: () => h(DownloadOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(DownloadOutlined) })
                       }
                     ),
                   default: () => t('project.task.download_log')

dolphinscheduler-ui-next/src/views/security/alarm-group-manage/use-table.ts

@@ -18,7 +18,7 @@
 import { useAsyncState } from '@vueuse/core'
 import { reactive, h, ref } from 'vue'
 import { parseISO, format } from 'date-fns'
-import { NButton, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import {
   queryAlertGroupListPaging,
@@ -81,7 +81,7 @@ export function useTable() {
                         }
                       },
                       {
-                        icon: () => h(EditOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                       }
                     ),
                   default: () => t('security.alarm_group.edit')
@@ -109,7 +109,7 @@ export function useTable() {
                               size: 'small'
                             },
                             {
-                              icon: () => h(DeleteOutlined)
+                              icon: () => h(NIcon, null, { default: () => h(DeleteOutlined) })
                             }
                           ),
                         default: () => t('security.alarm_group.delete')

dolphinscheduler-ui-next/src/views/security/environment-manage/use-table.ts

@@ -18,7 +18,7 @@
 import { useAsyncState } from '@vueuse/core'
 import { reactive, h, ref } from 'vue'
 import { parseISO, format } from 'date-fns'
-import { NButton, NPopconfirm, NSpace, NTooltip, NTag } from 'naive-ui'
+import { NButton, NPopconfirm, NSpace, NTooltip, NTag, NIcon } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import {
   queryEnvironmentListPaging,
@@ -105,7 +105,7 @@ export function useTable() {
                         }
                       },
                       {
-                        icon: () => h(EditOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                       }
                     ),
                   default: () => t('security.environment.edit')
@@ -134,7 +134,7 @@ export function useTable() {
                               class: 'delete'
                             },
                             {
-                              icon: () => h(DeleteOutlined)
+                              icon: () => h(NIcon, null, { default: () => h(DeleteOutlined) })
                             }
                           ),
                         default: () => t('security.environment.delete')

dolphinscheduler-ui-next/src/views/security/k8s-namespace-manage/use-table.ts

@@ -17,7 +17,7 @@
 
 import { useAsyncState } from '@vueuse/core'
 import { reactive, h, ref } from 'vue'
-import { NButton, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import { parseISO, format } from 'date-fns'
 import { DeleteOutlined, EditOutlined } from '@vicons/antd'
@@ -113,7 +113,7 @@ export function useTable() {
                         }
                       },
                       {
-                        icon: () => h(EditOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                       }
                     ),
                   default: () => t('security.k8s_namespace.edit')
@@ -141,7 +141,7 @@ export function useTable() {
                               size: 'small'
                             },
                             {
-                              icon: () => h(DeleteOutlined)
+                              icon: () => h(NIcon, null, { default: () => h(DeleteOutlined) })
                             }
                           ),
                         default: () => t('security.k8s_namespace.delete')

dolphinscheduler-ui-next/src/views/security/tenant-manage/use-table.ts

@@ -21,7 +21,7 @@ import {
   deleteTenantById
 } from '@/service/modules/tenants'
 import { reactive, h, ref } from 'vue'
-import { NButton, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import { DeleteOutlined, EditOutlined } from '@vicons/antd'
 
@@ -98,7 +98,7 @@ export function useTable() {
                         }
                       },
                       {
-                        icon: () => h(EditOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                       }
                     ),
                   default: () => t('security.tenant.edit')
@@ -127,7 +127,7 @@ export function useTable() {
                               class: 'delete'
                             },
                             {
-                              icon: () => h(DeleteOutlined)
+                              icon: () => h(NIcon, null, { default: () => h(DeleteOutlined) })
                             }
                           ),
                         default: () => t('security.tenant.delete')

dolphinscheduler-ui-next/src/views/security/token-manage/use-table.ts

@@ -18,7 +18,7 @@
 import { useAsyncState } from '@vueuse/core'
 import { reactive, h, ref } from 'vue'
 import { parseISO, format } from 'date-fns'
-import { NButton, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NPopconfirm, NSpace, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import {
   queryAlertGroupListPaging,
@@ -90,7 +90,7 @@ export function useTable() {
                         }
                       },
                       {
-                        icon: () => h(EditOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                       }
                     ),
                   default: () => t('security.token.edit')
@@ -119,7 +119,7 @@ export function useTable() {
                               class: 'delete'
                             },
                             {
-                              icon: () => h(DeleteOutlined)
+                              icon: () => h(NIcon, null, { default: () => h(DeleteOutlined) })
                             }
                           ),
                         default: () => t('security.token.delete')

dolphinscheduler-ui-next/src/views/security/worker-group-manage/use-table.ts

@@ -17,7 +17,7 @@
 
 import { useAsyncState } from '@vueuse/core'
 import { reactive, h, ref } from 'vue'
-import { NButton, NPopconfirm, NSpace, NTag, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NPopconfirm, NSpace, NTag, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import { DeleteOutlined, EditOutlined } from '@vicons/antd'
 import {
@@ -102,7 +102,7 @@ export function useTable() {
                         }
                       },
                       {
-                        icon: () => h(EditOutlined)
+                        icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                       }
                     ),
                   default: () => t('security.worker_group.edit')
@@ -131,7 +131,7 @@ export function useTable() {
                               class: 'delete'
                             },
                             {
-                              icon: () => h(DeleteOutlined)
+                              icon: () => h(NIcon, null, { default: () => h(DeleteOutlined) })
                             }
                           ),
                         default: () => t('security.worker_group.delete')

dolphinscheduler-ui-next/src/views/security/yarn-queue-manage/use-table.ts

@@ -17,7 +17,7 @@
 
 import { useAsyncState } from '@vueuse/core'
 import { reactive, h, ref } from 'vue'
-import { NButton, NTooltip } from 'naive-ui'
+import { NButton, NIcon, NTooltip } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
 import { queryQueueListPaging } from '@/service/modules/queues'
 import { EditOutlined } from '@vicons/antd'
@@ -77,7 +77,7 @@ export function useTable() {
                     }
                   },
                   {
-                    icon: () => h(EditOutlined)
+                    icon: () => h(NIcon, null, { default: () => h(EditOutlined) })
                   }
                 ),
               default: () => t('security.yarn_queue.edit')