mirror of
https://gitee.com/hhyykk/ipms-sjy-ui.git
synced 2025-07-14 02:45:06 +08:00
1、微信组件更新vue3,部分功能可能还有问题。
This commit is contained in:
72
src/views/mp/components/wx-location/main.vue
Normal file
72
src/views/mp/components/wx-location/main.vue
Normal file
@ -0,0 +1,72 @@
|
||||
<!--
|
||||
【微信消息 - 定位】
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<el-link
|
||||
type="primary"
|
||||
target="_blank"
|
||||
:href="
|
||||
'https://map.qq.com/?type=marker&isopeninfowin=1&markertype=1&pointx=' +
|
||||
locationY +
|
||||
'&pointy=' +
|
||||
locationX +
|
||||
'&name=' +
|
||||
label +
|
||||
'&ref=yudao'
|
||||
"
|
||||
>
|
||||
<el-col>
|
||||
<el-row>
|
||||
<img
|
||||
:src="
|
||||
'https://apis.map.qq.com/ws/staticmap/v2/?zoom=10&markers=color:blue|label:A|' +
|
||||
locationX +
|
||||
',' +
|
||||
locationY +
|
||||
'&key=' +
|
||||
qqMapKey +
|
||||
'&size=250*180'
|
||||
"
|
||||
/>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-icon><Location /></el-icon>{{ label }}
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="WxLocation">
|
||||
import { Location } from '@element-plus/icons-vue'
|
||||
|
||||
const props = defineProps({
|
||||
locationX: {
|
||||
required: true,
|
||||
type: Number
|
||||
},
|
||||
locationY: {
|
||||
required: true,
|
||||
type: Number
|
||||
},
|
||||
label: {
|
||||
// 地名
|
||||
required: true,
|
||||
type: String
|
||||
},
|
||||
qqMapKey: {
|
||||
// QQ 地图的密钥 https://lbs.qq.com/service/staticV2/staticGuide/staticDoc
|
||||
required: false,
|
||||
type: String,
|
||||
default: 'TVDBZ-TDILD-4ON4B-PFDZA-RNLKH-VVF6E' // 需要自定义
|
||||
}
|
||||
})
|
||||
|
||||
defineExpose({
|
||||
locationX: props.locationX,
|
||||
locationY: props.locationY,
|
||||
label: props.label,
|
||||
qqMapKey: props.qqMapKey
|
||||
})
|
||||
</script>
|
Reference in New Issue
Block a user