提交代码
This commit is contained in:
parent
803871b036
commit
284de71a0f
|
@ -104,7 +104,8 @@ export function exportMediaPPT(query) {
|
|||
url: '/media/export/dynamic/ppt',
|
||||
method: 'post',
|
||||
data: query,
|
||||
responseType: 'blob'
|
||||
responseType: 'blob',
|
||||
timeout: 300000, // 300秒 = 5分钟,根据文件大小调整
|
||||
})
|
||||
}
|
||||
|
||||
|
@ -124,4 +125,13 @@ export function mediaFiles(query) {
|
|||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 地图获取媒体
|
||||
export function mediaByMap(query) {
|
||||
return request({
|
||||
url: '/media/getMap',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
|
@ -166,8 +166,7 @@ const submitForm = () => {
|
|||
}
|
||||
|
||||
.topmenu-container {
|
||||
flex: 1; // 占据剩余空间
|
||||
padding-left: 284px; // 替代原来的padding-left
|
||||
flex: 0 1 auto; // 占据剩余空间 并居中
|
||||
}
|
||||
|
||||
.right-menu {
|
||||
|
|
|
@ -48,7 +48,7 @@
|
|||
</el-table-column>
|
||||
<el-table-column label="操作人" align="center" prop="createBy" width="160" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="操作时间" align="center" prop="createTime" width="210" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="变更字段" align="left" prop="changeAfter" min-width="210">
|
||||
<el-table-column label="变更字段" align="left" prop="changeAfterDifferDesc" min-width="210">
|
||||
<template #default="scope">
|
||||
<el-popover popper-class="myUpdate_popover" placement="bottom-start">
|
||||
<el-table :data="JSON.parse(scope.row.changeAfterDiffer)" height="230px">
|
||||
|
@ -72,7 +72,7 @@
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
<template #reference>
|
||||
<span class="updatefiter">{{ scope.row.changeAfter }}</span>
|
||||
<span class="updatefiter">{{ scope.row.changeAfterDifferDesc }}</span>
|
||||
</template>
|
||||
</el-popover>
|
||||
</template>
|
||||
|
@ -116,7 +116,7 @@
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
<template #reference>
|
||||
<span class="updatefiter">{{ activity.changeAfter }}</span>
|
||||
<span class="updatefiter">{{ activity.changeAfterDifferDesc }}</span>
|
||||
</template>
|
||||
</el-popover>
|
||||
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<div class="clearBtn">清除条件</div>
|
||||
<div class="clearBtn" @click="resetQuery">清除条件</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
|
@ -40,6 +40,9 @@ import AMapLoader from "@amap/amap-jsapi-loader"; // 引入地图服务
|
|||
import { useBackgroundStore } from '@/store/modules/background'
|
||||
import otherbg from '@/assets/images/otherbg.png'
|
||||
|
||||
import { mediaByMap } from "@/api/mediaLibrary"
|
||||
import { rAF } from 'element-plus/es/utils/raf.mjs';
|
||||
|
||||
const bgStore = useBackgroundStore()
|
||||
const { proxy } = getCurrentInstance()
|
||||
|
||||
|
@ -47,27 +50,35 @@ const { apiKey, secretKey } = window._CONFIG
|
|||
|
||||
// 距离显示文本
|
||||
const distanceLable = ref('请选择')
|
||||
const distanceLableArray = ref([
|
||||
{ label: '1公里内', value: 1 },
|
||||
{ label: '2公里内', value: 2 },
|
||||
{ label: '3公里内', value: 3 },
|
||||
{ label: '5公里内', value: 5 }
|
||||
])
|
||||
// 选择的距离值
|
||||
const activeLableIndex = ref(null)
|
||||
const distanceLableArray = ref([
|
||||
{ label: '1公里内', value: 1000 },
|
||||
{ label: '2公里内', value: 2000 },
|
||||
{ label: '3公里内', value: 3000 },
|
||||
{ label: '5公里内', value: 5000 }
|
||||
])
|
||||
|
||||
const points = ref([])
|
||||
|
||||
const data = reactive({
|
||||
queryParams: {
|
||||
keyword: undefined,
|
||||
x: undefined, //中心点经度
|
||||
y: undefined, //中心点纬度
|
||||
distance: undefined,
|
||||
}
|
||||
})
|
||||
const { queryParams } = toRefs(data)
|
||||
|
||||
|
||||
/** 清除条件操作 */
|
||||
const resetQuery = () => {
|
||||
proxy.resetForm("queryRef")
|
||||
queryParams.value = {
|
||||
keyword: undefined,
|
||||
x: undefined, //中心点经度
|
||||
y: undefined, //中心点纬度
|
||||
distance: undefined,
|
||||
}
|
||||
handleQuery()
|
||||
}
|
||||
|
||||
|
@ -78,8 +89,6 @@ const handleChangeDistance = (itemDistance) => {
|
|||
distanceLable.value = itemDistance.label
|
||||
}
|
||||
|
||||
|
||||
|
||||
// map实例
|
||||
const mapInstance = ref(null)
|
||||
const massMarks = ref(null)
|
||||
|
@ -109,7 +118,7 @@ const loadMap = () => {
|
|||
mapInstance.value = new AMap.Map("mapContainer", {
|
||||
resizeEnable: true,
|
||||
zoom: 14,
|
||||
center: [116.397428, 39.90923],
|
||||
center: [116.397428, 39.90923], // 默认中心点
|
||||
pitch: initialPitch, // 倾斜角度决定2D/3D模式
|
||||
rotation: initialRotation, // 旋转角度
|
||||
buildingAnimation: true,
|
||||
|
@ -165,7 +174,6 @@ const addCustomControls = (AMap) => {
|
|||
// 添加到地图容器
|
||||
document.getElementById('mapContainer').appendChild(controlContainer);
|
||||
}
|
||||
|
||||
// 切换2D/3D模式
|
||||
const toggle2D3DMode = () => {
|
||||
if (!mapInstance.value) return;
|
||||
|
@ -186,7 +194,6 @@ const toggle2D3DMode = () => {
|
|||
loadMap()
|
||||
}
|
||||
}
|
||||
|
||||
// 切换全屏模式
|
||||
const toggleFullscreen = () => {
|
||||
const mapContainer = document.getElementById('mapContainer');
|
||||
|
@ -213,14 +220,12 @@ const toggleFullscreen = () => {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 监听全屏变化事件
|
||||
document.addEventListener('fullscreenchange', () => {
|
||||
if (!document.fullscreenElement) {
|
||||
isFullscreen.value = false;
|
||||
}
|
||||
});
|
||||
|
||||
// 创建自定义点样式
|
||||
const createPointStyle = (color, size, styleType) => {
|
||||
const canvas = document.createElement('canvas');
|
||||
|
@ -297,68 +302,35 @@ const renderMassMarks = () => {
|
|||
anchor: new AMap.Pixel(18, 18),
|
||||
size: new AMap.Size(18, 18)
|
||||
},
|
||||
// {
|
||||
// url: createPointStyle('#FFA200', 18, 'circle').toDataURL(),
|
||||
// anchor: new AMap.Pixel(18, 18),
|
||||
// size: new AMap.Size(18, 18)
|
||||
// },
|
||||
// {
|
||||
// url: createPointStyle('#00C272', 18, 'circle').toDataURL(),
|
||||
// anchor: new AMap.Pixel(18, 18),
|
||||
// size: new AMap.Size(18, 18)
|
||||
// }
|
||||
];
|
||||
// 调用接口,获取数据点
|
||||
points.value = []
|
||||
mediaByMap(queryParams.value).then(res => {
|
||||
if (res.code == 200) {
|
||||
res.data.forEach(itemPoint => {
|
||||
if (itemPoint.businessType == 1) points.value.push({ "lnglat": [itemPoint.x, itemPoint.y], "name": itemPoint.mediaId, "style": 0 })
|
||||
if (itemPoint.businessType == 2) points.value.push({ "lnglat": [itemPoint.x, itemPoint.y], "name": itemPoint.mediaId, "style": 1 })
|
||||
});
|
||||
}
|
||||
}).then(res => {
|
||||
console.log('points', points.value)
|
||||
// 创建MassMarks对象
|
||||
massMarks.value = new AMap.MassMarks(points.value, {
|
||||
opacity: 1,
|
||||
zIndex: 111,
|
||||
cursor: 'pointer',
|
||||
style: styles
|
||||
});
|
||||
|
||||
// 测试数据
|
||||
const points = [
|
||||
{ "lnglat": [116.258446, 37.686622], "name": "景县", "style": 1 },
|
||||
{ "lnglat": [113.559954, 22.124049], "name": "圣方济各堂区", "style": 1 },
|
||||
{ "lnglat": [116.366794, 39.915309], "name": "西城区", "style": 1 },
|
||||
{ "lnglat": [116.486409, 39.921489], "name": "朝阳区", "style": 1 },
|
||||
{ "lnglat": [116.286968, 39.863642], "name": "丰台区", "style": 1 },
|
||||
{ "lnglat": [116.195445, 39.914601], "name": "石景山区", "style": 1 },
|
||||
{ "lnglat": [116.310316, 39.956074], "name": "海淀区", "style": 1 },
|
||||
{ "lnglat": [116.105381, 39.937183], "name": "门头沟区", "style": 0 },
|
||||
{ "lnglat": [116.139157, 39.735535], "name": "房山区", "style": 0 },
|
||||
{ "lnglat": [116.658603, 39.902486], "name": "通州区", "style": 0 },
|
||||
{ "lnglat": [116.653525, 40.128936], "name": "顺义区", "style": 0 },
|
||||
{ "lnglat": [116.235906, 40.218085], "name": "昌平区", "style": 0 },
|
||||
{ "lnglat": [116.338033, 39.728908], "name": "大兴区", "style": 0 },
|
||||
{ "lnglat": [116.637122, 40.324272], "name": "怀柔区", "style": 0 },
|
||||
{ "lnglat": [117.112335, 40.144783], "name": "平谷区", "style": 0 },
|
||||
{ "lnglat": [116.843352, 40.377362], "name": "密云区", "style": 0 },
|
||||
{ "lnglat": [115.985006, 40.465325], "name": "延庆区", "style": 1 },
|
||||
{ "lnglat": [113.56925, 22.136546], "name": "路凼填海区", "style": 1 },
|
||||
{ "lnglat": [117.195907, 39.118327], "name": "和平区", "style": 1 },
|
||||
{ "lnglat": [117.226568, 39.122125], "name": "河东区", "style": 1 },
|
||||
{ "lnglat": [117.217536, 39.101897], "name": "河西区", "style": 1 },
|
||||
{ "lnglat": [117.164143, 39.120474], "name": "南开区", "style": 1 },
|
||||
{ "lnglat": [117.201569, 39.156632], "name": "河北区", "style": 0 },
|
||||
{ "lnglat": [117.163301, 39.175066], "name": "红桥区", "style": 1 },
|
||||
{ "lnglat": [117.313967, 39.087764], "name": "东丽区", "style": 0 },
|
||||
{ "lnglat": [117.012247, 39.139446], "name": "西青区", "style": 0 },
|
||||
{ "lnglat": [117.382549, 38.989577], "name": "津南区", "style": 0 },
|
||||
{ "lnglat": [117.13482, 39.225555], "name": "北辰区", "style": 0 },
|
||||
{ "lnglat": [117.057959, 39.376925], "name": "武清区", "style": 0 },
|
||||
{ "lnglat": [116.405285, 39.904989], "name": "北京市", "style": 0 }
|
||||
]
|
||||
// 创建MassMarks对象
|
||||
massMarks.value = new AMap.MassMarks(points, {
|
||||
opacity: 1,
|
||||
zIndex: 111,
|
||||
cursor: 'pointer',
|
||||
style: styles
|
||||
});
|
||||
// 将海量点添加到地图
|
||||
massMarks.value.setMap(mapInstance.value);
|
||||
|
||||
// 将海量点添加到地图
|
||||
massMarks.value.setMap(mapInstance.value);
|
||||
|
||||
// 添加点击事件
|
||||
massMarks.value.on('click', function (e) {
|
||||
console.log('点击了节点', e.data)
|
||||
});
|
||||
// 添加点击事件
|
||||
massMarks.value.on('click', function (e) {
|
||||
console.log('点击了节点', e.data)
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
// 隐藏Logo的函数
|
||||
const hideAmapLogo = () => {
|
||||
const logos = document.querySelectorAll('.amap-logo, .amap-copyright');
|
||||
|
|
Loading…
Reference in New Issue
Block a user