Browse Source

修复选框被card遮挡的问题

liwei 1 year ago
parent
commit
4d3286818a

+ 0 - 3
src/modules/editor/components/CompUI/basicUI/Container/component.tsx

@@ -24,9 +24,6 @@ export const Component = defineComponent({
 
           return <Comp key={compItem.id} compId={compItem.id} />;
         })}
-        {
-          store.currStreamCardId == props.compId && <SelectTransfer />
-        }
       </View>
     );
   },

+ 7 - 3
src/modules/editor/components/CompUI/basicUI/Transfer/select.tsx

@@ -3,11 +3,12 @@ import { CompToolbars } from "@/modules/editor/objects/Toolbars";
 import { css } from "@linaria/core";
 import { defineComponent, onMounted, onUnmounted, ref, nextTick } from "vue";
 import { useEditor } from "../../../..";
+import { styles } from "dom7";
 
 export const SelectTransfer = defineComponent({
   setup() {
     const editor = useEditor();
-    const { controls } = editor;
+    const { controls, store } = editor;
     const { selectCtrl } = controls;
     const { transferStyle } = selectCtrl;
 
@@ -56,15 +57,18 @@ export const SelectTransfer = defineComponent({
         //@ts-ignore
         toolbarOpts = CompToolbars[comp.compKey] || toolbarOpts;
       }
-
       const w = selectCtrl.objContainer?.getBound();
-
+      
       return (
         <div
           class={[
             "absolute transfer z-1001",
             transferStyle.showGizmo ? showgizmo : hideGizmo,
+           
           ]}
+          style={{
+            top: transferStyle.baseCardTop
+          }}
         >
           <div
             class={toolbarStyle}

+ 4 - 1
src/modules/editor/components/Viewport/Content/index.tsx

@@ -8,7 +8,7 @@ import { HotKeyCtrl } from "../../../controllers/HotKeyCtrl";
 import { CompUI } from "../../CompUI";
 import { Transfer } from "../../CompUI/basicUI/Transfer";
 import { StreamCardTransfer } from "../../CompUI/basicUI/Transfer/streamCard";
-// import { SelectTransfer } from "../../CompUI/basicUI/Transfer/streamCard";
+import { SelectTransfer } from "../../CompUI/basicUI/Transfer/select";
 
 export default defineUI({
   setup() {
@@ -104,6 +104,9 @@ export default defineUI({
                           !state.draging && (
                             <Transfer key={store.currCompId + streamCardIndex} />
                           )} */}
+
+                        
+                        <SelectTransfer />
                       </>
                     );
                   },

+ 12 - 6
src/modules/editor/controllers/SelectCtrl/index.ts

@@ -34,6 +34,7 @@ export class SelectCtrl extends ModuleControl<EditorModule> {
   };
 
   transferStyle = reactive({
+    baseCardTop: "0px",
     showGizmo: false,
     width: 0,
     height: 0,
@@ -141,11 +142,12 @@ export class SelectCtrl extends ModuleControl<EditorModule> {
           if (!isOut) {
             this._state = MODE_SEL_RECT;
           }
-        } else {
-          this._state = MODE_MOVING;
-          const obj = this.compMap[comps[0].id];
-          this.selecteObjs([new CompObject(obj)]);
-        }
+        } 
+        //else {
+        //   this._state = MODE_MOVING;
+        //   const obj = this.compMap[comps[0].id];
+        //   this.selecteObjs([new CompObject(obj)]);
+        // }
       }
     } else if (this._mouseDownFlag == "rotate") {
       this._state = MODE_ROTATE;
@@ -379,7 +381,7 @@ export class SelectCtrl extends ModuleControl<EditorModule> {
 
   upgateGizmoStyle() {
     this.helper.extendStreamCard(this.store.currStreamCardId);
-    
+
     if (this.selected.length < 1) {
       this.transferStyle.showGizmo = false;
       return;
@@ -387,6 +389,10 @@ export class SelectCtrl extends ModuleControl<EditorModule> {
 
     this.transferStyle.showGizmo = false;
 
+     //@ts-ignore
+    const yoff = this.store.currStreamCard.$el.getBoundingClientRect().top -  this.pageEl?.getBoundingClientRect().top;
+    this.transferStyle.baseCardTop = yoff + "px";
+
     const selector = this.objContainer as ObjsContainer;
     if (!selector) {
       return;