diff --git a/bigtop-manager-ui/src/components/job-info/job.vue b/bigtop-manager-ui/src/components/job-info/job.vue
index 3fa330b298e5efbef001de37086efb7c8bda50eb..85eb934737fd0a13f67feebab6f9cf725e0aa710 100644
--- a/bigtop-manager-ui/src/components/job-info/job.vue
+++ b/bigtop-manager-ui/src/components/job-info/job.vue
@@ -22,7 +22,6 @@
   import { useClusterStore } from '@/store/cluster'
   import { PaginationConfig } from 'ant-design-vue/es/pagination/Pagination'
   import { storeToRefs } from 'pinia'
-  import ClipboardJS from 'clipboard'
   import { message } from 'ant-design-vue'
   import {
     JobVO,
@@ -39,6 +38,9 @@
   import CustomProgress from './custom-progress.vue'
   import Stage from './stage.vue'
   import Task from './task.vue'
+  import { copyText } from '@/utils/tools'
+  import { useI18n } from 'vue-i18n'
+  const { t } = useI18n()
 
   const columns = [
     {
@@ -206,22 +208,15 @@
     })
   }
 
-  const copyLogTextContent = () => {
-    const clipboard = new ClipboardJS('.copyBtn', {
-      text: () => logText.value
-    })
-    if (!logText.value) {
-      console.error('No text to copy')
-      return
-    }
-    clipboard.on('success', () => {
-      message.success('Copy success!')
-      clipboard.destroy()
-    })
-    clipboard.on('error', () => {
-      message.success('Copy failed!')
-      clipboard.destroy()
-    })
+  const copyLogTextContent = (text: string) => {
+    copyText(text)
+      .then(() => {
+        message.success(`${t('common.copy_success')}`)
+      })
+      .catch((err: Error) => {
+        message.error(`${t('common.copy_fail')}`)
+        console.log('err :>> ', err)
+      })
   }
 
   const clickTask = (record: TaskVO) => {
@@ -344,12 +339,11 @@
           <span>Task Logs</span>
           <div class="logs_header-ops">
             <a-button
-              class="copyBtn"
               size="small"
               type="primary"
-              @click="copyLogTextContent"
+              @click="copyLogTextContent(logText)"
             >
-              copy
+              {{ $t('commom.copy') }}
             </a-button>
           </div>
         </div>
diff --git a/bigtop-manager-ui/src/locales/en_US/common.ts b/bigtop-manager-ui/src/locales/en_US/common.ts
index 2709c59fac9a71e6ac89c98be56b840e0ede02fd..a39621fa396515b4f1cd2ccc7a20735871ef1240 100644
--- a/bigtop-manager-ui/src/locales/en_US/common.ts
+++ b/bigtop-manager-ui/src/locales/en_US/common.ts
@@ -55,5 +55,8 @@ export default {
   websocket_disconnected: 'WebSocket disconnected, please reload the page',
   create_time: 'Create Time',
   update_time: 'Update Time',
-  notification: 'Notification'
+  notification: 'Notification',
+  copy: 'copy',
+  copy_success: 'Copy success!',
+  copy_fail: 'Copy failed!'
 }
diff --git a/bigtop-manager-ui/src/locales/zh_CN/common.ts b/bigtop-manager-ui/src/locales/zh_CN/common.ts
index bb950ce3e8136758607e7d951cef3e3c029f2343..7a74eb26e2ec590d617ff255ca7e7d642e3c9686 100644
--- a/bigtop-manager-ui/src/locales/zh_CN/common.ts
+++ b/bigtop-manager-ui/src/locales/zh_CN/common.ts
@@ -55,5 +55,8 @@ export default {
   websocket_disconnected: 'WebSocket 连接异常断开，请重新加载页面',
   create_time: '创建时间',
   update_time: '更新时间',
-  notification: '通知'
+  notification: '通知',
+  copy: '复制',
+  copy_success: '复制成功',
+  copy_fail: '复制失败'
 }
diff --git a/bigtop-manager-ui/src/utils/tools.ts b/bigtop-manager-ui/src/utils/tools.ts
new file mode 100644
index 0000000000000000000000000000000000000000..93542406c172609df4f8c9d2c984edffcb9156f6
--- /dev/null
+++ b/bigtop-manager-ui/src/utils/tools.ts
@@ -0,0 +1,34 @@
+/**
+ * copy text
+ * @param {string} text
+ */
+export const copyText = (text: string): Promise<any> => {
+  if (navigator.clipboard) {
+    return navigator.clipboard.writeText(text)
+  }
+  return new Promise(async (resolve, reject) => {
+    try {
+      const { default: ClipboardJS } = await import('clipboard')
+      if (!ClipboardJS.isSupported()) {
+        reject(new Error('ClipboardJS not support!'))
+        return
+      }
+      const btn = document.createElement('button')
+      btn.innerText = text
+      const clipboard = new ClipboardJS(btn, {
+        text: () => text
+      })
+      clipboard.on('success', () => {
+        resolve(true)
+        clipboard.destroy()
+      })
+      clipboard.on('error', (err) => {
+        reject(err)
+        clipboard.destroy()
+      })
+      btn.click()
+    } catch (error) {
+      console.log('copytext :>> ', error)
+    }
+  })
+}