添加新的需求

2025-10-20 17:32:09 +08:00
parent 9979e00b47
commit 361d5ab1ae
247 changed files with 34249 additions and 1 deletions
--- a/pc-cattle-transportation/src/views/hardware/locationDialog.vue
+++ b/pc-cattle-transportation/src/views/hardware/locationDialog.vue
@@ -0,0 +1,103 @@
+<template>
+    <el-dialog title="查看定位" v-model="data.dialogVisible" :before-close="handleClose" style="width: 700px; padding-bottom: 20px">
+        <div
+            v-loading="data.loactionLoading"
+            element-loading-text="正在加载中..."
+            element-loading-background="rgba(255, 255, 255,1)"
+            style="height: 500px"
+        >
+            <div class="empty-box" v-if="data.loactionStatus">
+                <img style="width: 50%" src="../../assets/images/wudingwei.png" />
+            </div>
+            <baidu-map style="height: 500px" class="map" :zoom="15" :center="data.center" :scroll-wheel-zoom="true" v-if="data.mapShow">
+                <bm-map-type :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']"></bm-map-type>
+                <bm-marker :position="data.center" :dragging="true" animation="BMAP_ANIMATION_BOUNCE">
+                    <bm-label
+                        :content="data.time"
+                        :labelStyle="{
+                            color: '#67c23a',
+                            fontSize: '12px',
+                            borderColor: '#fff',
+                            borderRadius: 10,
+                        }"
+                        :offset="{ width: -96, height: 10 }"
+                    />
+                </bm-marker>
+            </baidu-map>
+        </div>
+        <template #footer>
+            <div class="dialog-footer">
+                <el-button @click="handleClose">取消</el-button>
+            </div>
+        </template>
+    </el-dialog>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from 'vue';
+import { collarLocation } from '~/api/hardware.js';
+
+const data = reactive({
+    dialogVisible: false,
+    loactionLoading: false,
+    loactionStatus: false,
+    mapShow: false,
+    center: { lng: 0, lat: 0 },
+    time: '',
+    deliveryId: '',
+    xqDeviceId: '',
+});
+// 查询定位
+const getLocation = () => {
+    data.loactionLoading = true;
+    collarLocation({
+        deliveryId: data.deliveryId,
+        xqDeviceId: data.xqDeviceId,
+    })
+        .then((res) => {
+            data.loactionLoading = false;
+            if (res.code === 200) {
+                data.mapShow = true;
+                data.center.lng = res.data.longitude;
+                data.center.lat = res.data.latitude;
+                data.time = `最后定位时间：${res.data.updateTime}`;
+            } else {
+                ElMessage.error(res.msg);
+                data.loactionStatus = true;
+            }
+        })
+        .catch(() => {
+            data.loactionLoading = false;
+            data.loactionStatus = true;
+        });
+};
+const handleClose = () => {
+    data.dialogVisible = false;
+};
+const onShowLocationDialog = (row) => {
+    data.dialogVisible = true;
+    if (row) {
+        data.deliveryId = row.deliveryId;
+        data.xqDeviceId = row.deviceId;
+        data.mapShow = false;
+        data.loactionStatus = false;
+        getLocation();
+    }
+};
+defineExpose({
+    onShowLocationDialog,
+});
+</script>
+
+<style lang="less" scoped>
+::v-deep .anchorBL {
+    display: none;
+    visibility: hidden;
+}
+.empty-box {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 500px;
+}
+</style>