Enable zoom and dragging when shapes are not present

wbbaker · Mar 28, 2023 · f8c3210 · f8c3210
1 parent 3954fa0
commit f8c3210
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 16 deletions.
diff --git a/src/components/Gallery/GalleryMainImage.vue b/src/components/Gallery/GalleryMainImage.vue
@@ -12,7 +12,6 @@
 
 <script setup>
 import { ref, onMounted, onUnmounted, watch } from 'vue'
-import VSpinnerGlobal from '../VSpinner.global.vue'
 
 const props = defineProps({
   image: {

diff --git a/src/components/Map/VMap.global.vue b/src/components/Map/VMap.global.vue
@@ -235,7 +235,8 @@ function setGeoJSON(geojson) {
   if (geojson) {
     L.geoJSON(geojson, {
       ...geojsonDefaultOptions,
-      ...props.geojsonOptions
+      ...props.geojsonOptions,
+      pmIgnore: true
     }).addTo(geoJSONGroup)
 
     const bounds = geoJSONGroup.getBounds()

diff --git a/src/components/Table/VTable.global.vue b/src/components/Table/VTable.global.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="shadow-md relative sm:rounded-lg">
+  <div class="relative sm:rounded-lg">
     <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
       <slot />
     </table>

diff --git a/src/modules/otus/components/Panel/PanelMap/PanelMap.vue b/src/modules/otus/components/Panel/PanelMap/PanelMap.vue
@@ -8,7 +8,7 @@
         dragging
         :zoom="zoom"
         :geojson="geojson"
-        @geojson:ready="isLoading = false"
+        @geojson:ready="() => (isLoading = false)"
       />
 
       <VButton
@@ -51,7 +51,6 @@
 </template>
 
 <script setup>
-import { Georeference } from '@/components/Map/icons'
 import { ref, watch } from 'vue'
 import TaxonWorks from '../../../services/TaxonWorks'
 import OtuSearch from '../../Search/OtuSearch.vue'

diff --git a/src/modules/otus/components/Search/ListResults.vue b/src/modules/otus/components/Search/ListResults.vue
@@ -1,13 +1,16 @@
 <template>
-  <VTable v-if="list.length">
+  <VTable
+    v-if="list.length"
+    class="shadow-md"
+  >
     <VTableHeader>
       <VTableHeaderRow>
         <VTableHeaderCell
           class="w-full flex justify-between box-border items-center"
         >
           <span>OTU</span>
-          <IconClose
-            class="opacity-30 cursor-pointer"
+          <IconArrowRight
+            class="opacity-50 cursor-pointer w-4 h-4"
             @click="emit('close:table')"
           />
         </VTableHeaderCell>

diff --git a/src/modules/otus/components/Search/OtuSearch.vue b/src/modules/otus/components/Search/OtuSearch.vue
@@ -14,7 +14,8 @@
         ref="mapRef"
         class="w-screen h-screen"
         controls
-        disable-zoom
+        :dragging="!shapes"
+        :disable-zoom="!!shapes"
         :zoom-bounds="6"
         :geojson="shapes"
         @draw:start="() => (geojson = {})"
@@ -44,7 +45,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, onUnmounted, watch } from 'vue'
+import { ref, onMounted, onUnmounted } from 'vue'
 import { makeAPIRequest } from '@/utils/request'
 import SearchBar from './SearchBar.vue'
 import ListResults from './ListResults.vue'
@@ -57,7 +58,7 @@ const props = defineProps({
 
   shapes: {
     type: Object,
-    default: () => ({})
+    default: undefined
   }
 })
 

diff --git a/src/modules/otus/views/Index.vue b/src/modules/otus/views/Index.vue
@@ -56,10 +56,6 @@
       </div>
     </div>
   </div>
-  <OtuSearch
-    v-if="isOtuSearchVisible"
-    @close="() => (isOtuSearchVisible = false)"
-  />
 </template>
 
 <script setup>
@@ -74,7 +70,6 @@ const route = useRoute()
 const router = useRouter()
 const routeParams = ref(route.params)
 const tabs = [] // useChildrenRoutes()
-const isOtuSearchVisible = ref(false)
 
 router.afterEach((route) => {
   routeParams.value = route.params