@zhangqingcq/vgce 0.1.19 → 0.1.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zhangqingcq/vgce",
-  "version": "0.1.19",
+  "version": "0.1.20",
   "description": "Vector graphics configure editor. svg组态编辑器。基于vue3.3+ts+element-plus+vite",
   "publishConfig": {
     "access": "public"

package/src/components/svg-editor/center-panel.vue

@@ -287,6 +287,7 @@
 			}
 		}
 	}
+
 	const onSvgMouseEnter = (select_item: IDoneJson, index: number, e: MouseEvent) => {
 		e.preventDefault()
 		e.stopPropagation()
@@ -613,6 +614,7 @@
 			}
 		}
 	}
+
 	const onCanvasMouseUp = () => {
 		//如果鼠标不是按下状态
 		if (globalStore.mouse_info.state != EMouseInfoState.Down) {
@@ -666,7 +668,11 @@
 			globalStore.setHandleSvgInfo(null)
 			for (let e of globalStore.done_json) {
 				const t = selectRect.value
-				e.selected = e.x > t.x && e.x < t.x + t.with && e.y > t.y && e.y < t.y + t.height
+				e.selected =
+					e.center_position.x > t.x &&
+					e.center_position.x < t.x + t.with &&
+					e.center_position.y > t.y &&
+					e.center_position.y < t.y + t.height
 			}
 			globalStore.intention = EGlobalStoreIntention.None
 		} else if (globalStore.intention != EGlobalStoreIntention.Select) {
@@ -683,6 +689,7 @@
 		}
 		contextMenuStore.display = false
 	}
+
 	const onCanvasMouseDown = (e: MouseEvent) => {
 		const { clientX, clientY } = e
 		if (globalStore.intention === EGlobalStoreIntention.Connection) {
@@ -765,6 +772,32 @@
 		}
 	}
 
+	const onLineMouseDown = (e: Record<string, any>) => {
+		if (globalStore.intention === EGlobalStoreIntention.Connection && globalStore.handle_svg_info) {
+			if (e.button === 0) {
+				//鼠标左键创建新线段
+				if (globalStore.handle_svg_info.info.props.point_position.val.length !== 2) {
+					//鼠标移动后的实时位置（相对于起始点，只在创建第一个点时记录了鼠标原始位置）
+					globalStore.handle_svg_info.info.props.point_position.val.push({
+						x:
+							globalStore.mouse_info.new_position_x -
+							globalStore.mouse_info.position_x -
+							svgEditLayoutStore.center_offset.x,
+						y:
+							globalStore.mouse_info.new_position_y -
+							globalStore.mouse_info.position_y -
+							svgEditLayoutStore.center_offset.y
+					})
+				}
+			} else if (e.button === 2) {
+				//鼠标右键结束线段绘制
+				globalStore.intention = EGlobalStoreIntention.None
+				setSvgActualInfo(globalStore.done_json[globalStore.handle_svg_info.index])
+				globalStore.setHandleSvgInfo(null)
+			}
+		}
+	}
+
 	function onMousewheel(e: any) {
 		if (e?.wheelDelta) {
 			if (e.wheelDelta > 0) {
@@ -1003,6 +1036,7 @@
 									v-if="item.type === EDoneJsonType.ConnectionLine"
 									:item-info="item"
 									:point-visible="visible_info.connection_line && visible_info.select_item.info?.id == item.id"
+									@mousedown="onLineMouseDown"
 								/>
 								<use
 									v-else-if="item.type === EDoneJsonType.File"

package/src/components/svg-editor/top-panel.vue

@@ -157,7 +157,7 @@
 		<el-scrollbar max-height="60vh">
 			<div class="font-bold mb-10px text-15px guide-title" style="padding-top: 16px">多选</div>
 			<div
-				>在画布空白区域按住鼠标左键可以框选（图形坐标在框选区域即判定被选中），也可以按住ctrl+鼠标左键点图形进行多选</div
+				>在画布空白区域按住鼠标左键可以框选（图形中心点在框选区域即判定被选中），也可以按住ctrl+鼠标左键点图形进行多选</div
 			>
 			<div class="el-divider el-divider--horizontal" role="separator" style="--el-border-style: solid"></div>
 			<div class="font-bold mb-10px text-15px guide-title">拖动画布</div>

package/src/config/svg/animation/thermometer.ts

@@ -6,7 +6,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.File,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/svg/custom/clock-a.ts

@@ -8,7 +8,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.CustomSvg,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/svg/custom/light.ts

@@ -8,7 +8,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.CustomSvg,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/svg/custom/svg-text.ts

@@ -9,7 +9,7 @@ const t: IConfigItem = {
 	display: true,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	props: {

package/src/config/svg/custom/switch-r.ts

@@ -9,7 +9,7 @@ const t: IConfigItem = {
 	display: true,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	props: {

package/src/config/svg/stateful/alert-light.ts

@@ -7,7 +7,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.File,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/vue/component/button.ts

@@ -8,7 +8,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.Vue,
 	config: {
 		can_zoom: false,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/vue/component/common-table.ts

@@ -8,7 +8,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.Vue,
 	config: {
 		can_zoom: false,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/vue/component/progress.ts

@@ -8,7 +8,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.Vue,
 	config: {
 		can_zoom: false,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/vue/component/tag.ts

@@ -8,7 +8,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.Vue,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,

package/src/config/vue/echarts/pie-charts.ts

@@ -8,7 +8,7 @@ const t: IConfigItem = {
 	type: EDoneJsonType.Vue,
 	config: {
 		can_zoom: true,
-		have_anchor: true,
+		have_anchor: false,
 		actual_rect: true
 	},
 	display: true,