fix: ui: fix copy text from term

Signed-off-by: Jianhui Zhao <zhaojh329@gmail.com>
2026-02-27 09:53:24 +08:00 · 2022-07-31 16:02:17 +08:00
parent 25e9fad0b4
commit 6cd409379b
7 changed files with 100 additions and 31 deletions
@@ -13,6 +13,7 @@
        "view-design": "^4.7.0-beta.9",
        "vue": "^2.6.11",
        "vue-axios": "^3.3.7",
+        "vue-clipboard2": "^0.3.3",
        "vue-i18n": "^8.25.1",
        "vue-router": "^3.2.0",
        "xterm": "^4.14.1",
@@ -4290,6 +4291,16 @@
        "node": ">= 10"
      }
    },
+    "node_modules/clipboard": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.11.tgz",
+      "integrity": "sha512-C+0bbOqkezLIsmWSvlsXS0Q0bmkugu7jcfMIACB+RDEntIzQIkdr148we28AfSloQLRdZlYL/QYyrq05j/3Faw==",
+      "dependencies": {
+        "good-listener": "^1.2.2",
+        "select": "^1.1.2",
+        "tiny-emitter": "^2.0.0"
+      }
+    },
    "node_modules/clipboardy": {
      "version": "2.3.0",
      "resolved": "https://registry.npm.taobao.org/clipboardy/download/clipboardy-2.3.0.tgz",
@@ -5845,6 +5856,11 @@
        "node": ">=0.4.0"
      }
    },
+    "node_modules/delegate": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
+      "integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw=="
+    },
    "node_modules/depd": {
      "version": "1.1.2",
      "resolved": "https://registry.nlark.com/depd/download/depd-1.1.2.tgz",
@@ -7519,6 +7535,14 @@
        "node": ">=6"
      }
    },
+    "node_modules/good-listener": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
+      "integrity": "sha512-goW1b+d9q/HIwbVYZzZ6SsTr4IgE+WA44A0GmPIQstuOrgsFcT7VEJ48nmr9GaRtNu0XTKacFLGnBPAM6Afouw==",
+      "dependencies": {
+        "delegate": "^3.1.2"
+      }
+    },
    "node_modules/graceful-fs": {
      "version": "4.2.8",
      "resolved": "https://registry.nlark.com/graceful-fs/download/graceful-fs-4.2.8.tgz?cache=0&sync_timestamp=1628194078324&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fgraceful-fs%2Fdownload%2Fgraceful-fs-4.2.8.tgz",
@@ -12319,6 +12343,11 @@
        "url": "https://opencollective.com/webpack"
      }
    },
+    "node_modules/select": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
+      "integrity": "sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA=="
+    },
    "node_modules/select-hose": {
      "version": "2.0.0",
      "resolved": "https://registry.nlark.com/select-hose/download/select-hose-2.0.0.tgz",
@@ -13725,6 +13754,11 @@
      "integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=",
      "dev": true
    },
+    "node_modules/tiny-emitter": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
+      "integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
+    },
    "node_modules/tinycolor2": {
      "version": "1.4.2",
      "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.2.tgz",
@@ -14393,6 +14427,14 @@
        "vue": "^3.0.0 || ^2.0.0"
      }
    },
+    "node_modules/vue-clipboard2": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/vue-clipboard2/-/vue-clipboard2-0.3.3.tgz",
+      "integrity": "sha512-aNWXIL2DKgJyY/1OOeITwAQz1fHaCIGvUFHf9h8UcoQBG5a74MkdhS/xqoYe7DNZdQmZRL+TAdIbtUs9OyVjbw==",
+      "dependencies": {
+        "clipboard": "^2.0.0"
+      }
+    },
    "node_modules/vue-eslint-parser": {
      "version": "7.11.0",
      "resolved": "https://registry.nlark.com/vue-eslint-parser/download/vue-eslint-parser-7.11.0.tgz?cache=0&sync_timestamp=1630882911486&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue-eslint-parser%2Fdownload%2Fvue-eslint-parser-7.11.0.tgz",
@@ -19026,6 +19068,16 @@
      "integrity": "sha1-ovSEN6LKqaIkNueUvwceyeYc7fY=",
      "dev": true
    },
+    "clipboard": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.11.tgz",
+      "integrity": "sha512-C+0bbOqkezLIsmWSvlsXS0Q0bmkugu7jcfMIACB+RDEntIzQIkdr148we28AfSloQLRdZlYL/QYyrq05j/3Faw==",
+      "requires": {
+        "good-listener": "^1.2.2",
+        "select": "^1.1.2",
+        "tiny-emitter": "^2.0.0"
+      }
+    },
    "clipboardy": {
      "version": "2.3.0",
      "resolved": "https://registry.npm.taobao.org/clipboardy/download/clipboardy-2.3.0.tgz",
@@ -20268,6 +20320,11 @@
      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
      "dev": true
    },
+    "delegate": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
+      "integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw=="
+    },
    "depd": {
      "version": "1.1.2",
      "resolved": "https://registry.nlark.com/depd/download/depd-1.1.2.tgz",
@@ -21618,6 +21675,14 @@
        "slash": "^2.0.0"
      }
    },
+    "good-listener": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
+      "integrity": "sha512-goW1b+d9q/HIwbVYZzZ6SsTr4IgE+WA44A0GmPIQstuOrgsFcT7VEJ48nmr9GaRtNu0XTKacFLGnBPAM6Afouw==",
+      "requires": {
+        "delegate": "^3.1.2"
+      }
+    },
    "graceful-fs": {
      "version": "4.2.8",
      "resolved": "https://registry.nlark.com/graceful-fs/download/graceful-fs-4.2.8.tgz?cache=0&sync_timestamp=1628194078324&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fgraceful-fs%2Fdownload%2Fgraceful-fs-4.2.8.tgz",
@@ -25487,6 +25552,11 @@
        "ajv-keywords": "^3.5.2"
      }
    },
+    "select": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
+      "integrity": "sha512-OwpTSOfy6xSs1+pwcNrv0RBMOzI39Lp3qQKUTPVVPRjCdNa5JH/oPRiqsesIskK8TVgmRiHwO4KXlV2Li9dANA=="
+    },
    "select-hose": {
      "version": "2.0.0",
      "resolved": "https://registry.nlark.com/select-hose/download/select-hose-2.0.0.tgz",
@@ -26669,6 +26739,11 @@
      "integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=",
      "dev": true
    },
+    "tiny-emitter": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
+      "integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q=="
+    },
    "tinycolor2": {
      "version": "1.4.2",
      "resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.2.tgz",
@@ -27201,6 +27276,14 @@
      "integrity": "sha512-SmNFJIkM5YF4eWfaWfmCmORy52ZP5b8ml9PCTi7C0VsuQK4vwZON6ToNWuyFGCL6U/Fp/pzfIgdLLh/O/qKzYQ==",
      "requires": {}
    },
+    "vue-clipboard2": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/vue-clipboard2/-/vue-clipboard2-0.3.3.tgz",
+      "integrity": "sha512-aNWXIL2DKgJyY/1OOeITwAQz1fHaCIGvUFHf9h8UcoQBG5a74MkdhS/xqoYe7DNZdQmZRL+TAdIbtUs9OyVjbw==",
+      "requires": {
+        "clipboard": "^2.0.0"
+      }
+    },
    "vue-eslint-parser": {
      "version": "7.11.0",
      "resolved": "https://registry.nlark.com/vue-eslint-parser/download/vue-eslint-parser-7.11.0.tgz?cache=0&sync_timestamp=1630882911486&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue-eslint-parser%2Fdownload%2Fvue-eslint-parser-7.11.0.tgz",
@@ -13,6 +13,7 @@
    "view-design": "^4.7.0-beta.9",
    "vue": "^2.6.11",
    "vue-axios": "^3.3.7",
+    "vue-clipboard2": "^0.3.3",
    "vue-i18n": "^8.25.1",
    "vue-router": "^3.2.0",
    "xterm": "^4.14.1",
@@ -66,5 +66,7 @@
  "Delete success": "Delete success",
  "Delete offline devices": "Delete offline devices",
  "There are no offline devices in selected devices": "There are no offline devices in selected devices",
-  "Invalid address": "Invalid address"
+  "Invalid address": "Invalid address",
+  "Already copied to clipboard": "Already copied to clipboard",
+  "Please use shortcut \"Shift+Insert\"": "Please use shortcut \"Shift+Insert\""
 }
@@ -67,5 +67,7 @@
  "Delete success": "删除成功",
  "Delete offline devices": "删除离线设备",
  "There are no offline devices in selected devices": "所选设备中无离线设备",
-  "Invalid address": "无效的地址"
+  "Invalid address": "无效的地址",
+  "Already copied to clipboard": "已复制到剪切板",
+  "Please use shortcut \"Shift+Insert\"": "请使用快捷键 \"Shift+Insert\""
 }
@@ -3,12 +3,14 @@ import App from './App.vue'
 import router from './router'
 import axios from 'axios'
 import VueAxios from 'vue-axios'
+import VueClipboard from 'vue-clipboard2'
 import i18n from './plugins/vue-i18n'
 import './plugins/view-design'
 import './assets/iconfont/iconfont.css'

 Vue.config.productionTip = false

+Vue.use(VueClipboard)
 Vue.use(VueAxios, axios);

 new Vue({
@@ -1,19 +0,0 @@
-export default {
-  clipboard: navigator.clipboard,
-  clipboardData: window.clipboardData,
-
-  write(text) {
-    this.clipboard.writeText(text).then();
-    this.clipboardData.setData('Text', text);
-  },
-
-  read() {
-    if (this.clipboard)
-      return this.clipboard.readText();
-
-    if (this.clipboardData)
-      return new Promise<string>(resolve => resolve(this.clipboardData?.getData('Text') || ''));
-
-    return new Promise<string>(resolve => resolve(''));
-  }
-}
@@ -13,8 +13,6 @@

 <script>
 import Contextmenu from '@/components/ContextMenu'
-import ClipboardEx from '@/plugins/clipboard'
-
 import { Terminal } from 'xterm'
 import { FitAddon } from 'xterm-addon-fit'
 import OverlayAddon from '@/plugins/xterm-addon-overlay'
@@ -71,9 +69,14 @@ export default {
    },
    onContextmenuClick(name) {
      if (name === 'copy') {
-        ClipboardEx.write(this.term.getSelection() || '');
+        const text = this.term.getSelection();
+        if (text) {
+          this.$copyText(text).then(() => {
+            this.$Message.info(this.$t('Already copied to clipboard').toString());
+          })
+        }
      } else if (name === 'paste') {
-        ClipboardEx.read().then(text => this.term.paste(text));
+        this.$Message.info(this.$t('Please use shortcut "Shift+Insert"').toString());
      } else if (name === 'clear') {
        this.term.clear();
      } else if (name === 'font+') {
@@ -85,12 +88,7 @@ export default {
        if (size && size > 12)
          this.updateFontSize(size - 1);
      } else if (name === 'file') {
-        this.$Modal.info({
-          content: this.$t('Please execute command "rtty -R" or "rtty -S" in current terminal!'),
-          onOk: () => {
-            this.term.focus();
-          }
-        });
+        this.$Message.info(this.$t('Please execute command "rtty -R" or "rtty -S" in current terminal!').toString());
      } else if (name === 'about') {
        window.open('https://github.com/zhaojh329/rtty');
      }