- ![]()
系统通知
+ ![]()
+ 系统通知
+ 更多...
-
@@ -67,6 +69,7 @@
diff --git a/src/views/mediaMap/index.vue b/src/views/mediaMap/index.vue
index 53ad57e..71c0afa 100644
--- a/src/views/mediaMap/index.vue
+++ b/src/views/mediaMap/index.vue
@@ -1,5 +1,47 @@
+
@@ -7,13 +49,9 @@
-
-
@@ -33,10 +71,29 @@
+
+ 导出PPT
+
+
+
+
+ 优客模板导出
+ 滴滴模板导出
+ 空白模板导出
+
+
+
+
-
+
@@ -148,6 +205,7 @@
+
@@ -166,21 +224,34 @@ import {
ZoomOut,
} from '@element-plus/icons-vue'
import AMapLoader from "@amap/amap-jsapi-loader"; // 引入地图服务
+import { sysMediaTypeListByPid } from "@/api/system/mediaType"
import { useBackgroundStore } from '@/store/modules/background'
import otherbg from '@/assets/images/otherbg.png'
import { mediaByMap, mediaDetail } from "@/api/mediaLibrary"
+import { pptTemplatePage } from "@/api/system/pptTemplate"
+import exportPPTDialog from '../mediaLibrary/exportPPTDialog.vue';
+
const baseUrl = import.meta.env.VITE_APP_BASE_API
const bgStore = useBackgroundStore()
const { proxy } = getCurrentInstance()
const { apiKey, secretKey } = window._CONFIG
+// ppt模板数据
+const templateList = ref([])
+const exportPPTDialogRef = ref(null)
+
+// 媒体类型数据
+const mediaTypeOne = ref([])
+const mediaTypeTwo = ref([])
+const mediaTypeThree = ref([])
+// 媒体多选数据
+const multipleChoseArr = ref([])
+
const open = ref(false)
const detailForm = ref({})
const fileList = ref([])
const previewImg = ref([])
-// 中心点名称
-const centerPointName = ref(null)
// map实例
const mapInstance = ref(null)
const massMarks = ref(null)
@@ -191,9 +262,12 @@ const mapMode = ref('2D')
const isFullscreen = ref(false)
const placeSearch = ref(null)
+// 中心点名称
+const centerPointName = ref(null)
+
// 热区圆实例
const circle = ref(null);
-const circleRadius = ref(500); // 实际半径（米）
+const circleRadius = ref(1000); // 实际半径（米）
const circleHandle = ref(null); // 拖拽手柄
// 选择地点展示框
@@ -213,6 +287,13 @@ const distanceLableArray = ref([
])
const points = ref([])
+// 悬浮菜单
+const contextMenuVisible = ref(false);
+const menuPosition = ref({
+ top: '0px', left: '0px', zIndex: 999
+});
+// 当前操作媒体
+const curMediaInfo = ref(null)
const data = reactive({
queryParams: {
@@ -220,6 +301,9 @@ const data = reactive({
x: undefined, //中心点经度
y: undefined, //中心点纬度
distance: undefined,
+ mediaType: undefined,
+ mediaCategory: undefined,
+ displayForm: undefined
}
})
const { queryParams } = toRefs(data)
@@ -231,12 +315,15 @@ const resetQuery = () => {
x: undefined, //中心点经度
y: undefined, //中心点纬度
distance: undefined,
+ mediaType: undefined,
+ mediaCategory: undefined,
+ displayForm: undefined
}
// 距离显示文本
distanceLable.value = '请选择'
// 选择的距离值
activeLableIndex.value = null
- circleRadius.value = 500; // 实际半径（米）
+ circleRadius.value = 1000; // 实际半径（米）
selectConfig.value = null
// 清除现有的圆形和标记
@@ -272,72 +359,79 @@ const handleViewMedia = (_mediaId) => {
}
-// 调用API获取地点
+// 查询媒体信息
const getLocaleListList = (searchValue) => {
selectLoading.value = true
if (searchValue !== "") {
- placeSearch.value.search(searchValue, function (status, result) {
- // 查询成功时，result即对应匹配的POI信息
- if (result.poiList.pois?.length) {
- localeList.value = result.poiList?.pois
+ queryParams.value.keyword = searchValue
+ mediaByMap(queryParams.value).then(res => {
+ if (res.code == 200) {
+ localeList.value = res.data.length > 0 ? res.data : []
+ selectLoading.value = false
}
- selectLoading.value = false
- });
+ })
+
+ // placeSearch.value.search(searchValue, function (status, result) {
+ // // 查询成功时，result即对应匹配的POI信息
+ // if (result.poiList.pois?.length) {
+ // localeList.value = result.poiList?.pois
+ // }
+ // selectLoading.value = false
+ // });
}
}
// 中心点选择
const currentSelect = (val) => {
- selectConfig.value = val
- centerPointName.value = val.name
- // queryParams.value.keyword = val.name
- queryParams.value.x = val.location.lng
- queryParams.value.y = val.location.lat
- queryParams.value.distance = circleRadius.value
+ const chosedMedia = localeList.value.filter(item => item.mediaId == val)[0]
+ if (chosedMedia) {
+ centerPointName.value = chosedMedia.mediaName
- // 距离显示文本
- distanceLable.value = circleRadius.value == 500 ? '500米' : circleRadius.value + '米'
- // 选择的距离值
- activeLableIndex.value = circleRadius.value == 500 ? 500 : circleRadius.value
+ // 距离显示文本
+ distanceLable.value = circleRadius.value == 1000 ? '1000米' : circleRadius.value + '米'
+ // 选择的距离值
+ activeLableIndex.value = circleRadius.value == 1000 ? 1000 : circleRadius.value
- // 清除现有的圆形和标记
- if (circle.value) {
- mapInstance.value.remove(circle.value);
- circle.value = null;
- }
- if (circleHandle.value) {
- mapInstance.value.remove(circleHandle.value);
- circleHandle.value = null;
+ // 清除现有的圆形和标记
+ if (circle.value) {
+ mapInstance.value.remove(circle.value);
+ circle.value = null;
+ }
+ if (circleHandle.value) {
+ mapInstance.value.remove(circleHandle.value);
+ circleHandle.value = null;
+ }
+
+ // addCenterMark(chosedMedia)
+ createCircle(chosedMedia)
}
- createCircle(val)
- addCenterMark(val)
+
}
// 创建中心点标记
const addCenterMark = (val) => {
if (centerMarker.value) mapInstance.value.remove(centerMarker.value);
centerMarker.value = new AMap.Marker({
- position: [val.location.lng, val.location.lat],
- title: val.name,
+ position: [val.x, val.y],
+ title: val.mediaName,
zIndex: 100,
draggable: false, // 是否可以拖拽
cursor: 'move'
});
// 将点添加到地图
mapInstance.value.add(centerMarker.value);
- mapInstance.value.setFitView();
+ mapInstance.value.setFitView(centerMarker.value);
}
// 创建圆形热区
const createCircle = (val) => {
// 创建圆形覆盖物
circle.value = new AMap.Circle({
- center: [val.location.lng, val.location.lat],
+ center: [val.x, val.y],
radius: circleRadius.value,
strokeColor: '#4e54c8',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#4e54c8',
fillOpacity: 0.15,
- zIndex: 100,
bubble: true,
cursor: 'move',
draggable: false // 是否可以拖拽
@@ -345,12 +439,10 @@ const createCircle = (val) => {
// 将圆形添加到地图
mapInstance.value.add(circle.value);
+ mapInstance.value.setFitView(circle.value);
// 创建圆形边缘拖拽手柄
createCircleHandle();
-
- // 渲染数据点
- renderMassMarks()
}
// 创建圆形边缘拖拽手柄
const createCircleHandle = () => {
@@ -367,11 +459,11 @@ const createCircleHandle = () => {
position: [handlePosition.lng, handlePosition.lat],
icon: new AMap.Icon({
size: new AMap.Size(20, 20),
- image: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+ // image: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+ image: otherbg,
imageSize: new AMap.Size(20, 20)
}),
offset: new AMap.Pixel(-10, -10),
- zIndex: 101,
draggable: true,
cursor: 'pointer'
});
@@ -385,7 +477,7 @@ const createCircleHandle = () => {
const newRadius = Math.round(calculateDistance(center, handlePos));
circleRadius.value = newRadius;
distanceLable.value = `${Math.round(circleRadius.value)}米`;
- queryParams.value.distance = circleRadius.value // 更改查询条件距离
+
if (circleRadius.value !== 1000 && circleRadius.value !== 2000 && circleRadius.value !== 3000 && circleRadius.value !== 5000) activeLableIndex.value = null
else activeLableIndex.value = circleRadius.value
circle.value.setRadius(newRadius);
@@ -394,8 +486,6 @@ const createCircleHandle = () => {
circleHandle.value.on('dragend', () => {
// 拖拽结束后更新手柄位置
updateCircleHandlePosition();
- // 重新渲染数据点
- renderMassMarks()
});
}
// 更新圆形拖拽手柄位置
@@ -419,6 +509,8 @@ const calculateDistance = (point1, point2) => {
const lng2 = point2.lng;
const lat2 = point2.lat;
+ console.log('sdfadsf', point1.lng, point2)
+
const radLat1 = lat1 * Math.PI / 180.0;
const radLat2 = lat2 * Math.PI / 180.0;
const a = radLat1 - radLat2;
@@ -437,14 +529,10 @@ const handleChangeDistance = (itemDistance) => {
queryParams.value.distance = itemDistance.value
activeLableIndex.value = itemDistance.value
distanceLable.value = itemDistance.value + '米'
-
// 更新热区
circleRadius.value = itemDistance.value;
circle.value.setRadius(itemDistance.value);
updateCircleHandlePosition();
-
- // 重新渲染数据点
- renderMassMarks()
}
// 初始化地图
const loadMap = () => {
@@ -453,10 +541,10 @@ const loadMap = () => {
window._AMapSecurityConfig = {
securityJsCode: secretKey
};
-
AMapLoader.load({
key: apiKey,
plugins: ["AMap.PlaceSearch"],
+ version: '2.0', // 指定API版本
AMapUI: {
plugins: []
}
@@ -469,8 +557,6 @@ const loadMap = () => {
resizeEnable: true,
pitch: initialPitch, // 倾斜角度决定2D/3D模式
rotation: initialRotation, // 旋转角度
- zoom: 16,
- zooms: [3, 16],
viewMode: mapMode.value // 启用3D视图
});
@@ -493,14 +579,13 @@ const loadMap = () => {
// 监听地图渲染完成事件
mapInstance.value.on('render', hideAmapLogo);
- // 添加缩放变化监听
- mapInstance.value.on('zoomchange', handleZoomChange);
- if (selectConfig.value !== null) {
- currentSelect(selectConfig.value)
- } else {
- // 在地图完全加载后执行点数据处理
- renderMassMarks();
- }
+ // // 关键：监听地图的右键点击事件
+ // mapInstance.value.on('rightclick', handleRightClick);
+ mapInstance.value.on('click', function (e) {
+ hideContextMenu()
+ });
+ // 在地图完全加载后执行点数据处理
+ renderMassMarks();
resolve();
@@ -510,15 +595,7 @@ const loadMap = () => {
});
});
}
-// 处理地图缩放事件
-const handleZoomChange = () => {
- const currentZoomLevel = mapInstance.value.getZoom();
- // 如果缩放级别超过16，自动调整回16
- if (currentZoomLevel > 16) {
- mapInstance.value.setZoom(16);
- return;
- }
-}
+
// 添加自定义控件
const addCustomControls = (AMap) => {
// 创建控件容器
@@ -649,6 +726,7 @@ const createPointStyle = (color, size, styleType) => {
return canvas;
}
+
// 渲染海量点
const renderMassMarks = () => {
// 清除现有的海量点
@@ -683,8 +761,8 @@ const renderMassMarks = () => {
mediaByMap(queryParams.value).then(res => {
if (res.code == 200) {
res.data.forEach(itemPoint => {
- if (itemPoint.dataScopeDeptId == 220) points.value.push({ "lnglat": [itemPoint.x, itemPoint.y], "mediaId": itemPoint.mediaId, "style": 0 })
- else if (itemPoint.dataScopeDeptId == 219) points.value.push({ "lnglat": [itemPoint.x, itemPoint.y], "mediaId": itemPoint.mediaId, "style": 1 })
+ if (itemPoint.dataScopeDeptId == 220) points.value.push({ "lnglat": [itemPoint.x, itemPoint.y], "mediaId": itemPoint.mediaId, 'mediaName': itemPoint.mediaName, "style": 0 })
+ else if (itemPoint.dataScopeDeptId == 219) points.value.push({ "lnglat": [itemPoint.x, itemPoint.y], "mediaId": itemPoint.mediaId, 'mediaName': itemPoint.mediaName, "style": 1 })
// 同时更新极值
const lng = itemPoint.x;
@@ -709,9 +787,17 @@ const renderMassMarks = () => {
// 添加点击事件
massMarks.value.on('click', function (e) {
+ hideContextMenu()
handleViewMedia(e.data.mediaId)
});
+ // 鼠标悬浮
+ massMarks.value.on('mouseover', function (e) {
+ var pixel = mapInstance.value.lngLatToContainer(e.data.lnglat);
+ curMediaInfo.value = e.data
+ showContextMenu(pixel)
+ });
+
// ==================================================
// 新增：计算边界并设置地图视野
// ==================================================
@@ -723,6 +809,25 @@ const renderMassMarks = () => {
mapInstance.value.setBounds(bounds);
})
}
+const showContextMenu = (pixel) => {
+ // 更新菜单位置跟随鼠标光标
+ menuPosition.value = {
+ top: `${pixel.y + 210}px`,
+ left: `${pixel.x + 50}px`,
+ position: 'absolute',
+ padding: '10px',
+ background: '#FFFFFF',
+ lineHeight: '16px',
+ borderRadius: '4px',
+ cursor: 'pointer',
+ boxShadow: '0 0 4px #ccc'
+ };
+ contextMenuVisible.value = true;
+}
+
+const hideContextMenu = () => {
+ contextMenuVisible.value = false;
+}
// 隐藏Logo的函数
const hideAmapLogo = () => {
const logos = document.querySelectorAll('.amap-logo, .amap-copyright');
@@ -732,7 +837,55 @@ const hideAmapLogo = () => {
logo.style.opacity = '0';
});
}
-
+// 获取PPT模板
+const getpptTemplatePageList = () => {
+ pptTemplatePage(queryParams.value).then(res => {
+ templateList.value = res.data.list
+ })
+}
+/** 导出PPT按钮操作 */
+const handleExportPPT = (tempId) => {
+ if (multipleChoseArr.value.length == 0) {
+ proxy.$modal.msgWarning("请选择要导出的媒体!!!")
+ return false
+ }
+ const mediaIds = multipleChoseArr.value.map(item => item.id);
+ exportPPTDialogRef.value.initExportPPT(tempId, mediaIds, multipleChoseArr.value)
+}
+// 获取一级媒体类型
+const getMediaTypeOne = () => {
+ sysMediaTypeListByPid({ parentId: 0 }).then(res => {
+ mediaTypeOne.value = res.data
+ })
+}
+// 获取二级媒体类型
+const getMediaTypeTwo = (value) => {
+ sysMediaTypeListByPid({ parentId: value }).then(res => {
+ queryParams.value.mediaTypeTwo = undefined
+ queryParams.value.mediaTypeThree = undefined
+ mediaTypeTwo.value = res.data
+ })
+}
+// 获取三级媒体类型
+const getMediaTypeThree = (value) => {
+ sysMediaTypeListByPid({ parentId: value }).then(res => {
+ queryParams.value.mediaTypeThree = undefined
+ mediaTypeThree.value = res.data
+ })
+}
+// 选择媒体事件
+const handleChoseMedia = () => {
+ hideContextMenu()
+ if (curMediaInfo.value) {
+ const rowIndex = multipleChoseArr.value.findIndex(item => item.id == curMediaInfo.value.mediaId)
+ if (rowIndex == -1) multipleChoseArr.value.push({ id: curMediaInfo.value.mediaId, mediaName: curMediaInfo.value.mediaName })
+ }
+}
+// 移除媒体选择项
+const handleCloseTag = (tag) => {
+ const rowIndex = multipleChoseArr.value.findIndex(item => item.id == tag.id)
+ multipleChoseArr.value.splice(rowIndex, 1)
+}
onUnmounted(() => {
if (mapInstance.value) {
mapInstance.value.destroy();
@@ -741,6 +894,8 @@ onUnmounted(() => {
// 初始化
onMounted(() => {
bgStore.setBgImage(otherbg)
+ getMediaTypeOne()
+ getpptTemplatePageList()
loadMap()
});
@@ -773,6 +928,30 @@ onMounted(() => {
background: #1a75e6;
}
+
+.mediaMapExportBtn {
+ // min-width: 122px;
+ height: 34px;
+ border-radius: 4px;
+ background: #1a75e6;
+ font-family: Microsoft YaHei;
+ font-weight: 400;
+ font-size: 16px;
+ text-align: left;
+ color: #FFFFFF;
+ padding: 10px;
+}
+
+.mediaMapExportBtn>span {
+ align-items: center;
+ display: inline-flex;
+ width: 100%;
+}
+
+.mediaMapExportBtn:hover {
+ background: #1a75e6;
+}
+
.distanceItem {
position: relative;
padding-left: 40px;
@@ -839,7 +1018,7 @@ onMounted(() => {
.mediaMapContainer {
width: 100%;
- height: calc(100vh - 170px);
+ height: calc(100vh - 256px);
background: #3f8bff;
}
@@ -919,10 +1098,10 @@ onMounted(() => {
height: 100% !important;
}
-.one-text {
- height: 50px;
- padding-top: 4px;
-}
+// .one-text {
+// height: 50px;
+// padding-top: 4px;
+// }
// 分割线
.splineBar {
@@ -936,4 +1115,23 @@ onMounted(() => {
max-height: 70vh;
object-fit: contain;
}
+
+.noChoseLabel {
+ height: 24px;
+ line-height: 24px;
+ font-family: Microsoft YaHei;
+ font-weight: 400;
+ font-size: 16px;
+ color: #ffffff90;
+}
+
+.custom-menu {
+ position: absolute;
+ background: white;
+ border: 1px solid #ccc;
+ border-radius: 4px;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+ z-index: 1000;
+ display: none;
+}
\ No newline at end of file
diff --git a/src/views/mediaTool/noticeList.vue b/src/views/mediaTool/noticeList.vue
new file mode 100644
index 0000000..eb54369
--- /dev/null
+++ b/src/views/mediaTool/noticeList.vue
@@ -0,0 +1,132 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ tag.mediaName }}
+
+
+
+
+
未选择媒体
+
+ {{ item.name }}
- {{
- item.address
- }}
+ placeholder="请输入媒体名称/媒体编号/关键字" remote-show-suffix clearable style="width: 400px">
+ 清除条件
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 查询
+ 重置
+ 导出
+
+
+
+
+
+
+ {{ scope.$index + 1 }}
+
+
+
+
+ {{ parseTime(scope.row.createTime) }}
+
+
+
+
+ 去处理
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/views/mediaTool/pptAnalysisIndex.vue b/src/views/mediaTool/pptAnalysisIndex.vue
index e0b48d3..5a3f120 100644
--- a/src/views/mediaTool/pptAnalysisIndex.vue
+++ b/src/views/mediaTool/pptAnalysisIndex.vue
@@ -20,7 +20,7 @@
将文件拖曳至此区域，或 点击上传
+ 工作台 - 系统通知
+
+
+
- 支持扩展名：.pptx
+ 支持扩展名：.jpeg、.jpg、.png、.pptx
@@ -149,34 +149,22 @@ const requestDocUpload = (options) => {
})
}
//自定义上传文件资料校验
-const beforeDocUpload = (file) => {
- const type = [
+const beforeDocUpload = (file) => {
+ const validTypes = [
+ // 图片类型
+ "image/jpeg",
+ "image/jpg",
+ "image/png",
+ // PPT 类型
'application/vnd.openxmlformats-officedocument.presentationml.presentation'
- ];
- const isXlsx = type.includes(file.type);
- // 检验文件格式
- if (!isXlsx) {
- proxy.$modal.msgError("文件格式错误，请上传.pptx后缀的文件。");
- return false;
- }
-
- // 定义大小限制：500MB = 500 * 1024 * 1024 字节
- const MAX_SIZE = 500 * 1024 * 1024
-
- if (file.size > MAX_SIZE) {
- // 文件大小超出限制
- proxy.$modal.msgError(`文件大小不能超过 500MB！当前文件为 ${formatFileSize(file.size)}`);
- // 返回 false 会阻止上传
+ ]
+ const isValidType = validTypes.includes(file.type)
+ if (!isValidType) {
+ proxy.$modal.msgError("文件格式错误，请上传 .jpeg、.jpg、.png、.pptx 后缀的文件。");
return false
}
-}
-const formatFileSize = (bytes) => {
- if (bytes === 0) return '0 B'
- const k = 1024
- const sizes = ['B', 'KB', 'MB', 'GB']
- const i = Math.floor(Math.log(bytes) / Math.log(k))
- return (bytes / Math.pow(k, i)).toFixed(2) + ' ' + sizes[i]
-}
+return true
+}
// 移除已上传文件列表
const removeDocUpload = (file, fileList) => {
docUploadList.value = docUploadList.value.filter(
diff --git a/src/views/supplier/supplierForm.vue b/src/views/supplier/supplierForm.vue
index 446f719..22cd80b 100644
--- a/src/views/supplier/supplierForm.vue
+++ b/src/views/supplier/supplierForm.vue
@@ -330,11 +330,13 @@ import { Close } from '@element-plus/icons-vue'
import { sysRegionListByPid } from "@/api/system/administrativeRegion"
import { addBusSupplier, updateBusSupplier, getBusSupplier } from "@/api/supplier"
import { listDept } from "@/api/system/dept"
+import useUserStore from '@/store/modules/user'
import multiFileUpload from '../../components/FileUpload/multiFileUpload.vue'
const { proxy } = getCurrentInstance()
const emit = defineEmits(['handleShowList']);
+const userStore = useUserStore()
const formTitle = ref('新建')
// 查询条件 省、市、县
@@ -550,6 +552,10 @@ const initForm = (_formTitle, _ruleForm) => {
getDepList()
getProvinceList()
if (ruleForm.value.supplierId) getSupplierInfo()
+ else {
+ ruleForm.value.dockingName = userStore.name
+ ruleForm.value.dockingPhone = userStore.phoneNumber
+ }
nextTick(() => {
businessLicenseRef.value._fileType = 1
otherFileRef.value._fileType = 9