提交 3710dde1 编写于 作者: B baiy 提交者: ninecents

优化剪贴板功能 #86

上级 74b87697
...@@ -39,7 +39,7 @@ const tool = [ ...@@ -39,7 +39,7 @@ const tool = [
{'name': 'json', 'title': 'JSON工具', 'cat': ['conversion', 'serialize']}, {'name': 'json', 'title': 'JSON工具', 'cat': ['conversion', 'serialize']},
{'name': 'url', 'title': 'URL编码', 'cat': ['conversion']}, {'name': 'url', 'title': 'URL编码', 'cat': ['conversion']},
{'name': 'timestamp', 'title': '时间戳', 'cat': ['conversion']}, {'name': 'timestamp', 'title': '时间戳', 'cat': ['conversion']},
{'name': 'qrCode', 'title': '二维码', 'cat': ['other']}, {'name': 'qrCode', 'title': '二维码', 'cat': ['generate']},
{'name': 'pinyin', 'title': '汉字转拼音', 'cat': ['conversion']}, {'name': 'pinyin', 'title': '汉字转拼音', 'cat': ['conversion']},
{'name': 'ip', 'title': 'IP地址查询', 'cat': ['other']}, {'name': 'ip', 'title': 'IP地址查询', 'cat': ['other']},
{'name': 'code', 'title': '代码格式化', 'cat': ['other']}, {'name': 'code', 'title': '代码格式化', 'cat': ['other']},
......
import {Base64} from "js-base64"; import {isUtools} from '../helper'
// 剪贴板操作 // 剪贴板操作
export const copy = (data, successCallback) => { export const copy = (data,successCallback)=>{
try { document.querySelector(
navigator.clipboard.writeText(data).then(function () { '#clipboard').innerHTML = '<textarea id="clipboard-text"></textarea>'
successCallback && successCallback() document.querySelector('#clipboard-text').value = data
}, function (e) { document.querySelector('#clipboard-text').select()
console.log('copy failed', e) if (document.execCommand('copy')) {
}); successCallback && successCallback()
} catch (e) {
console.log('copy error', e)
} }
document.querySelector('#clipboard').innerHTML = ''
} }
export const paste = async () => { export const paste = ()=>{
return new Promise((resolve) => { document.querySelector(
try { '#clipboard').innerHTML = '<textarea id="clipboard-text"></textarea>'
navigator.clipboard.readText().then((text) => { document.querySelector('#clipboard-text').select()
return resolve(text ? text : "") document.execCommand('paste')
}).catch((e) => { let r = document.querySelector('#clipboard-text').value ||
console.error(e) document.querySelector('#clipboard-text').innerHTML
return resolve("") document.querySelector('#clipboard').innerHTML = ''
}) return r ? r : ''
} catch {
resolve("")
}
});
} }
export const copyImage = (imageBase64, successCallback = "") => { export const copyImage = (imageBase64,successCallback = "")=>{
if (imageBase64) { if (isUtools && imageBase64){
try { window.utools.copyImage(imageBase64)
let arr = imageBase64.split(',') successCallback && successCallback()
let mime = arr[0].match(/:(.*?);/)[1];
let data = [new window.ClipboardItem({
[mime]: new Blob([Base64.toUint8Array(arr[1])], {type: mime})
})];
navigator.clipboard.write(data).then(function () {
successCallback && successCallback()
}, function (e) {
console.log('copy image failed', e)
});
} catch (e) {
console.log('copy image error', e)
}
} }
} }
......
import config from './config' import config from './config'
import clipboard from './clipboard'
import setting from './setting' import setting from './setting'
import cache from './cache' import cache from './cache'
import history from './history.js' import history from './history.js'
...@@ -43,17 +44,6 @@ const model = { ...@@ -43,17 +44,6 @@ const model = {
} }
} }
const clipboardPaste = function () {
document.querySelector(
'#clipboard').innerHTML = '<textarea id="clipboard-text"></textarea>'
document.querySelector('#clipboard-text').select()
document.execCommand('paste')
let r = document.querySelector('#clipboard-text').value ||
document.querySelector('#clipboard-text').innerHTML
document.querySelector('#clipboard').innerHTML = ''
return r ? r : ''
}
export const plugin = { export const plugin = {
install: function (Vue) { install: function (Vue) {
Vue.prototype.$getToolData = function (clipboardField = '') { Vue.prototype.$getToolData = function (clipboardField = '') {
...@@ -63,7 +53,7 @@ export const plugin = { ...@@ -63,7 +53,7 @@ export const plugin = {
data[clipboardField] = fixeInputData data[clipboardField] = fixeInputData
fixeInputData = "" fixeInputData = ""
} else if (setting.autoReadCopy()) { } else if (setting.autoReadCopy()) {
let paste = clipboardPaste() let paste = clipboard.paste()
if (!data[clipboardField] && paste) { if (!data[clipboardField] && paste) {
if (setting.autoReadCopyFilter()){ if (setting.autoReadCopyFilter()){
paste = paste.trim() paste = paste.trim()
...@@ -79,16 +69,17 @@ export const plugin = { ...@@ -79,16 +69,17 @@ export const plugin = {
} }
Vue.prototype.$clipboardCopy = function (data) { Vue.prototype.$clipboardCopy = function (data) {
if (!setting.autoSaveCopy() || !data) return if (!setting.autoSaveCopy() || !data) return
document.querySelector( clipboard.copy(data,()=>{
'#clipboard').innerHTML = '<textarea id="clipboard-text"></textarea>'
document.querySelector('#clipboard-text').value = data
document.querySelector('#clipboard-text').select()
if (document.execCommand('copy')) {
this.$Message.success('结果已复制 ^o^') this.$Message.success('结果已复制 ^o^')
} })
document.querySelector('#clipboard').innerHTML = '' }
Vue.prototype.$clipboardCopyImages = function (data) {
if (!setting.autoSaveCopy() || !data) return
clipboard.copyImage(data,()=>{
this.$Message.success('图片已复制 ^o^')
})
} }
}, },
} }
export default model export default model
\ No newline at end of file
...@@ -87,7 +87,7 @@ ...@@ -87,7 +87,7 @@
generateHandle (str) { generateHandle (str) {
generator.toDataURL(str, (error, url) => { generator.toDataURL(str, (error, url) => {
if (error) return this.$Message.error('二维码生成错误:' + error) if (error) return this.$Message.error('二维码生成错误:' + error)
this.$Message.success('生成成功') this.$clipboardCopyImages(url)
this.current.generateOutput = `<img style="width:300px" src="${url}" />` this.current.generateOutput = `<img style="width:300px" src="${url}" />`
}) })
}, },
...@@ -118,4 +118,4 @@ ...@@ -118,4 +118,4 @@
} }
}, },
} }
</script> </script>
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册