Skip to content
项目
群组
代码片段
帮助
正在加载...
帮助
提交反馈
为 GitLab 提交贡献
登录
切换导航
iBiz-Vue-Mob-R7-Res
项目
项目
详情
动态
版本
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
计划
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
统计图
创建新议题
作业
提交
议题看板
打开侧边栏
iBiz-R7前端标准模板
iBiz-Vue-Mob-R7-Res
提交
1ed7b056
提交
1ed7b056
编写于
10月 27, 2021
作者:
Shine-zwj
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update:更新优化地图组件
上级
6824ac63
变更
1
隐藏空白字符变更
内嵌
并排
正在显示
1 个修改的文件
包含
52 行增加
和
45 行删除
+52
-45
app-mob-map-page.vue
src/components/app-mob-map-page/app-mob-map-page.vue
+52
-45
未找到文件。
src/components/app-mob-map-page/app-mob-map-page.vue
浏览文件 @
1ed7b056
...
@@ -124,6 +124,14 @@ export default class AppMobMapPage extends Vue {
...
@@ -124,6 +124,14 @@ export default class AppMobMapPage extends Vue {
*/
*/
public
win
:
any
;
public
win
:
any
;
/**
* 搜索服务
*
* @type {*}
* @memberof AppMobMapPage
*/
public
placeSearch
:
any
;
/**
/**
* 地图配置
* 地图配置
*
*
...
@@ -156,19 +164,19 @@ export default class AppMobMapPage extends Vue {
...
@@ -156,19 +164,19 @@ export default class AppMobMapPage extends Vue {
* @memberof AppMobMapPage
* @memberof AppMobMapPage
*/
*/
initCurAddress
(
o
:
any
)
{
initCurAddress
(
o
:
any
)
{
if
(
!
this
.
marker
.
visible
)
{
o
.
getCurrentPosition
((
status
:
any
,
result
:
any
)
=>
{
if
(
this
.
address
)
{
if
(
result
&&
result
.
status
!=
0
)
{
this
.
handleSearch
();
if
(
!
this
.
marker
.
visible
)
{
}
else
{
if
(
this
.
address
)
{
o
.
getCurrentPosition
((
status
:
any
,
result
:
any
)
=>
{
this
.
handleSearch
();
if
(
result
&&
result
.
status
!=
0
)
{
}
else
{
const
position
=
[
result
.
position
.
lng
,
result
.
position
.
lat
];
const
position
=
[
result
.
position
.
lng
,
result
.
position
.
lat
];
this
.
address
=
result
.
formattedAddress
;
this
.
address
=
result
.
formattedAddress
;
Object
.
assign
(
this
.
marker
,
{
position
:
position
,
address
:
this
.
address
,
visible
:
true
});
Object
.
assign
(
this
.
marker
,
{
position
:
position
,
address
:
this
.
address
,
visible
:
true
});
}
}
});
}
}
}
}
}
);
}
}
/**
/**
...
@@ -185,6 +193,20 @@ export default class AppMobMapPage extends Vue {
...
@@ -185,6 +193,20 @@ export default class AppMobMapPage extends Vue {
extensions
:
"all"
,
extensions
:
"all"
,
})
})
});
});
// 注册地图搜索服务
amap
.
service
([
"AMap.PlaceSearch"
],
()
=>
{
this
.
placeSearch
=
new
this
.
win
.
AMap
.
PlaceSearch
({
pageSize
:
5
,
// 单页显示结果条数
citylimit
:
false
,
// 是否强制限制在设置的城市内搜索
panel
:
'map__result'
,
// 搜索列表的HTML容器id或容器元素
});
})
// 监听搜索列表点击
amap
.
event
.
addListener
(
this
.
placeSearch
,
"listElementClick"
,
(
e
:
any
)
=>
{
if
(
e
.
data
.
location
)
{
this
.
handleMarker
(
e
.
data
.
location
.
R
,
e
.
data
.
location
.
Q
,
this
,
false
);
}
});
if
(
this
.
viewparams
)
{
if
(
this
.
viewparams
)
{
this
.
initAddress
();
this
.
initAddress
();
}
}
...
@@ -216,11 +238,11 @@ export default class AppMobMapPage extends Vue {
...
@@ -216,11 +238,11 @@ export default class AppMobMapPage extends Vue {
const
longitude
=
viewparams
.
longitude
;
const
longitude
=
viewparams
.
longitude
;
const
latitude
=
viewparams
.
latitude
;
const
latitude
=
viewparams
.
latitude
;
if
(
longitude
&&
latitude
)
{
if
(
longitude
&&
latitude
)
{
const
position
=
[
longitude
,
latitude
];
const
position
=
[
Number
(
longitude
),
Number
(
latitude
)
];
Object
.
assign
(
this
.
marker
,
{
Object
.
assign
(
this
.
marker
,
{
position
:
position
,
position
:
position
,
address
:
this
.
address
,
address
:
this
.
address
,
visible
:
true
visible
:
true
,
});
});
if
(
!
this
.
address
)
{
if
(
!
this
.
address
)
{
const
address
=
await
this
.
getAddress
(
longitude
,
latitude
).
catch
((
error
)
=>
{
const
address
=
await
this
.
getAddress
(
longitude
,
latitude
).
catch
((
error
)
=>
{
...
@@ -230,7 +252,7 @@ export default class AppMobMapPage extends Vue {
...
@@ -230,7 +252,7 @@ export default class AppMobMapPage extends Vue {
this
.
address
=
address
as
string
;
this
.
address
=
address
as
string
;
}
}
}
}
}
}
}
}
/**
/**
...
@@ -254,13 +276,11 @@ export default class AppMobMapPage extends Vue {
...
@@ -254,13 +276,11 @@ export default class AppMobMapPage extends Vue {
* @memberof AppMobMapPage
* @memberof AppMobMapPage
*/
*/
public
clearSearchList
()
{
public
clearSearchList
()
{
let
el
=
document
.
getElementById
(
'map__result'
);
if
(
this
.
placeSearch
)
{
let
childs
=
el
?.
childNodes
;
this
.
placeSearch
.
clear
();
if
(
childs
&&
childs
.
length
>
0
)
{
for
(
let
i
=
0
;
i
<
childs
?.
length
;
i
++
)
{
el
?.
removeChild
(
childs
[
i
]);
}
}
}
this
.
address
=
""
;
Object
.
assign
(
this
.
marker
,
{
position
:
[
0
,
0
],
address
:
this
.
address
,
visible
:
false
});
}
}
/**
/**
...
@@ -269,29 +289,16 @@ export default class AppMobMapPage extends Vue {
...
@@ -269,29 +289,16 @@ export default class AppMobMapPage extends Vue {
* @memberof AppMapPosition
* @memberof AppMapPosition
*/
*/
public
handleSearch
()
{
public
handleSearch
()
{
const
that
=
this
;
let
placeSearch
:
any
;
// 调用服务搜索结果
// 调用服务搜索结果
that
.
win
.
AMap
.
service
([
"AMap.PlaceSearch"
],
()
=>
{
if
(
this
.
placeSearch
)
{
placeSearch
=
new
this
.
win
.
AMap
.
PlaceSearch
({
this
.
placeSearch
.
search
(
this
.
address
,
(
status
:
any
,
result
:
any
)
=>
{
pageSize
:
5
,
if
(
status
==
'complete'
&&
result
.
info
==
'OK'
)
{
citylimit
:
false
,
console
.
warn
(
'搜索成功'
);
panel
:
'map__result'
,
}
else
{
})
console
.
warn
(
'搜索失败'
);
placeSearch
.
search
(
that
.
address
,
(
status
:
any
,
result
:
any
)
=>
{
if
(
status
==
'complete'
&&
result
.
info
==
'OK'
)
{
if
(
result
.
poiList
.
pois
)
{
that
.
handleMarker
(
result
.
poiList
.
pois
[
0
].
location
.
R
,
result
.
poiList
.
pois
[
0
].
location
.
Q
,
that
,
false
);
}
}
})
})
// 监听搜索结果列表点击事件
that
.
win
.
AMap
.
event
.
addListener
(
placeSearch
,
"listElementClick"
,
(
e
:
any
)
=>
{
if
(
e
.
data
.
location
)
{
that
.
handleMarker
(
e
.
data
.
location
.
R
,
e
.
data
.
location
.
Q
,
that
,
false
);
}
}
})
})
}
}
}
...
@@ -360,9 +367,9 @@ export default class AppMobMapPage extends Vue {
...
@@ -360,9 +367,9 @@ export default class AppMobMapPage extends Vue {
*/
*/
public
onOK
()
{
public
onOK
()
{
const
data
=
{
const
data
=
{
address
:
this
.
address
,
address
:
this
.
marker
.
address
,
longitude
:
this
.
marker
.
position
[
0
],
longitude
:
this
.
marker
.
position
[
0
]
?
this
.
marker
.
position
[
0
].
toFixed
(
6
)
:
null
,
latitude
:
this
.
marker
.
position
[
1
],
latitude
:
this
.
marker
.
position
[
1
]
?
this
.
marker
.
position
[
1
].
toFixed
(
6
)
:
null
,
}
}
if
(
this
.
close
&&
this
.
close
instanceof
Function
)
{
if
(
this
.
close
&&
this
.
close
instanceof
Function
)
{
this
.
close
(
data
);
this
.
close
(
data
);
...
...
编辑
预览
Markdown
格式
0%
请重试
or
添加新附件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
先完成此消息的编辑!
取消
想要评论请
注册
或
登录