mirrors/poster-design
1
0
Fork 0
mirror of https://github.com/palxiao/poster-design synced 2024-11-21 07:08:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: copy&paste bug

Browse Source
This commit is contained in:
ShawnPhang 2024-03-14 00:50:30 +08:00
parent 22ff9dfbc7
commit 8d49a66435
6 changed files with 62 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/modules/settings/valueSelect.vue
View File

@ -65,7 +65,7 @@ import { computed, onMounted, reactive, ref, watch } from 'vue';
type TProps = {
label?: string
modelValue?: Record<string, any>
modelValue?: Record<string, any> | string | number
suffix?: string
data: Record<string, any>
disable?: boolean
@ -189,9 +189,8 @@ function down() {
</style>
<style lang="less" scoped>
// Color variables (appears count calculates by raw css)
@color0: #e1e1e1; // Appears 2 times
@color1: #d1d1d1; // Appears 2 times
@color0: #e1e1e1;
@color1: #d1d1d1;
.value-select {
// height: 60px;

17
src/mixins/methods/dealWithCtrl.ts
View File

@ -50,7 +50,7 @@ function checkGroupChild(pid: number | string, key: any) {
return itHas
}
/**
* 复制
* 复制元素
*/
function copy() {
if (store.getters.dActiveElement.uuid === '-1') {
@ -64,13 +64,14 @@ function copy() {
* 粘贴
*/
function paste() {
handlePaste()
if (store.getters.dCopyElement.length === 0) {
return
} else if (store.getters.dActiveElement.isContainer && checkGroupChild(store.getters.dActiveElement.uuid, 'editable')) {
return
}
!store.getters.dActiveElement.editable && store.dispatch('pasteWidget')
handlePaste().then(() => {
if (store.getters.dCopyElement.length === 0) {
return
} else if (store.getters.dActiveElement.isContainer && checkGroupChild(store.getters.dActiveElement.uuid, 'editable')) {
return
}
!store.getters.dActiveElement.editable && store.dispatch('pasteWidget')
})
}
/**
* 撤销

84
src/mixins/methods/handlePaste.ts
View File

@ -20,41 +20,53 @@ import wImage from '@/components/modules/widgets/wImage/wImage.vue'
import wText from '@/components/modules/widgets/wText/wText.vue'
export default () => {
navigator.clipboard
.read()
.then(async (dataTransfer: any) => {
for (let i = 0; i < dataTransfer.length; i++) {
const item = dataTransfer[i]
if (item.types.toString().indexOf('image') !== -1) {
const imageBlob = await item.getType(item.types[0])
const file = new File([imageBlob], 'screenshot.png', { type: 'image/png' })
// 上传图片
const qnOptions = { bucket: 'xp-design', prePath: 'user' }
const result: any = await Qiniu.upload(file, qnOptions)
const { width, height }: any = await getImage(file)
const url = _config.IMG_URL + result.key
await api.material.addMyPhoto({ width, height, url })
// 添加图片到画布中
store.commit('setShowMoveable', false) // 清理掉上一次的选择
const setting = JSON.parse(JSON.stringify(wImage.setting))
setting.width = width
setting.height = height
setting.imgUrl = url
const { width: pW, height: pH } = store.getters.dPage
setting.left = pW / 2 - width / 2
setting.top = pH / 2 - height / 2
store.dispatch('addWidget', setting)
break
} else if (item.types.toString().indexOf('text') !== -1) {
store.commit('setShowMoveable', false) // 清理掉上一次的选择
const setting = JSON.parse(JSON.stringify(wText.setting))
setting.text = await navigator.clipboard.readText()
store.dispatch('addWidget', setting)
break
return new Promise<void>((resolve) => {
navigator.clipboard
.read()
.then(async (dataTransfer: any) => {
if (store.getters.dActiveElement.editable) {
return
}
}
})
.catch((error) => {
console.error('无法读取剪贴板内容：', error)
})
for (let i = 0; i < dataTransfer.length; i++) {
const item = dataTransfer[i]
if (item.types.toString().indexOf('image') !== -1) {
const imageBlob = await item.getType(item.types[0])
const file = new File([imageBlob], 'screenshot.png', { type: 'image/png' })
// 上传图片
const qnOptions = { bucket: 'xp-design', prePath: 'user' }
const result: any = await Qiniu.upload(file, qnOptions)
const { width, height }: any = await getImage(file)
const url = _config.IMG_URL + result.key
await api.material.addMyPhoto({ width, height, url })
// 添加图片到画布中
store.commit('setShowMoveable', false) // 清理掉上一次的选择
const setting = JSON.parse(JSON.stringify(wImage.setting))
setting.width = width
setting.height = height
setting.imgUrl = url
const { width: pW, height: pH } = store.getters.dPage
setting.left = pW / 2 - width / 2
setting.top = pH / 2 - height / 2
store.dispatch('addWidget', setting)
// 清空剪贴板，防止多次上传图片
navigator.clipboard.write([
new ClipboardItem({
'text/plain': new Blob([''], {type: 'text/plain'})
})
])
break
} else if (item.types.toString().indexOf('text') !== -1) {
store.commit('setShowMoveable', false) // 清理掉上一次的选择
const setting = JSON.parse(JSON.stringify(wText.setting))
setting.text = await navigator.clipboard.readText()
store.dispatch('addWidget', setting)
break
}
}
})
.catch((error) => {
// 剪贴板内容为空
resolve()
})
})
}

2
src/store/modules/design/actions.ts
View File

@ -237,7 +237,7 @@ export default {
if (activeElement.type === 'page') {
return
}
navigator.clipboard.writeText('') // 清空系统剪贴板内容
const container = []
const selectWidgets = store.state.dSelectWidgets
if (selectWidgets.length === 0) {

1
src/store/modules/design/index.ts
View File

@ -29,7 +29,6 @@ const all = {
dDraging: false, // 是否正在抓取组件
dResizeing: false, // 是否正在调整组件宽高
dShowRefLine: true, // 是否显示参考线
dResizeWH: {
// 初始化调整大小时组件的宽高
width: 0,

1
vite.config.ts
View File

@ -58,6 +58,7 @@ export default defineConfig({
},
server: {
hmr: { overlay: false },
host: '127.0.0.1'
// proxy: {
// '/api': {
// target: '',