|
@@ -0,0 +1,123 @@
|
|
|
|
+<template>
|
|
|
|
+ <div class="trafficLocation">
|
|
|
|
+ <van-nav-bar :title="title" />
|
|
|
|
+ <van-cell
|
|
|
|
+ @click="openMap"
|
|
|
|
+ v-for="item in che_list"
|
|
|
|
+ :key="item.title"
|
|
|
|
+ :title="item.title"
|
|
|
|
+ is-link
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+<script setup>
|
|
|
|
+import { ref } from 'vue';
|
|
|
|
+// import { onMounted, reactive } from "vue";
|
|
|
|
+// import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
|
|
|
|
+/**
|
|
|
|
+ * window.$originData.orginParames.title 页面标题
|
|
|
|
+ * window.$originData.orginParames.parameters 固定参数值
|
|
|
|
+ * window.$originData.urlParames url参数
|
|
|
|
+ */
|
|
|
|
+console.log(window.$originData);
|
|
|
|
+const title = ref(window.$originData.orginParames.title);
|
|
|
|
+
|
|
|
|
+const che_list = ref([
|
|
|
|
+ {
|
|
|
|
+ title: '西安市车辆管理所(东区分所)',
|
|
|
|
+ address: '陕西省西安市灞桥区东三环通塬路与金茂四路交汇处',
|
|
|
|
+ latitude: 34.300806,
|
|
|
|
+ longitude: 109.054953,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市公安局交通警察支队车辆管理所南区分所',
|
|
|
|
+ address: '陕西省西安市雁塔区雁环路西姜欣居8号楼',
|
|
|
|
+ latitude: 34.183556,
|
|
|
|
+ longitude: 108.92422,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市车辆管理所郊县分所',
|
|
|
|
+ address: '陕西省西安市未央区西部车城',
|
|
|
|
+ latitude: 34.290967,
|
|
|
|
+ longitude: 108.813974,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市公安局交警支队车管所郊县分所',
|
|
|
|
+ address: '陕西省西安市未央区天台八路4号',
|
|
|
|
+ latitude: 34.291088,
|
|
|
|
+ longitude: 108.814097,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市公安局交通警察支队车辆管理所',
|
|
|
|
+ address: '陕西省西安市雁塔区郭杜街道郭杜北街49号',
|
|
|
|
+ latitude: 34.172279,
|
|
|
|
+ longitude: 108.881202,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市公安局交警支队车辆管理所(长安分所)',
|
|
|
|
+ address: '陕西省西安市长安区新希望产业有限公司旁(樊川路北)',
|
|
|
|
+ latitude: 34.129907,
|
|
|
|
+ longitude: 108.977174,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市公安局高陵分局交通警察大队车辆管理所',
|
|
|
|
+ address: '陕西省西安市高陵区高交路',
|
|
|
|
+ latitude: 34.54072,
|
|
|
|
+ longitude: 109.098794,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市公安局交警支队车辆管理所西区分所',
|
|
|
|
+ address: '陕西省西安市长安区西户路中段8号公诚二手车交易市场内',
|
|
|
|
+ latitude: 34.254005,
|
|
|
|
+ longitude: 108.790577,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '陕西省公安厅交通警察总队车辆管理所',
|
|
|
|
+ address: '陕西省西安市雁塔区长安南路123号',
|
|
|
|
+ latitude: 34.190806,
|
|
|
|
+ longitude: 108.948015,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '西安市公安局鄠邑分局交通警察大队车辆管理所',
|
|
|
|
+ address: '陕西省西安市鄠邑区庞光镇汽车客运站西邻',
|
|
|
|
+ latitude: 34.034764,
|
|
|
|
+ longitude: 108.673277,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ title: '周至县公安局交通警察大队车辆管理所',
|
|
|
|
+ address: '陕西省西安市周至县万联锦绣城7号楼',
|
|
|
|
+ latitude: 34.168437,
|
|
|
|
+ longitude: 108.204525,
|
|
|
|
+ },
|
|
|
|
+]);
|
|
|
|
+
|
|
|
|
+function openMap(item) {
|
|
|
|
+ if (!window.wx) return;
|
|
|
|
+ window.wx.checkJsApi({
|
|
|
|
+ jsApiList: ['getLocation', 'openLocation'],
|
|
|
|
+ success: () => {
|
|
|
|
+ window.wx.getLocation({
|
|
|
|
+ type: 'wgs84', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'
|
|
|
|
+ success: function (loc) {
|
|
|
|
+ console.log(loc);
|
|
|
|
+ //打开指定位置
|
|
|
|
+ window.wx.openLocation({
|
|
|
|
+ latitude: loc.latitude, // 纬度,浮点数,范围为90 ~ -90
|
|
|
|
+ longitude: loc.longitude, // 经度,浮点数,范围为180 ~ -180。
|
|
|
|
+ name: item.name, // 位置名
|
|
|
|
+ address: item.address, // 地址详情说明
|
|
|
|
+ scale: 18, // 地图缩放级别,整型值,范围从1~28。默认为最大
|
|
|
|
+ infoUrl: '', // 在查看位置界面底部显示的超链接,可点击跳转
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ });
|
|
|
|
+}
|
|
|
|
+</script>
|
|
|
|
+<style>
|
|
|
|
+.trafficLocation {
|
|
|
|
+ width: 100vw;
|
|
|
|
+ height: 100vh;
|
|
|
|
+}
|
|
|
|
+</style>
|