fix: lock component

This commit is contained in:
hufeixiong
2021-07-27 16:35:09 +08:00
parent 0619bdfc81
commit b2a02f0ebb
9 changed files with 103 additions and 11 deletions

View File

@@ -1,5 +1,14 @@
## changelog ## changelog
## 0.7.2
修复锁定组件影响,锁定中无法拖拽,缩放,旋转。
## 0.7.1
修复锁定组件无法选中解锁。
## 0.7.0 ## 0.7.0
已支持组件旋转! 已支持组件旋转!

View File

@@ -6,6 +6,15 @@ order: 1
## changelog ## changelog
## 0.7.2
修复锁定组件影响,锁定中无法拖拽,缩放,旋转。
## 0.7.1
修复锁定组件无法选中解锁。
## 0.7.0 ## 0.7.0
已支持组件旋转! 已支持组件旋转!

View File

@@ -2,7 +2,7 @@
* @Author: yehuozhili * @Author: yehuozhili
* @Date: 2021-07-07 14:51:17 * @Date: 2021-07-07 14:51:17
* @LastEditors: yehuozhili * @LastEditors: yehuozhili
* @LastEditTime: 2021-07-13 19:55:15 * @LastEditTime: 2021-07-27 16:24:29
* @FilePath: \dooringx\packages\dooringx-example\src\layouts\index.tsx * @FilePath: \dooringx\packages\dooringx-example\src\layouts\index.tsx
*/ */
import { Button } from 'antd'; import { Button } from 'antd';
@@ -47,6 +47,24 @@ const ContextMenu = () => {
> >
<Button></Button> <Button></Button>
</div> </div>
<div
style={{ width: '100%' }}
onClick={() => {
commander.exec('lock');
handleclick();
}}
>
<Button style={{ width: '100%' }}></Button>
</div>
<div
style={{ width: '100%' }}
onClick={() => {
commander.exec('unlock');
handleclick();
}}
>
<Button style={{ width: '100%' }}></Button>
</div>
</div> </div>
); );
}; };

View File

@@ -0,0 +1,27 @@
/*
* @Author: yehuozhili
* @Date: 2021-07-27 16:19:58
* @LastEditors: yehuozhili
* @LastEditTime: 2021-07-27 16:19:59
* @FilePath: \dooringx\packages\dooringx-example\src\plugin\commands\lock.ts
*/
import deepcopy from 'deepcopy';
import { CommanderItemFactory } from 'dooringx-lib';
import { IStoreData } from 'dooringx-lib/dist/core/store/storetype';
const lock = new CommanderItemFactory(
'lock',
'',
(store) => {
const clonedata: IStoreData = deepcopy(store.getData());
clonedata.block.forEach((v) => {
if (v.focus) {
v.canDrag = false;
}
});
store.setData(clonedata);
},
'锁定'
);
export default lock;

View File

@@ -0,0 +1,27 @@
/*
* @Author: yehuozhili
* @Date: 2021-07-27 16:20:04
* @LastEditors: yehuozhili
* @LastEditTime: 2021-07-27 16:20:20
* @FilePath: \dooringx\packages\dooringx-example\src\plugin\commands\unlock.ts
*/
import deepcopy from 'deepcopy';
import { CommanderItemFactory } from 'dooringx-lib';
import { IStoreData } from 'dooringx-lib/dist/core/store/storetype';
const unlock = new CommanderItemFactory(
'unlock',
'',
(store) => {
const clonedata: IStoreData = deepcopy(store.getData());
clonedata.block.forEach((v) => {
if (v.focus) {
v.canDrag = true;
}
});
store.setData(clonedata);
},
'解锁'
);
export default unlock;

View File

@@ -1,5 +1,5 @@
{ {
"version": "0.7.0", "version": "0.7.2",
"license": "MIT", "license": "MIT",
"main": "dist/index.js", "main": "dist/index.js",
"module": "dist/dooringx-lib.esm.js", "module": "dist/dooringx-lib.esm.js",

View File

@@ -1,5 +1,5 @@
import { RefObject } from 'react'; import { RefObject } from 'react';
import { blockFocus, containerFocusRemove } from '../focusHandler'; import { blockFocus } from '../focusHandler';
import { marklineConfig } from '../markline/marklineConfig'; import { marklineConfig } from '../markline/marklineConfig';
import { resizerMouseMove, resizerMouseUp } from '../resizeHandler'; import { resizerMouseMove, resizerMouseUp } from '../resizeHandler';
import { selectRangeMouseMove, selectData, selectRangeMouseUp } from '../selectRange'; import { selectRangeMouseMove, selectData, selectRangeMouseUp } from '../selectRange';
@@ -22,14 +22,16 @@ export const innerDrag = function (
onMouseDown: (e: React.MouseEvent) => { onMouseDown: (e: React.MouseEvent) => {
//e.preventDefault(); //e.preventDefault();
e.stopPropagation(); e.stopPropagation();
if (!item.canDrag) {
containerFocusRemove(config).onMouseDown(e);
return;
}
blockFocus(e, item, config);
if (item.id && innerDragState.lastClick && item.id !== innerDragState.lastClick.id) { if (item.id && innerDragState.lastClick && item.id !== innerDragState.lastClick.id) {
contextMenuState.unmountContextMenu(); contextMenuState.unmountContextMenu();
} }
//candrag给选中不给拖
blockFocus(e, item, config);
if (!item.canDrag) {
//containerFocusRemove(config).onMouseDown(e);
return;
}
innerDragState.lastClick = item; innerDragState.lastClick = item;
if (item.position === 'static') { if (item.position === 'static') {

View File

@@ -185,7 +185,7 @@ export function BlockResizer(props: BlockResizerProps) {
const rotate = props.data.rotate.value; const rotate = props.data.rotate.value;
const cursorMap = getCursor(rotate); const cursorMap = getCursor(rotate);
const render = useMemo(() => { const render = useMemo(() => {
if (props.data.focus && props.data.resize) { if (props.data.focus && props.data.resize && props.data.canDrag) {
return ( return (
<> <>
{directionArr.map((v) => { {directionArr.map((v) => {

View File

@@ -2,7 +2,7 @@
* @Author: yehuozhili * @Author: yehuozhili
* @Date: 2021-07-21 20:51:58 * @Date: 2021-07-21 20:51:58
* @LastEditors: yehuozhili * @LastEditors: yehuozhili
* @LastEditTime: 2021-07-27 14:53:15 * @LastEditTime: 2021-07-27 16:32:30
* @FilePath: \dooringx\packages\dooringx-lib\src\core\rotateHandler\index.tsx * @FilePath: \dooringx\packages\dooringx-lib\src\core\rotateHandler\index.tsx
*/ */
import React from 'react'; import React from 'react';
@@ -90,7 +90,7 @@ interface RotateResizerProps {
} }
export function RotateResizer(props: RotateResizerProps) { export function RotateResizer(props: RotateResizerProps) {
const render = useMemo(() => { const render = useMemo(() => {
if (props.data.focus && props.data.rotate.canRotate) { if (props.data.focus && props.data.rotate.canRotate && props.data.canDrag) {
return ( return (
<div <div
onMouseDown={(e) => { onMouseDown={(e) => {