Hooke / map-demo

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
471b65d6 1 parent 547467b1

细节调整，新增消息列表

Inline Side-by-side
Showing 6 changed files with 98 additions and 7 deletions
......@@ -2,7 +2,7 @@
* @Author: hookehuyr hookehuyr@gmail.com
* @Date: 2022-05-26 23:52:36
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-05-30 17:23:26
* @LastEditTime: 2023-07-10 17:48:24
* @FilePath: /map-demo/src/App.vue
* @Description:
-->
......@@ -69,6 +69,8 @@ body {
body {
position: relative;
margin: 0;
padding: 0;
// --van-white: #fff;
// --van-blue: #1989fa;
// --van-button-primary-color: var(--van-white);
......
......@@ -204,7 +204,12 @@ export default {
if (isNaN(timer)) {
timer = 0
}
this.play_time = this.calculateCurrentValue(timer)
this.play_time = this.calculateCurrentValue(timer);
// 音频播放完毕
if (this.play_time === '00:00') {
clearInterval(this.play_timer);
this.is_play = false;
}
}, 1000);
}).catch((e) => {
// 失败
......@@ -216,7 +221,7 @@ export default {
this.audio.pause();
this.is_play = false;
this.changeAudioStatus('pause');
clearInterval(this.play_timer)
clearInterval(this.play_timer);
},
goToUrl(url) {
location.href = this.info.details[this.isActive].url;
......
......@@ -250,6 +250,12 @@ export default {
},
goToList(id) {
console.warn(id);
this.$router.push({
path: '/noticeList',
query: {
id
}
})
},
goToHandle(url) {
// if (url) {
......
......@@ -6,4 +6,11 @@ export default [
title: '地图展示',
},
},
{
path: '/noticeList',
component: () => import('@/views/noticeList.vue'),
meta: {
title: '消息中心',
},
},
];
......
......@@ -459,9 +459,9 @@ export default {
this.current_safe_route = new AMap.Polyline({
path,
isOutline: true,
outlineColor: '#7F7F7F',
outlineColor: '#fba601',
borderWeight: 1,
strokeColor: '#7F7F7F',
strokeColor: '#fba601',
strokeOpacity: 1,
strokeWeight: 1,
// 折线样式还支持 'dashed'
......@@ -476,7 +476,7 @@ export default {
// 设置起始点标记
var marker1 = new AMap.Marker({
icon: new AMap.Icon({
image: 'https://cdn.ipadbiz.cn/xys/map/%E5%AE%9A%E4%BD%8D-%E5%B0%8F1@2x.png',
image: 'https://cdn.ipadbiz.cn/xys/map/%E5%AE%9A.png',
size: new AMap.Size(40, 40),
// 图标所用图片大小
imageSize: new AMap.Size(40, 40),
......@@ -494,7 +494,7 @@ export default {
});
var marker2 = new AMap.Marker({
icon: new AMap.Icon({
image: 'https://cdn.ipadbiz.cn/xys/map/%E5%AE%9A%E4%BD%8D-%E5%B0%8F1@2x.png',
image: 'https://cdn.ipadbiz.cn/xys/map/%E5%AE%9A.png',
size: new AMap.Size(40, 40),
// 图标所用图片大小
imageSize: new AMap.Size(40, 40),
......
<!--
* @Date: 2023-07-10 17:40:46
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-07-10 17:54:36
* @FilePath: /map-demo/src/views/noticeList.vue
* @Description: 文件描述
-->
<template>
<div class="notice-list-page">
<div class="notice-item" style=" background: #FFFFFF; box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.05); border-radius: 10px;">
<p>
<span style="color: #777;">时间：</span>
<span style="color: #000;">2023-07-10 11:47:54</span>
</p>
<p>
<span style="color: #777;">类型：</span>
<span style="color: #000;">火警</span>
</p>
<p>
<span style="color: #777;">位置：</span>
<span style="color: #000;">老念佛堂（藏金阁、延寿堂、福慧堂）一层</span>
</p>
</div>
<div class="notice-item" style="background: #F6F6F6; box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.05); border-radius: 10px;">
<p>
<span style="color: #777;">时间：</span>
<span style="color: #000;">2023-07-10 11:47:54</span>
</p>
<p>
<span style="color: #777;">类型：</span>
<span style="color: #000;">火警</span>
</p>
<p>
<span style="color: #777;">位置：</span>
<span style="color: #000;">老念佛堂（藏金阁、延寿堂、福慧堂）一层</span>
</p>
</div>
</div>
</template>
<script>
export default {
data() {
return {
}
},
mounted() {
},
methods: {
}
}
</script>
<style lang="less" scoped>
.notice-list-page {
padding: 1rem;
background-color: #EBEBEB;
height: 100vh;
.notice-item {
padding: 1rem;
width: auto;
height: auto;
margin-bottom: 1rem;
}
}
</style>