fix: lock component

packages/dooringx-doc/src/changelog/1.1.md

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

packages/dooringx-example/src/layouts/index.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-07-07 14:51:17
  * @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
  */
 import { Button } from 'antd';
@@ -47,6 +47,24 @@ const ContextMenu = () => {
 			>
 				<Button>自定义</Button>
 			</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>
 	);
 };

packages/dooringx-example/src/plugin/commands/lock.ts

@@ -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;

packages/dooringx-example/src/plugin/commands/unlock.ts

@@ -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;

packages/dooringx-lib/package.json

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

packages/dooringx-lib/src/core/innerDrag/index.ts

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

packages/dooringx-lib/src/core/resizeHandler/index.tsx

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

packages/dooringx-lib/src/core/rotateHandler/index.tsx

@@ -2,7 +2,7 @@
  * @Author: yehuozhili
  * @Date: 2021-07-21 20:51:58
  * @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
  */
 import React from 'react';
@@ -90,7 +90,7 @@ interface RotateResizerProps {
 }
 export function RotateResizer(props: RotateResizerProps) {
 	const render = useMemo(() => {
-		if (props.data.focus && props.data.rotate.canRotate) {
+		if (props.data.focus && props.data.rotate.canRotate && props.data.canDrag) {
 			return (
 				<div
 					onMouseDown={(e) => {