diff --git a/hwe/ts/components/MapCityBasic.vue b/hwe/ts/components/MapCityBasic.vue index e7182383..ce0ccc39 100644 --- a/hwe/ts/components/MapCityBasic.vue +++ b/hwe/ts/components/MapCityBasic.vue @@ -15,6 +15,8 @@ cursor: city.clickable ? 'pointer' : 'default', }" @click="clicked" + @touchstart="touchstart" + @touchmove="touchmove" @touchend="touchend" @mouseenter="mouseenter" @mouseleave="mouseleave" @@ -43,6 +45,7 @@ const emit = defineEmits<{ (event: "click", evnet: MouseEvent | TouchEvent): void; (event: "mouseenter", e: MouseEvent): void; (event: "mouseleave", e: MouseEvent): void; + (event: "touchleave", e: TouchEvent): void; }>(); const props = defineProps({ city: { @@ -117,11 +120,25 @@ function mouseleave(event: MouseEvent) { emit("mouseleave", event); } -function touchend(event: TouchEvent) { - event.stopPropagation(); - emit("click", event); +let touchOnTrack = false; + +function touchstart() { + touchOnTrack = true; } +function touchmove() { + touchOnTrack = false; +} + +function touchend(event: TouchEvent) { + if (touchOnTrack) { + event.stopPropagation(); + emit("click", event); + } + else{ + emit("touchleave", event); + } +} function silent(event: MouseEvent) { event.stopPropagation(); } diff --git a/hwe/ts/components/MapCityDetail.vue b/hwe/ts/components/MapCityDetail.vue index d175db28..dd8158fa 100644 --- a/hwe/ts/components/MapCityDetail.vue +++ b/hwe/ts/components/MapCityDetail.vue @@ -23,6 +23,8 @@ cursor: city.clickable ? 'pointer' : 'default', }" @click="clicked" + @touchstart="touchstart" + @touchmove="touchmove" @touchend="touchend" @mouseenter="mouseenter" @mouseleave="mouseleave" @@ -54,6 +56,7 @@ const emit = defineEmits<{ (event: "click", e: MouseEvent | TouchEvent): void; (event: "mouseenter", e: MouseEvent): void; (event: "mouseleave", e: MouseEvent): void; + (event: "touchleave", e: TouchEvent): void; }>(); const props = defineProps({ city: { @@ -119,9 +122,24 @@ function mouseleave(event: MouseEvent) { emit("mouseleave", event); } +let touchOnTrack = false; + +function touchstart() { + touchOnTrack = true; +} + +function touchmove() { + touchOnTrack = false; +} + function touchend(event: TouchEvent) { - event.stopPropagation(); - emit("click", event); + if (touchOnTrack) { + event.stopPropagation(); + emit("click", event); + } + else{ + emit("touchleave", event); + } } function silent(event: MouseEvent) { @@ -130,7 +148,7 @@ function silent(event: MouseEvent) {