feat: ✨添加连线的控制开关属性

xpyjs · May 17, 2023 · b5c3d98 · b5c3d98
1 parent 667b15c
commit b5c3d98
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 18 deletions.
diff --git a/demo/demo.vue b/demo/demo.vue
@@ -135,7 +135,7 @@
         ellipsis
       />
 
-      <x-gantt-slider prop="o.t1"> </x-gantt-slider>
+      <x-gantt-slider prop="o.t1" :allow-link="false"> </x-gantt-slider>
     </x-gantt>
   </div>
 </template>

diff --git a/src/components/slider/index.vue b/src/components/slider/index.vue
@@ -17,17 +17,6 @@
     @click.stop
     @pointerup="onPointerUp"
   >
-    <!-- <div
-      :class="[
-        'xg-slider-anchor',
-        'in-anchor',
-        {
-          'xg-slider-anchor__show': $param.hoverItem?.uuid === props.data?.uuid
-        }
-      ]"
-      @pointerdown="onInAnchorDown"
-    ></div> -->
-
     <div class="xg-slider-block">
       <!-- 滑块主体 -->
       <slot
@@ -74,7 +63,9 @@
       </div>
     </div>
 
+    <!-- 创建连线的按钮 -->
     <div
+      v-if="props.allowLink"
       ref="outAnchorRef"
       :class="[
         'xg-slider-anchor',
@@ -270,12 +261,6 @@ onDrag(resizeRightRef, {
 });
 // #endregion
 
-// #region inAnchor
-// function onInAnchorDown() {
-//   handleDisableMove();
-// }
-// #endregion
-
 // #region outAnchor
 function onOutAnchorDown(e: PointerEvent) {
   handleDisableMove();
@@ -288,6 +273,7 @@ const outAnchorRef = ref(null) as Ref<HTMLElement | null>;
 const startPos = { x: 0, y: 0 };
 onDrag(outAnchorRef, {
   reset: true,
+  disabled: () => !outAnchorRef.value && !props.allowLink,
 
   onStart: pos => {
     startPos.x = (ganttBodyRef.value?.getBoundingClientRect().x ?? 0) - pos.x;
@@ -316,6 +302,8 @@ onDrag(outAnchorRef, {
 
 const { EmitAddLink } = useEvent();
 function onPointerUp() {
+  if (!props.allowLink) return;
+
   if (linking.startRow) {
     const link = $links.addLink(linking.startRow, props.data!);
     if (link) EmitAddLink(link);

diff --git a/src/components/slider/props.ts b/src/components/slider/props.ts
@@ -1,5 +1,6 @@
 import Variables from '@/constants/vars';
 import RowItem from '@/models/data/row';
+import { type RowData } from '@/typings/data';
 import { type PropType } from 'vue';
 
 export default {
@@ -88,6 +89,14 @@ export default {
     type: Boolean
   },
 
+  /**
+   * 允许创建、修改连线。如果设置为 false，不会影响已有连线的展示
+   */
+  allowLink: {
+    type: Boolean,
+    default: true
+  },
+
   /**
    * 空值内容
    */