From 074213c65606b44d2e2eb6498576b7630fd756f7 Mon Sep 17 00:00:00 2001 From: xiaoxian521 <1923740402@qq.com> Date: Thu, 29 Apr 2021 03:12:44 +0800 Subject: [PATCH] fix: some small chang --- package-lock.json | 31 +++-- package.json | 2 +- src/plugins/vxe-table/index.ts | 5 +- src/utils/useCopyToClipboard.ts | 72 +++++++++++ src/views/system/dict.vue | 223 ++++++++++++++++++++------------ vite.config.ts | 3 +- 6 files changed, 239 insertions(+), 97 deletions(-) create mode 100644 src/utils/useCopyToClipboard.ts diff --git a/package-lock.json b/package-lock.json index 4dfa014af..a657071d8 100644 --- a/package-lock.json +++ b/package-lock.json @@ -33,7 +33,7 @@ "vue-types": "^3.0.2", "vuedraggable": "^4.0.1", "vuex": "^4.0.0", - "vxe-table": "^4.0.14", + "vxe-table": "^4.0.15-beta.2", "wangeditor": "^4.0.3", "xe-ajax": "^4.0.5", "xe-utils": "^3.1.12", @@ -2710,9 +2710,13 @@ "integrity": "sha1-rId6p2qcRTaMl5Rx5GG1INOObPU=" }, "node_modules/vxe-table": { - "version": "4.0.14", - "resolved": "https://registry.npmjs.org/vxe-table/-/vxe-table-4.0.14.tgz", - "integrity": "sha512-0fwddIk7X+NPneZuucvy6BbTmZ9oRfTxP02ZfWOu5c4KegVSFTIxMWlGkDOhtwf67HcA6gh9UwWkyoPiKhvvCQ==" + "version": "4.0.15-beta.2", + "resolved": "https://registry.npmjs.org/vxe-table/-/vxe-table-4.0.15-beta.2.tgz", + "integrity": "sha512-XbyoVFAbvwnOzCcvNiGpe8vHBCUTwQzv2GBv5HjlzGKEy+e99eEAeIcEzYfXvu4ttIva+5u+at9svwRNKT8EBA==", + "peerDependencies": { + "vue": "^3.0.0", + "xe-utils": "^3.2.0" + } }, "node_modules/wangeditor": { "version": "4.6.14", @@ -2750,9 +2754,9 @@ "integrity": "sha1-N2kPiaN9m19U7yrk79PpJXDzLfM=" }, "node_modules/xe-utils": { - "version": "3.1.13", - "resolved": "https://registry.npm.taobao.org/xe-utils/download/xe-utils-3.1.13.tgz", - "integrity": "sha1-6YPu28XoJNEnbOfvB3wFbfsdakk=" + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/xe-utils/-/xe-utils-3.2.1.tgz", + "integrity": "sha512-NiupDI5mIziz4i152UCk78c/qxYH/TDexGylLj81kxPbrePEg43LQ8hITCbsqpJDTcu9dmXESUtZyQDD1oB0hw==" }, "node_modules/xgplayer": { "version": "2.19.1", @@ -5050,9 +5054,10 @@ "integrity": "sha1-rId6p2qcRTaMl5Rx5GG1INOObPU=" }, "vxe-table": { - "version": "4.0.14", - "resolved": "https://registry.npmjs.org/vxe-table/-/vxe-table-4.0.14.tgz", - "integrity": "sha512-0fwddIk7X+NPneZuucvy6BbTmZ9oRfTxP02ZfWOu5c4KegVSFTIxMWlGkDOhtwf67HcA6gh9UwWkyoPiKhvvCQ==" + "version": "4.0.15-beta.2", + "resolved": "https://registry.npmjs.org/vxe-table/-/vxe-table-4.0.15-beta.2.tgz", + "integrity": "sha512-XbyoVFAbvwnOzCcvNiGpe8vHBCUTwQzv2GBv5HjlzGKEy+e99eEAeIcEzYfXvu4ttIva+5u+at9svwRNKT8EBA==", + "requires": {} }, "wangeditor": { "version": "4.6.14", @@ -5086,9 +5091,9 @@ "integrity": "sha1-N2kPiaN9m19U7yrk79PpJXDzLfM=" }, "xe-utils": { - "version": "3.1.13", - "resolved": "https://registry.npm.taobao.org/xe-utils/download/xe-utils-3.1.13.tgz", - "integrity": "sha1-6YPu28XoJNEnbOfvB3wFbfsdakk=" + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/xe-utils/-/xe-utils-3.2.1.tgz", + "integrity": "sha512-NiupDI5mIziz4i152UCk78c/qxYH/TDexGylLj81kxPbrePEg43LQ8hITCbsqpJDTcu9dmXESUtZyQDD1oB0hw==" }, "xgplayer": { "version": "2.19.1", diff --git a/package.json b/package.json index 6d8a931e5..d8c0a0b44 100644 --- a/package.json +++ b/package.json @@ -36,7 +36,7 @@ "vue-types": "^3.0.2", "vuedraggable": "^4.0.1", "vuex": "^4.0.0", - "vxe-table": "^4.0.14", + "vxe-table": "^4.0.15-beta.2", "wangeditor": "^4.0.3", "xe-ajax": "^4.0.5", "xe-utils": "^3.1.12", diff --git a/src/plugins/vxe-table/index.ts b/src/plugins/vxe-table/index.ts index 3566e512a..d7f61ffc5 100644 --- a/src/plugins/vxe-table/index.ts +++ b/src/plugins/vxe-table/index.ts @@ -53,13 +53,16 @@ VXETable.setup({ version: 0, zIndex: 100, table: { + // 自动监听父元素的变化去重新计算表格 autoResize: true, + // 鼠标移到行是否要高亮显示 + highlightHoverRow: true, }, // 对组件内置的提示语进行国际化翻译 i18n: (key, args) => i18n.global.t(key, args), // 可选，对参数中的列头、校验提示..等进行自动翻译（只对支持国际化的有效） translate(key, args) { - // 例如，只翻译 "app." 开头的键值 + // 例如，只翻译 "message." 开头的键值 if (key && key.indexOf("message.") > -1) { return i18n.global.t(key, args); } diff --git a/src/utils/useCopyToClipboard.ts b/src/utils/useCopyToClipboard.ts new file mode 100644 index 000000000..c58e3abac --- /dev/null +++ b/src/utils/useCopyToClipboard.ts @@ -0,0 +1,72 @@ +import { ref, watch } from "vue"; + +import { isDef } from "/@/utils/is"; +interface Options { + target?: HTMLElement; +} +export function useCopyToClipboard(initial?: string) { + const clipboardRef = ref(initial || ""); + const isSuccessRef = ref(false); + const copiedRef = ref(false); + + watch( + clipboardRef, + (str?: string) => { + if (isDef(str)) { + copiedRef.value = true; + isSuccessRef.value = copyTextToClipboard(str); + } + }, + { immediate: !!initial, flush: "sync" } + ); + + return { clipboardRef, isSuccessRef, copiedRef }; +} + +export function copyTextToClipboard( + input: string, + { target = document.body }: Options = {} +) { + const element = document.createElement("textarea"); + const previouslyFocusedElement = document.activeElement; + + element.value = input; + + element.setAttribute("readonly", ""); + + (element.style as any).contain = "strict"; + element.style.position = "absolute"; + element.style.left = "-9999px"; + element.style.fontSize = "12pt"; + + const selection = document.getSelection(); + let originalRange; + if (selection && selection.rangeCount > 0) { + originalRange = selection.getRangeAt(0); + } + + target.append(element); + element.select(); + + element.selectionStart = 0; + element.selectionEnd = input.length; + + let isSuccess = false; + try { + isSuccess = document.execCommand("copy"); + } catch (e) { + throw new Error(e); + } + + element.remove(); + + if (originalRange && selection) { + selection.removeAllRanges(); + selection.addRange(originalRange); + } + + if (previouslyFocusedElement) { + (previouslyFocusedElement as HTMLElement).focus(); + } + return isSuccess; +} diff --git a/src/views/system/dict.vue b/src/views/system/dict.vue index db612ca69..0458e9f69 100644 --- a/src/views/system/dict.vue +++ b/src/views/system/dict.vue @@ -1,15 +1,20 @@