mirror of
https://gitee.com/dromara/go-view.git
synced 2026-04-23 00:00:12 +08:00
feat: 合并1.1.1
This commit is contained in:
@@ -11,7 +11,8 @@
|
||||
...useComponentStyle(groupData.attr, groupIndex),
|
||||
...useSizeStyle(groupData.attr),
|
||||
...getFilterStyle(groupData.styles),
|
||||
...getTransformStyle(groupData.styles)
|
||||
...getTransformStyle(groupData.styles),
|
||||
...getBlendModeStyle(groupData.styles) as any
|
||||
}"
|
||||
@click="mouseClickHandle($event, groupData)"
|
||||
@mousedown="mousedownHandle($event, groupData)"
|
||||
@@ -55,7 +56,7 @@ import { MenuEnum } from '@/enums/editPageEnum'
|
||||
import { chartColors } from '@/settings/chartThemes/index'
|
||||
import { CreateComponentType, CreateComponentGroupType } from '@/packages/index.d'
|
||||
import { MenuOptionsItemType } from '@/views/chart/hooks/useContextMenu.hook.d'
|
||||
import { animationsClass, getFilterStyle, getTransformStyle } from '@/utils'
|
||||
import { animationsClass, getFilterStyle, getTransformStyle, getBlendModeStyle } from '@/utils'
|
||||
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
|
||||
import { useContextMenu, divider } from '@/views/chart/hooks/useContextMenu.hook'
|
||||
import { useMouseHandle } from '../../hooks/useDrag.hook'
|
||||
@@ -85,26 +86,32 @@ const optionsHandle = (
|
||||
allList: MenuOptionsItemType[],
|
||||
targetInstance: CreateComponentType
|
||||
) => {
|
||||
// 多选
|
||||
const moreMenuEnums = [MenuEnum.GROUP, MenuEnum.DELETE]
|
||||
// 单选
|
||||
const singleMenuEnums = [MenuEnum.UN_GROUP]
|
||||
|
||||
const filter = (menulist: MenuEnum[]) => {
|
||||
const list: MenuOptionsItemType[] = []
|
||||
allList.forEach(item => {
|
||||
if (menulist.includes(item.key as MenuEnum)) {
|
||||
list.push(item)
|
||||
}
|
||||
})
|
||||
return list
|
||||
return allList.filter(i => menulist.includes(i.key as MenuEnum))
|
||||
}
|
||||
|
||||
// 多选处理
|
||||
if (chartEditStore.getTargetChart.selectId.length > 1) {
|
||||
return filter(moreMenuEnums)
|
||||
return filter([MenuEnum.GROUP, MenuEnum.DELETE])
|
||||
} else {
|
||||
return [...filter(singleMenuEnums), divider(), ...targetList]
|
||||
const statusMenuEnums: MenuEnum[] = []
|
||||
if (targetInstance.status.lock) {
|
||||
statusMenuEnums.push(MenuEnum.LOCK)
|
||||
} else {
|
||||
statusMenuEnums.push(MenuEnum.UNLOCK)
|
||||
}
|
||||
if (targetInstance.status.hide) {
|
||||
statusMenuEnums.push(MenuEnum.HIDE)
|
||||
} else {
|
||||
statusMenuEnums.push(MenuEnum.SHOW)
|
||||
}
|
||||
// 单选
|
||||
const singleMenuEnums = [MenuEnum.UN_GROUP]
|
||||
return [
|
||||
...filter(singleMenuEnums),
|
||||
divider(),
|
||||
...targetList.filter(i => !statusMenuEnums.includes(i.key as MenuEnum))
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -48,8 +48,19 @@ import {
|
||||
HistoryActionTypeEnum
|
||||
} from '@/store/modules/chartHistoryStore/chartHistoryStore.d'
|
||||
|
||||
const { DesktopOutlineIcon, PencilIcon, TrashIcon, CopyIcon, LayersIcon, DuplicateIcon, HelpOutlineIcon } =
|
||||
icon.ionicons5
|
||||
const {
|
||||
DesktopOutlineIcon,
|
||||
PencilIcon,
|
||||
TrashIcon,
|
||||
CopyIcon,
|
||||
LayersIcon,
|
||||
DuplicateIcon,
|
||||
HelpOutlineIcon,
|
||||
LockClosedOutlineIcon,
|
||||
LockOpenOutlineIcon,
|
||||
EyeOffOutlineIcon,
|
||||
EyeOutlineIcon
|
||||
} = icon.ionicons5
|
||||
const { StackedMoveIcon, Carbon3DCursorIcon, Carbon3DSoftwareIcon } = icon.carbon
|
||||
|
||||
const chartHistoryStoreStore = useChartHistoryStore()
|
||||
@@ -83,6 +94,14 @@ const iconHandle = (e: HistoryItemType) => {
|
||||
return Carbon3DCursorIcon
|
||||
case HistoryActionTypeEnum.UN_GROUP:
|
||||
return Carbon3DSoftwareIcon
|
||||
case HistoryActionTypeEnum.LOCK:
|
||||
return LockClosedOutlineIcon
|
||||
case HistoryActionTypeEnum.UNLOCK:
|
||||
return LockOpenOutlineIcon
|
||||
case HistoryActionTypeEnum.HIDE:
|
||||
return EyeOffOutlineIcon
|
||||
case HistoryActionTypeEnum.SHOW:
|
||||
return EyeOutlineIcon
|
||||
default:
|
||||
return PencilIcon
|
||||
}
|
||||
@@ -109,9 +128,7 @@ const options = computed(() => {
|
||||
}
|
||||
})
|
||||
|
||||
return reverse(options.filter(item => {
|
||||
return item.label
|
||||
}))
|
||||
return reverse(options.filter(item => item.label))
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="go-shape-box">
|
||||
<div class="go-shape-box" :class="{ lock, hide }">
|
||||
<slot></slot>
|
||||
<!-- 锚点 -->
|
||||
<template v-if="!hiddenPoint">
|
||||
@@ -55,14 +55,26 @@ const themeColor = computed(() => {
|
||||
|
||||
// 计算当前选中目标
|
||||
const hover = computed(() => {
|
||||
if (props.item.status.lock) return false
|
||||
return props.item.id === chartEditStore.getTargetChart.hoverId
|
||||
})
|
||||
|
||||
// 兼容多值场景
|
||||
const select = computed(() => {
|
||||
const id = props.item.id
|
||||
if (props.item.status.lock) return false
|
||||
return chartEditStore.getTargetChart.selectId.find((e: string) => e === id)
|
||||
})
|
||||
|
||||
// 锁定
|
||||
const lock = computed(() => {
|
||||
return props.item.status.lock
|
||||
})
|
||||
|
||||
// 隐藏
|
||||
const hide = computed(() => {
|
||||
return props.item.status.hide
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@@ -70,6 +82,14 @@ const select = computed(() => {
|
||||
position: absolute;
|
||||
cursor: move;
|
||||
|
||||
&.lock {
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
&.hide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 锚点 */
|
||||
.shape-point {
|
||||
z-index: 1;
|
||||
|
||||
@@ -63,6 +63,26 @@ const shortcutKeyOptions = [
|
||||
win: `${WinKeyboard.CTRL.toUpperCase()} + ← `,
|
||||
mac: `${MacKeyboard.CTRL.toUpperCase()} + ← `
|
||||
},
|
||||
{
|
||||
label: '锁定',
|
||||
win: `${WinKeyboard.CTRL.toUpperCase()} + L `,
|
||||
mac: `${MacKeyboard.CTRL.toUpperCase()} + L `
|
||||
},
|
||||
{
|
||||
label: '解锁',
|
||||
win: `${WinKeyboard.CTRL.toUpperCase()} + ${WinKeyboard.SHIFT.toUpperCase()}+ L `,
|
||||
mac: `${MacKeyboard.CTRL.toUpperCase()} + ${MacKeyboard.SHIFT.toUpperCase()} + L `
|
||||
},
|
||||
{
|
||||
label: '展示',
|
||||
win: `${WinKeyboard.CTRL.toUpperCase()} + H `,
|
||||
mac: `${MacKeyboard.CTRL.toUpperCase()} + H `
|
||||
},
|
||||
{
|
||||
label: '隐藏',
|
||||
win: `${WinKeyboard.CTRL.toUpperCase()} + ${WinKeyboard.SHIFT.toUpperCase()} + H `,
|
||||
mac: `${MacKeyboard.CTRL.toUpperCase()} + ${MacKeyboard.SHIFT.toUpperCase()} + H `
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
win: 'Delete'.toUpperCase(),
|
||||
|
||||
@@ -179,7 +179,8 @@ $asideBottom: 70px;
|
||||
}
|
||||
@include deep() {
|
||||
.n-button__icon {
|
||||
margin-right: 4px;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -140,7 +140,9 @@ export const mousedownBoxSelect = (e: MouseEvent, item?: CreateComponentType | C
|
||||
targetAttr.x1 - selectAttr.x1 >= 0 &&
|
||||
targetAttr.y1 - selectAttr.y1 >= 0 &&
|
||||
targetAttr.x2 - selectAttr.x2 <= 0 &&
|
||||
targetAttr.y2 - selectAttr.y2 <= 0
|
||||
targetAttr.y2 - selectAttr.y2 <= 0 &&
|
||||
!item.status.lock &&
|
||||
!item.status.hide
|
||||
) {
|
||||
isSelect = true
|
||||
chartEditStore.setTargetSelectChart(item.id, true)
|
||||
@@ -166,6 +168,7 @@ export const useMouseHandle = () => {
|
||||
const mouseClickHandle = (e: MouseEvent, item: CreateComponentType | CreateComponentGroupType) => {
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
if (item.status.lock) return
|
||||
// 若此时按下了 CTRL, 表示多选
|
||||
if (
|
||||
window.$KeyboardActive?.has(WinKeyboard.CTRL_SOURCE_KEY) ||
|
||||
@@ -185,6 +188,7 @@ export const useMouseHandle = () => {
|
||||
const mousedownHandle = (e: MouseEvent, item: CreateComponentType | CreateComponentGroupType) => {
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
if (item.status.lock) return
|
||||
onClickOutSide()
|
||||
// 按下左键 + CTRL
|
||||
if (
|
||||
|
||||
@@ -37,7 +37,10 @@
|
||||
v-else
|
||||
:data-id="item.id"
|
||||
:index="index"
|
||||
:style="useComponentStyle(item.attr, index)"
|
||||
:style="{
|
||||
...useComponentStyle(item.attr, index),
|
||||
...getBlendModeStyle(item.styles) as any
|
||||
}"
|
||||
:item="item"
|
||||
@click="mouseClickHandle($event, item)"
|
||||
@mousedown="mousedownHandle($event, item)"
|
||||
@@ -81,7 +84,7 @@ import { onMounted, computed } from 'vue'
|
||||
import { chartColors } from '@/settings/chartThemes/index'
|
||||
import { MenuEnum } from '@/enums/editPageEnum'
|
||||
import { CreateComponentType, CreateComponentGroupType } from '@/packages/index.d'
|
||||
import { animationsClass, getFilterStyle, getTransformStyle } from '@/utils'
|
||||
import { animationsClass, getFilterStyle, getTransformStyle, getBlendModeStyle } from '@/utils'
|
||||
import { useContextMenu } from '@/views/chart/hooks/useContextMenu.hook'
|
||||
import { MenuOptionsItemType } from '@/views/chart/hooks/useContextMenu.hook.d'
|
||||
import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore'
|
||||
@@ -116,24 +119,22 @@ const optionsHandle = (
|
||||
allList: MenuOptionsItemType[],
|
||||
targetInstance: CreateComponentType
|
||||
) => {
|
||||
// 多选
|
||||
const moreMenuEnums = [MenuEnum.GROUP, MenuEnum.DELETE]
|
||||
// 单选
|
||||
const singleMenuEnums = targetList
|
||||
|
||||
// 多选处理
|
||||
if (chartEditStore.getTargetChart.selectId.length > 1) {
|
||||
const list: MenuOptionsItemType[] = []
|
||||
|
||||
allList.forEach(item => {
|
||||
// 成组
|
||||
if (moreMenuEnums.includes(item.key as MenuEnum)) {
|
||||
list.push(item)
|
||||
}
|
||||
})
|
||||
return list
|
||||
return allList.filter(i => [MenuEnum.GROUP, MenuEnum.DELETE].includes(i.key as MenuEnum))
|
||||
}
|
||||
return singleMenuEnums
|
||||
const statusMenuEnums: MenuEnum[] = []
|
||||
if (targetInstance.status.lock) {
|
||||
statusMenuEnums.push(MenuEnum.LOCK)
|
||||
} else {
|
||||
statusMenuEnums.push(MenuEnum.UNLOCK)
|
||||
}
|
||||
if (targetInstance.status.hide) {
|
||||
statusMenuEnums.push(MenuEnum.HIDE)
|
||||
} else {
|
||||
statusMenuEnums.push(MenuEnum.SHOW)
|
||||
}
|
||||
return targetList.filter(i => !statusMenuEnums.includes(i.key as MenuEnum))
|
||||
}
|
||||
|
||||
// 主题色
|
||||
|
||||
Reference in New Issue
Block a user