minnan/src/pages/article/data/CommonCategoryDetailContentBlocks.vue

<template>
  <template v-if="define.type === 'map'">
    <!-- 地理位置单元 -->
    <view class="d-flex flex-col mt-3 mb-2">
      <map id="map"
        class="w-100 height-350 mt-3"
        :latitude="content.latitude"
        :longitude="content.longitude"
        :markers="[
          {
            id: 1,
            latitude: content.latitude,
            longitude: content.longitude,
            iconPath: ImagesUrls.IconMarker,
            width: 40,
            height: 40,
          }
        ]"
        :scale="15"
      />
      <view class="d-flex flex-row justify-between bg-light radius-base p-2 mt-2">
        <view>
          <text class="iconfont icon-navigation"></text>
          <text class="address">{{ content.address }}</text>
        </view>
        <view class="d-flex flex-row align-center flex-shrink-0" @click="handleNavTo(content)">
          <text class="color-orange">去这里</text>
          <text class="iconfont icon-arrow-right"></text>
        </view>
      </view>
    </view>
  </template>
</template>

<script setup lang="ts">
import { type PropType } from 'vue';
import type { RenderTabDefine } from './CommonCategoryDetail.vue';
import ImagesUrls from '@/common/config/ImagesUrls';

defineProps({
  define: {
    type: Object as PropType<RenderTabDefine>,
    default: () => [],
  },
  content: {
    type: null,
    default: () => ({}),
  },
})

function handleNavTo(content: any) {
  if (!content?.latitude || !content?.longitude) 
    return;
  uni.openLocation({
    latitude: Number(content.latitude),  
    longitude: Number(content.longitude),  
  }) 
}
</script>