位置信息

src/views/GoodsInfoManageView.vue

@@ -44,6 +44,43 @@ const formatDate = (date) => {
   return useDateFormat(new Date(date), 'YYYY-MM-DD HH:mm:ss').value
 }
 
+// 格式化位置信息
+const formatLocation = (location) => {
+  if (!location) return '-'
+  
+  // 如果是字符串格式（如 "39.9042,116.4074"）
+  if (typeof location === 'string') {
+    return location
+  }
+  
+  // 如果是对象格式（如 { latitude: 39.9042, longitude: 116.4074 }）
+  if (typeof location === 'object' && location.latitude && location.longitude) {
+    return `${location.latitude}, ${location.longitude}`
+  }
+  
+  return '-'
+}
+
+// 获取位置坐标用于地图链接
+const getLocationCoords = (location) => {
+  if (!location) return null
+  
+  // 如果是字符串格式（如 "39.9042,116.4074"）
+  if (typeof location === 'string') {
+    const coords = location.split(',')
+    if (coords.length === 2) {
+      return { lat: coords[0].trim(), lng: coords[1].trim() }
+    }
+  }
+  
+  // 如果是对象格式
+  if (typeof location === 'object' && location.latitude && location.longitude) {
+    return { lat: location.latitude, lng: location.longitude }
+  }
+  
+  return null
+}
+
 // 获取数据
 const fetchData = async () => {
   try {
@@ -290,6 +327,18 @@ onMounted(() => {
           <span class="whitespace-pre-line break-words">{{ resolveRemark(slotProps.data) || '-' }}</span>
         </template>
       </Column>
+      <Column field="location" header="位置信息" style="min-width: 180px">
+        <template #body="slotProps">
+          <div v-if="getLocationCoords(slotProps.data.location)" class="flex items-center gap-2">
+            <a :href="`https://www.google.com/maps?q=${getLocationCoords(slotProps.data.location).lat},${getLocationCoords(slotProps.data.location).lng}`"
+              target="_blank" class="text-blue-600 hover:underline flex items-center gap-1 text-sm">
+              <i class="pi pi-map-marker"></i>
+              <span>{{ formatLocation(slotProps.data.location) }}</span>
+            </a>
+          </div>
+          <span v-else class="text-gray-400 text-sm">{{ formatLocation(slotProps.data.location) }}</span>
+        </template>
+      </Column>
       <Column field="createdAt" header="创建时间" style="min-width: 180px">
         <template #body="slotProps">
           {{ formatDate(slotProps.data.createdAt) }}
@@ -420,6 +469,17 @@ onMounted(() => {
               <div class="text-sm text-gray-500">备注</div>
               <div class="whitespace-pre-wrap">{{ resolveRemark(selectedGoods) }}</div>
             </div>
+            <div v-if="selectedGoods.location" class="col-span-2">
+              <div class="text-sm text-gray-500">位置信息</div>
+              <div v-if="getLocationCoords(selectedGoods.location)">
+                <a :href="`https://www.google.com/maps?q=${getLocationCoords(selectedGoods.location).lat},${getLocationCoords(selectedGoods.location).lng}`"
+                  target="_blank" class="text-blue-600 hover:underline flex items-center gap-1">
+                  <i class="pi pi-map-marker"></i>
+                  <span>{{ formatLocation(selectedGoods.location) }}</span>
+                </a>
+              </div>
+              <div v-else class="text-gray-400">{{ formatLocation(selectedGoods.location) }}</div>
+            </div>
           </div>
         </div>
 

src/views/PersonInfoManageView.vue

@@ -64,6 +64,43 @@ const formatDate = (date) => {
   return useDateFormat(new Date(date), 'YYYY-MM-DD HH:mm:ss').value
 }
 
+// 格式化位置信息
+const formatLocation = (location) => {
+  if (!location) return '-'
+  
+  // 如果是字符串格式（如 "39.9042,116.4074"）
+  if (typeof location === 'string') {
+    return location
+  }
+  
+  // 如果是对象格式（如 { latitude: 39.9042, longitude: 116.4074 }）
+  if (typeof location === 'object' && location.latitude && location.longitude) {
+    return `${location.latitude}, ${location.longitude}`
+  }
+  
+  return '-'
+}
+
+// 获取位置坐标用于地图链接
+const getLocationCoords = (location) => {
+  if (!location) return null
+  
+  // 如果是字符串格式（如 "39.9042,116.4074"）
+  if (typeof location === 'string') {
+    const coords = location.split(',')
+    if (coords.length === 2) {
+      return { lat: coords[0].trim(), lng: coords[1].trim() }
+    }
+  }
+  
+  // 如果是对象格式
+  if (typeof location === 'object' && location.latitude && location.longitude) {
+    return { lat: location.latitude, lng: location.longitude }
+  }
+  
+  return null
+}
+
 // 获取数据
 const fetchData = async () => {
   try {
@@ -338,6 +375,18 @@ onMounted(() => {
           <span class="whitespace-pre-line break-words">{{ resolveRemark(slotProps.data) || '-' }}</span>
         </template>
       </Column>
+      <Column field="location" header="位置信息" style="min-width: 180px">
+        <template #body="slotProps">
+          <div v-if="getLocationCoords(slotProps.data.location)" class="flex items-center gap-2">
+            <a :href="`https://www.google.com/maps?q=${getLocationCoords(slotProps.data.location).lat},${getLocationCoords(slotProps.data.location).lng}`"
+              target="_blank" class="text-blue-600 hover:underline flex items-center gap-1 text-sm">
+              <i class="pi pi-map-marker"></i>
+              <span>{{ formatLocation(slotProps.data.location) }}</span>
+            </a>
+          </div>
+          <span v-else class="text-gray-400 text-sm">{{ formatLocation(slotProps.data.location) }}</span>
+        </template>
+      </Column>
       <Column field="createdAt" header="创建时间" style="min-width: 180px">
         <template #body="slotProps">
           {{ formatDate(slotProps.data.createdAt) }}
@@ -509,6 +558,17 @@ onMounted(() => {
               <div class="text-sm text-gray-500">备注</div>
               <div class="whitespace-pre-wrap">{{ resolveRemark(selectedPerson) }}</div>
             </div>
+            <div v-if="selectedPerson.location" class="col-span-2">
+              <div class="text-sm text-gray-500">位置信息</div>
+              <div v-if="getLocationCoords(selectedPerson.location)">
+                <a :href="`https://www.google.com/maps?q=${getLocationCoords(selectedPerson.location).lat},${getLocationCoords(selectedPerson.location).lng}`"
+                  target="_blank" class="text-blue-600 hover:underline flex items-center gap-1">
+                  <i class="pi pi-map-marker"></i>
+                  <span>{{ formatLocation(selectedPerson.location) }}</span>
+                </a>
+              </div>
+              <div v-else class="text-gray-400">{{ formatLocation(selectedPerson.location) }}</div>
+            </div>
           </div>
         </div>
 

src/views/PetInfoManageView.vue

@@ -43,6 +43,43 @@ const formatDate = (date) => {
   return useDateFormat(new Date(date), 'YYYY-MM-DD HH:mm:ss').value
 }
 
+// 格式化位置信息
+const formatLocation = (location) => {
+  if (!location) return '-'
+  
+  // 如果是字符串格式（如 "39.9042,116.4074"）
+  if (typeof location === 'string') {
+    return location
+  }
+  
+  // 如果是对象格式（如 { latitude: 39.9042, longitude: 116.4074 }）
+  if (typeof location === 'object' && location.latitude && location.longitude) {
+    return `${location.latitude}, ${location.longitude}`
+  }
+  
+  return '-'
+}
+
+// 获取位置坐标用于地图链接
+const getLocationCoords = (location) => {
+  if (!location) return null
+  
+  // 如果是字符串格式（如 "39.9042,116.4074"）
+  if (typeof location === 'string') {
+    const coords = location.split(',')
+    if (coords.length === 2) {
+      return { lat: coords[0].trim(), lng: coords[1].trim() }
+    }
+  }
+  
+  // 如果是对象格式
+  if (typeof location === 'object' && location.latitude && location.longitude) {
+    return { lat: location.latitude, lng: location.longitude }
+  }
+  
+  return null
+}
+
 // 获取数据
 const fetchData = async () => {
   try {
@@ -286,6 +323,18 @@ onMounted(() => {
           <span class="whitespace-pre-line break-words">{{ resolveRemark(slotProps.data) || '-' }}</span>
         </template>
       </Column>
+      <Column field="location" header="位置信息" style="min-width: 180px">
+        <template #body="slotProps">
+          <div v-if="getLocationCoords(slotProps.data.location)" class="flex items-center gap-2">
+            <a :href="`https://www.google.com/maps?q=${getLocationCoords(slotProps.data.location).lat},${getLocationCoords(slotProps.data.location).lng}`"
+              target="_blank" class="text-blue-600 hover:underline flex items-center gap-1 text-sm">
+              <i class="pi pi-map-marker"></i>
+              <span>{{ formatLocation(slotProps.data.location) }}</span>
+            </a>
+          </div>
+          <span v-else class="text-gray-400 text-sm">{{ formatLocation(slotProps.data.location) }}</span>
+        </template>
+      </Column>
       <Column field="createdAt" header="创建时间" style="min-width: 180px">
         <template #body="slotProps">
           {{ formatDate(slotProps.data.createdAt) }}
@@ -417,6 +466,17 @@ onMounted(() => {
               <div class="text-sm text-gray-500">备注</div>
               <div class="whitespace-pre-wrap">{{ resolveRemark(selectedPet) }}</div>
             </div>
+            <div v-if="selectedPet.location" class="col-span-2">
+              <div class="text-sm text-gray-500">位置信息</div>
+              <div v-if="getLocationCoords(selectedPet.location)">
+                <a :href="`https://www.google.com/maps?q=${getLocationCoords(selectedPet.location).lat},${getLocationCoords(selectedPet.location).lng}`"
+                  target="_blank" class="text-blue-600 hover:underline flex items-center gap-1">
+                  <i class="pi pi-map-marker"></i>
+                  <span>{{ formatLocation(selectedPet.location) }}</span>
+                </a>
+              </div>
+              <div v-else class="text-gray-400">{{ formatLocation(selectedPet.location) }}</div>
+            </div>
           </div>
         </div>