diff --git a/src/api/api/index.ts b/src/api/api/index.ts index c8f1479..325777a 100644 --- a/src/api/api/index.ts +++ b/src/api/api/index.ts @@ -23,16 +23,17 @@ deviceAdd = '/carbonDevice/add', deviceUpdate = '/carbonDevice/update', deviceDelete = '/carbonDevice/delete', + deviceDetail = '/carbonDevice/detail', // 环境参数 environment = '/environmentInfo/listPage', environmentAdd = '/environmentInfo/add', environmentUpdate = '/environmentInfo/update', environmentDelete = '/environmentInfo/delete', // 用热监测/用气监测 - carbonOtherMonitorAdd = '/carbonOtherMonitor/add', - carbonOtherMonitorUpdate = '/carbonOtherMonitor/update', - carbonOtherMonitorDelete = '/carbonOtherMonitor/delete', - carbonOtherMonitor = '/carbonOtherMonitor/listPage', + carbonOtherMonitorAdd = '/deviceCollectionLog/add', + carbonOtherMonitorUpdate = '/deviceCollectionLog/update', + carbonOtherMonitorDelete = '/deviceCollectionLog/delete', + carbonOtherMonitor = '/deviceCollectionLog/listPage', } // 上传 export function uploadApi(data: FormData) { @@ -254,6 +255,21 @@ method: 'post', }) } +// 获取设备详情 +export function getDeviceDetail(id: any) { + return request({ + url: `${api.deviceDetail}?id=${id}`, + method: 'get', + }) +} +// 设备监测趋势分析 +export function getDeviceDetailAnalysis(params: object) { + return request({ + url: '/deviceCollectionLog/detailAnalysis', + method: 'get', + params, + }) +} // 环境参数列表 export function getEnvironmentList(params: any) { return request({ diff --git a/src/api/api/index.ts b/src/api/api/index.ts index c8f1479..325777a 100644 --- a/src/api/api/index.ts +++ b/src/api/api/index.ts @@ -23,16 +23,17 @@ deviceAdd = '/carbonDevice/add', deviceUpdate = '/carbonDevice/update', deviceDelete = '/carbonDevice/delete', + deviceDetail = '/carbonDevice/detail', // 环境参数 environment = '/environmentInfo/listPage', environmentAdd = '/environmentInfo/add', environmentUpdate = '/environmentInfo/update', environmentDelete = '/environmentInfo/delete', // 用热监测/用气监测 - carbonOtherMonitorAdd = '/carbonOtherMonitor/add', - carbonOtherMonitorUpdate = '/carbonOtherMonitor/update', - carbonOtherMonitorDelete = '/carbonOtherMonitor/delete', - carbonOtherMonitor = '/carbonOtherMonitor/listPage', + carbonOtherMonitorAdd = '/deviceCollectionLog/add', + carbonOtherMonitorUpdate = '/deviceCollectionLog/update', + carbonOtherMonitorDelete = '/deviceCollectionLog/delete', + carbonOtherMonitor = '/deviceCollectionLog/listPage', } // 上传 export function uploadApi(data: FormData) { @@ -254,6 +255,21 @@ method: 'post', }) } +// 获取设备详情 +export function getDeviceDetail(id: any) { + return request({ + url: `${api.deviceDetail}?id=${id}`, + method: 'get', + }) +} +// 设备监测趋势分析 +export function getDeviceDetailAnalysis(params: object) { + return request({ + url: '/deviceCollectionLog/detailAnalysis', + method: 'get', + params, + }) +} // 环境参数列表 export function getEnvironmentList(params: any) { return request({ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index 62e9a5a..15929df 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -78,62 +78,25 @@ map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 - // center: markerArr.value[0], center: [111.765785, 40.718114], - // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) // 图层实例 layer.value = new AMap.TileLayer.Satellite() - // 绑定右击时间 + // 地图绑定右击事件 map.value.on('mousedown', clickHandler) - // 用来画区域的 - // polygon.value = new AMap.Polygon({ - // map: map.value, - // fillOpacity: 0.2, - // path: pathArr.value, // 区域数组 - // }) - // 画图工具 - // mouseTool.value = new AMap.MouseTool(map.value) - // mouseTool.value.rectangle({ - // strokeColor: '#1E9FFF', - // strokeWeight: 2, - // strokeStyle: 'dashed', - // strokeOpacity: 1, - // fillOpacity: 0.1, - // fillColor: '#1E9FFF', - // // zIndex: 50, - // // 同Polygon的Option设置 - // }) - // var overlays = [] - // 监听draw事件可获取画好的覆盖物 - // mouseTool.value.on('draw', (e) => { - // // 绘制多边形; - // overlays.push(e.obj) - // // 获取坐标; - // console.log(e.obj.getPath()) - // // 格式化坐标; - // var polyPoints = e.obj.getPath() - // var arr = '' - // for (var i = 0; i < polyPoints.length; i++) { - // arr += `${polyPoints[i].lng},${polyPoints[i].lat};` - // } - // console.log(arr)// 121.540994,29.870174;121.55138,29.858116;121.55756,29.874193; - // }) // 电网支路标记点绘制 for (let i = 0; i < markerArr.value.length; i++) { const icon = new AMap.Icon({ size: new AMap.Size(36, 36), // 图标尺寸 - // image: 'https://img1.baidu.com/it/u=783564618,4142196075&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500', // Icon的图像 image: `${publicPath}img/icon1.png`, // Icon的图像 imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) const marker = new AMap.Marker({ - zooms: [16, 20], + zooms: [16, 20], // 缩放 position: markerArr.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(3, -30), }) @@ -145,7 +108,6 @@ }) marker.on('click', (e) => { // 打开信息窗口 - // infoWindow.value.setContent(e.target.content) infoWindow.value.open(map.value, e.lnglat) // 初始化信息窗口 windowInfoRef.value.initialize({ @@ -154,6 +116,7 @@ info: markerArrInfo.value[i], }) }) + // 标记点文本标记 marker.setLabel({ offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 content: `
${markerArrInfo.value[i].nodeName}
`, // 设置文本标注内容 @@ -169,12 +132,10 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: markerArr1.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(-20, -20), }) @@ -187,7 +148,6 @@ marker.on('click', (e) => { // 打开信息窗口 infoWindow2.value.open(map.value, e.lnglat) - // infoWindow2.value.setContent(e.target) // 初始化信息窗口 windowInfoRef2.value.initialize({ overlay: e.target, @@ -195,6 +155,7 @@ info: markerArrInfo1.value[i], }) }) + // 标记点的文本 marker.setLabel({ zooms: [16, 20], offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 @@ -249,6 +210,7 @@ zooms: [16, 20], }) + // 离线支路连接添加开关图标 if (child[2] === 0) { const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] const icon = new AMap.Icon({ @@ -257,7 +219,6 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: data, // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] @@ -271,12 +232,6 @@ map.value.add(polyline) }) }) - // 离线支路连接添加开关图标 - // const online = path.map(item => ( - // item.map((child) => { - // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) - // }) - // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/api/api/index.ts b/src/api/api/index.ts index c8f1479..325777a 100644 --- a/src/api/api/index.ts +++ b/src/api/api/index.ts @@ -23,16 +23,17 @@ deviceAdd = '/carbonDevice/add', deviceUpdate = '/carbonDevice/update', deviceDelete = '/carbonDevice/delete', + deviceDetail = '/carbonDevice/detail', // 环境参数 environment = '/environmentInfo/listPage', environmentAdd = '/environmentInfo/add', environmentUpdate = '/environmentInfo/update', environmentDelete = '/environmentInfo/delete', // 用热监测/用气监测 - carbonOtherMonitorAdd = '/carbonOtherMonitor/add', - carbonOtherMonitorUpdate = '/carbonOtherMonitor/update', - carbonOtherMonitorDelete = '/carbonOtherMonitor/delete', - carbonOtherMonitor = '/carbonOtherMonitor/listPage', + carbonOtherMonitorAdd = '/deviceCollectionLog/add', + carbonOtherMonitorUpdate = '/deviceCollectionLog/update', + carbonOtherMonitorDelete = '/deviceCollectionLog/delete', + carbonOtherMonitor = '/deviceCollectionLog/listPage', } // 上传 export function uploadApi(data: FormData) { @@ -254,6 +255,21 @@ method: 'post', }) } +// 获取设备详情 +export function getDeviceDetail(id: any) { + return request({ + url: `${api.deviceDetail}?id=${id}`, + method: 'get', + }) +} +// 设备监测趋势分析 +export function getDeviceDetailAnalysis(params: object) { + return request({ + url: '/deviceCollectionLog/detailAnalysis', + method: 'get', + params, + }) +} // 环境参数列表 export function getEnvironmentList(params: any) { return request({ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index 62e9a5a..15929df 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -78,62 +78,25 @@ map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 - // center: markerArr.value[0], center: [111.765785, 40.718114], - // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) // 图层实例 layer.value = new AMap.TileLayer.Satellite() - // 绑定右击时间 + // 地图绑定右击事件 map.value.on('mousedown', clickHandler) - // 用来画区域的 - // polygon.value = new AMap.Polygon({ - // map: map.value, - // fillOpacity: 0.2, - // path: pathArr.value, // 区域数组 - // }) - // 画图工具 - // mouseTool.value = new AMap.MouseTool(map.value) - // mouseTool.value.rectangle({ - // strokeColor: '#1E9FFF', - // strokeWeight: 2, - // strokeStyle: 'dashed', - // strokeOpacity: 1, - // fillOpacity: 0.1, - // fillColor: '#1E9FFF', - // // zIndex: 50, - // // 同Polygon的Option设置 - // }) - // var overlays = [] - // 监听draw事件可获取画好的覆盖物 - // mouseTool.value.on('draw', (e) => { - // // 绘制多边形; - // overlays.push(e.obj) - // // 获取坐标; - // console.log(e.obj.getPath()) - // // 格式化坐标; - // var polyPoints = e.obj.getPath() - // var arr = '' - // for (var i = 0; i < polyPoints.length; i++) { - // arr += `${polyPoints[i].lng},${polyPoints[i].lat};` - // } - // console.log(arr)// 121.540994,29.870174;121.55138,29.858116;121.55756,29.874193; - // }) // 电网支路标记点绘制 for (let i = 0; i < markerArr.value.length; i++) { const icon = new AMap.Icon({ size: new AMap.Size(36, 36), // 图标尺寸 - // image: 'https://img1.baidu.com/it/u=783564618,4142196075&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500', // Icon的图像 image: `${publicPath}img/icon1.png`, // Icon的图像 imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) const marker = new AMap.Marker({ - zooms: [16, 20], + zooms: [16, 20], // 缩放 position: markerArr.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(3, -30), }) @@ -145,7 +108,6 @@ }) marker.on('click', (e) => { // 打开信息窗口 - // infoWindow.value.setContent(e.target.content) infoWindow.value.open(map.value, e.lnglat) // 初始化信息窗口 windowInfoRef.value.initialize({ @@ -154,6 +116,7 @@ info: markerArrInfo.value[i], }) }) + // 标记点文本标记 marker.setLabel({ offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 content: `
${markerArrInfo.value[i].nodeName}
`, // 设置文本标注内容 @@ -169,12 +132,10 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: markerArr1.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(-20, -20), }) @@ -187,7 +148,6 @@ marker.on('click', (e) => { // 打开信息窗口 infoWindow2.value.open(map.value, e.lnglat) - // infoWindow2.value.setContent(e.target) // 初始化信息窗口 windowInfoRef2.value.initialize({ overlay: e.target, @@ -195,6 +155,7 @@ info: markerArrInfo1.value[i], }) }) + // 标记点的文本 marker.setLabel({ zooms: [16, 20], offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 @@ -249,6 +210,7 @@ zooms: [16, 20], }) + // 离线支路连接添加开关图标 if (child[2] === 0) { const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] const icon = new AMap.Icon({ @@ -257,7 +219,6 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: data, // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] @@ -271,12 +232,6 @@ map.value.add(polyline) }) }) - // 离线支路连接添加开关图标 - // const online = path.map(item => ( - // item.map((child) => { - // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) - // }) - // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/data.ts b/src/router/modules/data.ts index 2c5a8fb..b7ce1e6 100644 --- a/src/router/modules/data.ts +++ b/src/router/modules/data.ts @@ -164,6 +164,33 @@ }, ], }, + { + path: '/dataDetail', + component: Layout, + redirect: '/dataDetail/detail', + name: 'DdeviceDetail', + meta: { + title: '详情分析', + icon: 'ep:key', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + }, + children: [ + { + path: 'detail', + name: 'Detail', + component: () => import('@/views/data/device/detail.vue'), + meta: { + title: '详情分析', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + activeMenu: '/dataDevice', + }, + }, + ], + }, ], }, ] diff --git a/src/api/api/index.ts b/src/api/api/index.ts index c8f1479..325777a 100644 --- a/src/api/api/index.ts +++ b/src/api/api/index.ts @@ -23,16 +23,17 @@ deviceAdd = '/carbonDevice/add', deviceUpdate = '/carbonDevice/update', deviceDelete = '/carbonDevice/delete', + deviceDetail = '/carbonDevice/detail', // 环境参数 environment = '/environmentInfo/listPage', environmentAdd = '/environmentInfo/add', environmentUpdate = '/environmentInfo/update', environmentDelete = '/environmentInfo/delete', // 用热监测/用气监测 - carbonOtherMonitorAdd = '/carbonOtherMonitor/add', - carbonOtherMonitorUpdate = '/carbonOtherMonitor/update', - carbonOtherMonitorDelete = '/carbonOtherMonitor/delete', - carbonOtherMonitor = '/carbonOtherMonitor/listPage', + carbonOtherMonitorAdd = '/deviceCollectionLog/add', + carbonOtherMonitorUpdate = '/deviceCollectionLog/update', + carbonOtherMonitorDelete = '/deviceCollectionLog/delete', + carbonOtherMonitor = '/deviceCollectionLog/listPage', } // 上传 export function uploadApi(data: FormData) { @@ -254,6 +255,21 @@ method: 'post', }) } +// 获取设备详情 +export function getDeviceDetail(id: any) { + return request({ + url: `${api.deviceDetail}?id=${id}`, + method: 'get', + }) +} +// 设备监测趋势分析 +export function getDeviceDetailAnalysis(params: object) { + return request({ + url: '/deviceCollectionLog/detailAnalysis', + method: 'get', + params, + }) +} // 环境参数列表 export function getEnvironmentList(params: any) { return request({ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index 62e9a5a..15929df 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -78,62 +78,25 @@ map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 - // center: markerArr.value[0], center: [111.765785, 40.718114], - // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) // 图层实例 layer.value = new AMap.TileLayer.Satellite() - // 绑定右击时间 + // 地图绑定右击事件 map.value.on('mousedown', clickHandler) - // 用来画区域的 - // polygon.value = new AMap.Polygon({ - // map: map.value, - // fillOpacity: 0.2, - // path: pathArr.value, // 区域数组 - // }) - // 画图工具 - // mouseTool.value = new AMap.MouseTool(map.value) - // mouseTool.value.rectangle({ - // strokeColor: '#1E9FFF', - // strokeWeight: 2, - // strokeStyle: 'dashed', - // strokeOpacity: 1, - // fillOpacity: 0.1, - // fillColor: '#1E9FFF', - // // zIndex: 50, - // // 同Polygon的Option设置 - // }) - // var overlays = [] - // 监听draw事件可获取画好的覆盖物 - // mouseTool.value.on('draw', (e) => { - // // 绘制多边形; - // overlays.push(e.obj) - // // 获取坐标; - // console.log(e.obj.getPath()) - // // 格式化坐标; - // var polyPoints = e.obj.getPath() - // var arr = '' - // for (var i = 0; i < polyPoints.length; i++) { - // arr += `${polyPoints[i].lng},${polyPoints[i].lat};` - // } - // console.log(arr)// 121.540994,29.870174;121.55138,29.858116;121.55756,29.874193; - // }) // 电网支路标记点绘制 for (let i = 0; i < markerArr.value.length; i++) { const icon = new AMap.Icon({ size: new AMap.Size(36, 36), // 图标尺寸 - // image: 'https://img1.baidu.com/it/u=783564618,4142196075&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500', // Icon的图像 image: `${publicPath}img/icon1.png`, // Icon的图像 imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) const marker = new AMap.Marker({ - zooms: [16, 20], + zooms: [16, 20], // 缩放 position: markerArr.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(3, -30), }) @@ -145,7 +108,6 @@ }) marker.on('click', (e) => { // 打开信息窗口 - // infoWindow.value.setContent(e.target.content) infoWindow.value.open(map.value, e.lnglat) // 初始化信息窗口 windowInfoRef.value.initialize({ @@ -154,6 +116,7 @@ info: markerArrInfo.value[i], }) }) + // 标记点文本标记 marker.setLabel({ offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 content: `
${markerArrInfo.value[i].nodeName}
`, // 设置文本标注内容 @@ -169,12 +132,10 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: markerArr1.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(-20, -20), }) @@ -187,7 +148,6 @@ marker.on('click', (e) => { // 打开信息窗口 infoWindow2.value.open(map.value, e.lnglat) - // infoWindow2.value.setContent(e.target) // 初始化信息窗口 windowInfoRef2.value.initialize({ overlay: e.target, @@ -195,6 +155,7 @@ info: markerArrInfo1.value[i], }) }) + // 标记点的文本 marker.setLabel({ zooms: [16, 20], offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 @@ -249,6 +210,7 @@ zooms: [16, 20], }) + // 离线支路连接添加开关图标 if (child[2] === 0) { const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] const icon = new AMap.Icon({ @@ -257,7 +219,6 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: data, // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] @@ -271,12 +232,6 @@ map.value.add(polyline) }) }) - // 离线支路连接添加开关图标 - // const online = path.map(item => ( - // item.map((child) => { - // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) - // }) - // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/data.ts b/src/router/modules/data.ts index 2c5a8fb..b7ce1e6 100644 --- a/src/router/modules/data.ts +++ b/src/router/modules/data.ts @@ -164,6 +164,33 @@ }, ], }, + { + path: '/dataDetail', + component: Layout, + redirect: '/dataDetail/detail', + name: 'DdeviceDetail', + meta: { + title: '详情分析', + icon: 'ep:key', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + }, + children: [ + { + path: 'detail', + name: 'Detail', + component: () => import('@/views/data/device/detail.vue'), + meta: { + title: '详情分析', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + activeMenu: '/dataDevice', + }, + }, + ], + }, ], }, ] diff --git a/src/router/routes.ts b/src/router/routes.ts index 72912ec..9f10482 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -8,7 +8,7 @@ import evaluateRoute from './modules/carbonEvaluate' import warningRoute from './modules/carbonWarning' import dashboard from './modules/dashboard' -import electricityRoute from './modules/electricity' +// import electricityRoute from './modules/electricity' import countRoute from './modules/carbonCount' import type { Route } from '@/global' import useSettingsStore from '@/store/modules/settings' @@ -182,16 +182,16 @@ ...countRoute, ], }, - { - meta: { - title: '电网管理', - icon: '', - auth: '/electricity', - }, - children: [ - ...electricityRoute, - ], - }, + // { + // meta: { + // title: '电网管理', + // icon: '', + // auth: '/electricity', + // }, + // children: [ + // ...electricityRoute, + // ], + // }, { meta: { title: '数据管理', diff --git a/src/api/api/index.ts b/src/api/api/index.ts index c8f1479..325777a 100644 --- a/src/api/api/index.ts +++ b/src/api/api/index.ts @@ -23,16 +23,17 @@ deviceAdd = '/carbonDevice/add', deviceUpdate = '/carbonDevice/update', deviceDelete = '/carbonDevice/delete', + deviceDetail = '/carbonDevice/detail', // 环境参数 environment = '/environmentInfo/listPage', environmentAdd = '/environmentInfo/add', environmentUpdate = '/environmentInfo/update', environmentDelete = '/environmentInfo/delete', // 用热监测/用气监测 - carbonOtherMonitorAdd = '/carbonOtherMonitor/add', - carbonOtherMonitorUpdate = '/carbonOtherMonitor/update', - carbonOtherMonitorDelete = '/carbonOtherMonitor/delete', - carbonOtherMonitor = '/carbonOtherMonitor/listPage', + carbonOtherMonitorAdd = '/deviceCollectionLog/add', + carbonOtherMonitorUpdate = '/deviceCollectionLog/update', + carbonOtherMonitorDelete = '/deviceCollectionLog/delete', + carbonOtherMonitor = '/deviceCollectionLog/listPage', } // 上传 export function uploadApi(data: FormData) { @@ -254,6 +255,21 @@ method: 'post', }) } +// 获取设备详情 +export function getDeviceDetail(id: any) { + return request({ + url: `${api.deviceDetail}?id=${id}`, + method: 'get', + }) +} +// 设备监测趋势分析 +export function getDeviceDetailAnalysis(params: object) { + return request({ + url: '/deviceCollectionLog/detailAnalysis', + method: 'get', + params, + }) +} // 环境参数列表 export function getEnvironmentList(params: any) { return request({ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index 62e9a5a..15929df 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -78,62 +78,25 @@ map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 - // center: markerArr.value[0], center: [111.765785, 40.718114], - // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) // 图层实例 layer.value = new AMap.TileLayer.Satellite() - // 绑定右击时间 + // 地图绑定右击事件 map.value.on('mousedown', clickHandler) - // 用来画区域的 - // polygon.value = new AMap.Polygon({ - // map: map.value, - // fillOpacity: 0.2, - // path: pathArr.value, // 区域数组 - // }) - // 画图工具 - // mouseTool.value = new AMap.MouseTool(map.value) - // mouseTool.value.rectangle({ - // strokeColor: '#1E9FFF', - // strokeWeight: 2, - // strokeStyle: 'dashed', - // strokeOpacity: 1, - // fillOpacity: 0.1, - // fillColor: '#1E9FFF', - // // zIndex: 50, - // // 同Polygon的Option设置 - // }) - // var overlays = [] - // 监听draw事件可获取画好的覆盖物 - // mouseTool.value.on('draw', (e) => { - // // 绘制多边形; - // overlays.push(e.obj) - // // 获取坐标; - // console.log(e.obj.getPath()) - // // 格式化坐标; - // var polyPoints = e.obj.getPath() - // var arr = '' - // for (var i = 0; i < polyPoints.length; i++) { - // arr += `${polyPoints[i].lng},${polyPoints[i].lat};` - // } - // console.log(arr)// 121.540994,29.870174;121.55138,29.858116;121.55756,29.874193; - // }) // 电网支路标记点绘制 for (let i = 0; i < markerArr.value.length; i++) { const icon = new AMap.Icon({ size: new AMap.Size(36, 36), // 图标尺寸 - // image: 'https://img1.baidu.com/it/u=783564618,4142196075&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500', // Icon的图像 image: `${publicPath}img/icon1.png`, // Icon的图像 imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) const marker = new AMap.Marker({ - zooms: [16, 20], + zooms: [16, 20], // 缩放 position: markerArr.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(3, -30), }) @@ -145,7 +108,6 @@ }) marker.on('click', (e) => { // 打开信息窗口 - // infoWindow.value.setContent(e.target.content) infoWindow.value.open(map.value, e.lnglat) // 初始化信息窗口 windowInfoRef.value.initialize({ @@ -154,6 +116,7 @@ info: markerArrInfo.value[i], }) }) + // 标记点文本标记 marker.setLabel({ offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 content: `
${markerArrInfo.value[i].nodeName}
`, // 设置文本标注内容 @@ -169,12 +132,10 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: markerArr1.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(-20, -20), }) @@ -187,7 +148,6 @@ marker.on('click', (e) => { // 打开信息窗口 infoWindow2.value.open(map.value, e.lnglat) - // infoWindow2.value.setContent(e.target) // 初始化信息窗口 windowInfoRef2.value.initialize({ overlay: e.target, @@ -195,6 +155,7 @@ info: markerArrInfo1.value[i], }) }) + // 标记点的文本 marker.setLabel({ zooms: [16, 20], offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 @@ -249,6 +210,7 @@ zooms: [16, 20], }) + // 离线支路连接添加开关图标 if (child[2] === 0) { const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] const icon = new AMap.Icon({ @@ -257,7 +219,6 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: data, // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] @@ -271,12 +232,6 @@ map.value.add(polyline) }) }) - // 离线支路连接添加开关图标 - // const online = path.map(item => ( - // item.map((child) => { - // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) - // }) - // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/data.ts b/src/router/modules/data.ts index 2c5a8fb..b7ce1e6 100644 --- a/src/router/modules/data.ts +++ b/src/router/modules/data.ts @@ -164,6 +164,33 @@ }, ], }, + { + path: '/dataDetail', + component: Layout, + redirect: '/dataDetail/detail', + name: 'DdeviceDetail', + meta: { + title: '详情分析', + icon: 'ep:key', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + }, + children: [ + { + path: 'detail', + name: 'Detail', + component: () => import('@/views/data/device/detail.vue'), + meta: { + title: '详情分析', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + activeMenu: '/dataDevice', + }, + }, + ], + }, ], }, ] diff --git a/src/router/routes.ts b/src/router/routes.ts index 72912ec..9f10482 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -8,7 +8,7 @@ import evaluateRoute from './modules/carbonEvaluate' import warningRoute from './modules/carbonWarning' import dashboard from './modules/dashboard' -import electricityRoute from './modules/electricity' +// import electricityRoute from './modules/electricity' import countRoute from './modules/carbonCount' import type { Route } from '@/global' import useSettingsStore from '@/store/modules/settings' @@ -182,16 +182,16 @@ ...countRoute, ], }, - { - meta: { - title: '电网管理', - icon: '', - auth: '/electricity', - }, - children: [ - ...electricityRoute, - ], - }, + // { + // meta: { + // title: '电网管理', + // icon: '', + // auth: '/electricity', + // }, + // children: [ + // ...electricityRoute, + // ], + // }, { meta: { title: '数据管理', diff --git a/src/views/data/consumption/index.vue b/src/views/data/consumption/index.vue index ab3b507..49d7a3c 100644 --- a/src/views/data/consumption/index.vue +++ b/src/views/data/consumption/index.vue @@ -2,23 +2,24 @@ diff --git a/src/api/api/index.ts b/src/api/api/index.ts index c8f1479..325777a 100644 --- a/src/api/api/index.ts +++ b/src/api/api/index.ts @@ -23,16 +23,17 @@ deviceAdd = '/carbonDevice/add', deviceUpdate = '/carbonDevice/update', deviceDelete = '/carbonDevice/delete', + deviceDetail = '/carbonDevice/detail', // 环境参数 environment = '/environmentInfo/listPage', environmentAdd = '/environmentInfo/add', environmentUpdate = '/environmentInfo/update', environmentDelete = '/environmentInfo/delete', // 用热监测/用气监测 - carbonOtherMonitorAdd = '/carbonOtherMonitor/add', - carbonOtherMonitorUpdate = '/carbonOtherMonitor/update', - carbonOtherMonitorDelete = '/carbonOtherMonitor/delete', - carbonOtherMonitor = '/carbonOtherMonitor/listPage', + carbonOtherMonitorAdd = '/deviceCollectionLog/add', + carbonOtherMonitorUpdate = '/deviceCollectionLog/update', + carbonOtherMonitorDelete = '/deviceCollectionLog/delete', + carbonOtherMonitor = '/deviceCollectionLog/listPage', } // 上传 export function uploadApi(data: FormData) { @@ -254,6 +255,21 @@ method: 'post', }) } +// 获取设备详情 +export function getDeviceDetail(id: any) { + return request({ + url: `${api.deviceDetail}?id=${id}`, + method: 'get', + }) +} +// 设备监测趋势分析 +export function getDeviceDetailAnalysis(params: object) { + return request({ + url: '/deviceCollectionLog/detailAnalysis', + method: 'get', + params, + }) +} // 环境参数列表 export function getEnvironmentList(params: any) { return request({ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index 62e9a5a..15929df 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -78,62 +78,25 @@ map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 - // center: markerArr.value[0], center: [111.765785, 40.718114], - // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) // 图层实例 layer.value = new AMap.TileLayer.Satellite() - // 绑定右击时间 + // 地图绑定右击事件 map.value.on('mousedown', clickHandler) - // 用来画区域的 - // polygon.value = new AMap.Polygon({ - // map: map.value, - // fillOpacity: 0.2, - // path: pathArr.value, // 区域数组 - // }) - // 画图工具 - // mouseTool.value = new AMap.MouseTool(map.value) - // mouseTool.value.rectangle({ - // strokeColor: '#1E9FFF', - // strokeWeight: 2, - // strokeStyle: 'dashed', - // strokeOpacity: 1, - // fillOpacity: 0.1, - // fillColor: '#1E9FFF', - // // zIndex: 50, - // // 同Polygon的Option设置 - // }) - // var overlays = [] - // 监听draw事件可获取画好的覆盖物 - // mouseTool.value.on('draw', (e) => { - // // 绘制多边形; - // overlays.push(e.obj) - // // 获取坐标; - // console.log(e.obj.getPath()) - // // 格式化坐标; - // var polyPoints = e.obj.getPath() - // var arr = '' - // for (var i = 0; i < polyPoints.length; i++) { - // arr += `${polyPoints[i].lng},${polyPoints[i].lat};` - // } - // console.log(arr)// 121.540994,29.870174;121.55138,29.858116;121.55756,29.874193; - // }) // 电网支路标记点绘制 for (let i = 0; i < markerArr.value.length; i++) { const icon = new AMap.Icon({ size: new AMap.Size(36, 36), // 图标尺寸 - // image: 'https://img1.baidu.com/it/u=783564618,4142196075&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500', // Icon的图像 image: `${publicPath}img/icon1.png`, // Icon的图像 imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) const marker = new AMap.Marker({ - zooms: [16, 20], + zooms: [16, 20], // 缩放 position: markerArr.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(3, -30), }) @@ -145,7 +108,6 @@ }) marker.on('click', (e) => { // 打开信息窗口 - // infoWindow.value.setContent(e.target.content) infoWindow.value.open(map.value, e.lnglat) // 初始化信息窗口 windowInfoRef.value.initialize({ @@ -154,6 +116,7 @@ info: markerArrInfo.value[i], }) }) + // 标记点文本标记 marker.setLabel({ offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 content: `
${markerArrInfo.value[i].nodeName}
`, // 设置文本标注内容 @@ -169,12 +132,10 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: markerArr1.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(-20, -20), }) @@ -187,7 +148,6 @@ marker.on('click', (e) => { // 打开信息窗口 infoWindow2.value.open(map.value, e.lnglat) - // infoWindow2.value.setContent(e.target) // 初始化信息窗口 windowInfoRef2.value.initialize({ overlay: e.target, @@ -195,6 +155,7 @@ info: markerArrInfo1.value[i], }) }) + // 标记点的文本 marker.setLabel({ zooms: [16, 20], offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 @@ -249,6 +210,7 @@ zooms: [16, 20], }) + // 离线支路连接添加开关图标 if (child[2] === 0) { const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] const icon = new AMap.Icon({ @@ -257,7 +219,6 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: data, // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] @@ -271,12 +232,6 @@ map.value.add(polyline) }) }) - // 离线支路连接添加开关图标 - // const online = path.map(item => ( - // item.map((child) => { - // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) - // }) - // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/data.ts b/src/router/modules/data.ts index 2c5a8fb..b7ce1e6 100644 --- a/src/router/modules/data.ts +++ b/src/router/modules/data.ts @@ -164,6 +164,33 @@ }, ], }, + { + path: '/dataDetail', + component: Layout, + redirect: '/dataDetail/detail', + name: 'DdeviceDetail', + meta: { + title: '详情分析', + icon: 'ep:key', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + }, + children: [ + { + path: 'detail', + name: 'Detail', + component: () => import('@/views/data/device/detail.vue'), + meta: { + title: '详情分析', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + activeMenu: '/dataDevice', + }, + }, + ], + }, ], }, ] diff --git a/src/router/routes.ts b/src/router/routes.ts index 72912ec..9f10482 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -8,7 +8,7 @@ import evaluateRoute from './modules/carbonEvaluate' import warningRoute from './modules/carbonWarning' import dashboard from './modules/dashboard' -import electricityRoute from './modules/electricity' +// import electricityRoute from './modules/electricity' import countRoute from './modules/carbonCount' import type { Route } from '@/global' import useSettingsStore from '@/store/modules/settings' @@ -182,16 +182,16 @@ ...countRoute, ], }, - { - meta: { - title: '电网管理', - icon: '', - auth: '/electricity', - }, - children: [ - ...electricityRoute, - ], - }, + // { + // meta: { + // title: '电网管理', + // icon: '', + // auth: '/electricity', + // }, + // children: [ + // ...electricityRoute, + // ], + // }, { meta: { title: '数据管理', diff --git a/src/views/data/consumption/index.vue b/src/views/data/consumption/index.vue index ab3b507..49d7a3c 100644 --- a/src/views/data/consumption/index.vue +++ b/src/views/data/consumption/index.vue @@ -2,23 +2,24 @@ diff --git a/src/views/data/device/detail.vue b/src/views/data/device/detail.vue new file mode 100644 index 0000000..0294709 --- /dev/null +++ b/src/views/data/device/detail.vue @@ -0,0 +1,126 @@ + + + + diff --git a/src/api/api/index.ts b/src/api/api/index.ts index c8f1479..325777a 100644 --- a/src/api/api/index.ts +++ b/src/api/api/index.ts @@ -23,16 +23,17 @@ deviceAdd = '/carbonDevice/add', deviceUpdate = '/carbonDevice/update', deviceDelete = '/carbonDevice/delete', + deviceDetail = '/carbonDevice/detail', // 环境参数 environment = '/environmentInfo/listPage', environmentAdd = '/environmentInfo/add', environmentUpdate = '/environmentInfo/update', environmentDelete = '/environmentInfo/delete', // 用热监测/用气监测 - carbonOtherMonitorAdd = '/carbonOtherMonitor/add', - carbonOtherMonitorUpdate = '/carbonOtherMonitor/update', - carbonOtherMonitorDelete = '/carbonOtherMonitor/delete', - carbonOtherMonitor = '/carbonOtherMonitor/listPage', + carbonOtherMonitorAdd = '/deviceCollectionLog/add', + carbonOtherMonitorUpdate = '/deviceCollectionLog/update', + carbonOtherMonitorDelete = '/deviceCollectionLog/delete', + carbonOtherMonitor = '/deviceCollectionLog/listPage', } // 上传 export function uploadApi(data: FormData) { @@ -254,6 +255,21 @@ method: 'post', }) } +// 获取设备详情 +export function getDeviceDetail(id: any) { + return request({ + url: `${api.deviceDetail}?id=${id}`, + method: 'get', + }) +} +// 设备监测趋势分析 +export function getDeviceDetailAnalysis(params: object) { + return request({ + url: '/deviceCollectionLog/detailAnalysis', + method: 'get', + params, + }) +} // 环境参数列表 export function getEnvironmentList(params: any) { return request({ diff --git a/src/components/map/index.vue b/src/components/map/index.vue index 62e9a5a..15929df 100644 --- a/src/components/map/index.vue +++ b/src/components/map/index.vue @@ -78,62 +78,25 @@ map.value = new AMap.Map('map', { viewMode: '3D', // 是否为3D地图模式 zoom: 17, // 初始化地图级别 - // center: markerArr.value[0], center: [111.765785, 40.718114], - // layers: [new AMap.TileLayer.Satellite(), new AMap.TileLayer()], resizeEnable: true, }) // 图层实例 layer.value = new AMap.TileLayer.Satellite() - // 绑定右击时间 + // 地图绑定右击事件 map.value.on('mousedown', clickHandler) - // 用来画区域的 - // polygon.value = new AMap.Polygon({ - // map: map.value, - // fillOpacity: 0.2, - // path: pathArr.value, // 区域数组 - // }) - // 画图工具 - // mouseTool.value = new AMap.MouseTool(map.value) - // mouseTool.value.rectangle({ - // strokeColor: '#1E9FFF', - // strokeWeight: 2, - // strokeStyle: 'dashed', - // strokeOpacity: 1, - // fillOpacity: 0.1, - // fillColor: '#1E9FFF', - // // zIndex: 50, - // // 同Polygon的Option设置 - // }) - // var overlays = [] - // 监听draw事件可获取画好的覆盖物 - // mouseTool.value.on('draw', (e) => { - // // 绘制多边形; - // overlays.push(e.obj) - // // 获取坐标; - // console.log(e.obj.getPath()) - // // 格式化坐标; - // var polyPoints = e.obj.getPath() - // var arr = '' - // for (var i = 0; i < polyPoints.length; i++) { - // arr += `${polyPoints[i].lng},${polyPoints[i].lat};` - // } - // console.log(arr)// 121.540994,29.870174;121.55138,29.858116;121.55756,29.874193; - // }) // 电网支路标记点绘制 for (let i = 0; i < markerArr.value.length; i++) { const icon = new AMap.Icon({ size: new AMap.Size(36, 36), // 图标尺寸 - // image: 'https://img1.baidu.com/it/u=783564618,4142196075&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500', // Icon的图像 image: `${publicPath}img/icon1.png`, // Icon的图像 imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) const marker = new AMap.Marker({ - zooms: [16, 20], + zooms: [16, 20], // 缩放 position: markerArr.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(3, -30), }) @@ -145,7 +108,6 @@ }) marker.on('click', (e) => { // 打开信息窗口 - // infoWindow.value.setContent(e.target.content) infoWindow.value.open(map.value, e.lnglat) // 初始化信息窗口 windowInfoRef.value.initialize({ @@ -154,6 +116,7 @@ info: markerArrInfo.value[i], }) }) + // 标记点文本标记 marker.setLabel({ offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 content: `
${markerArrInfo.value[i].nodeName}
`, // 设置文本标注内容 @@ -169,12 +132,10 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: markerArr1.value[i], // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] map: map.value, - title: '测试坐标', icon, offset: new AMap.Pixel(-20, -20), }) @@ -187,7 +148,6 @@ marker.on('click', (e) => { // 打开信息窗口 infoWindow2.value.open(map.value, e.lnglat) - // infoWindow2.value.setContent(e.target) // 初始化信息窗口 windowInfoRef2.value.initialize({ overlay: e.target, @@ -195,6 +155,7 @@ info: markerArrInfo1.value[i], }) }) + // 标记点的文本 marker.setLabel({ zooms: [16, 20], offset: new AMap.Pixel(-10, -2), // 设置文本标注偏移量 @@ -249,6 +210,7 @@ zooms: [16, 20], }) + // 离线支路连接添加开关图标 if (child[2] === 0) { const data = [(Number(child[0][0]) + Number(child[1][0])) / 2, (Number(child[0][1]) + Number(child[1][1])) / 2] const icon = new AMap.Icon({ @@ -257,7 +219,6 @@ imageSize: new AMap.Size(24, 30), // 根据所设置的大小拉伸或压缩图片 imageOffset: new AMap.Pixel(0, 0), // 图像相对展示区域的偏移量，适于雪碧图等 }) - // const content = '
111
' const marker = new AMap.Marker({ zooms: [16, 20], position: data, // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9] @@ -271,12 +232,6 @@ map.value.add(polyline) }) }) - // 离线支路连接添加开关图标 - // const online = path.map(item => ( - // item.map((child) => { - // return ([[(Number(child.flng) + Number(child.tlng)) / 2, (Number(child.flat) + Number(child.tlat)) / 2], child.status2]) - // }) - // )) // 添加支路折线文本 // 创建纯文本标记 // const textArr = path.map(item => ( diff --git a/src/router/modules/data.ts b/src/router/modules/data.ts index 2c5a8fb..b7ce1e6 100644 --- a/src/router/modules/data.ts +++ b/src/router/modules/data.ts @@ -164,6 +164,33 @@ }, ], }, + { + path: '/dataDetail', + component: Layout, + redirect: '/dataDetail/detail', + name: 'DdeviceDetail', + meta: { + title: '详情分析', + icon: 'ep:key', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + }, + children: [ + { + path: 'detail', + name: 'Detail', + component: () => import('@/views/data/device/detail.vue'), + meta: { + title: '详情分析', + auth: '/data/device', + sidebar: false, + breadcrumb: false, + activeMenu: '/dataDevice', + }, + }, + ], + }, ], }, ] diff --git a/src/router/routes.ts b/src/router/routes.ts index 72912ec..9f10482 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -8,7 +8,7 @@ import evaluateRoute from './modules/carbonEvaluate' import warningRoute from './modules/carbonWarning' import dashboard from './modules/dashboard' -import electricityRoute from './modules/electricity' +// import electricityRoute from './modules/electricity' import countRoute from './modules/carbonCount' import type { Route } from '@/global' import useSettingsStore from '@/store/modules/settings' @@ -182,16 +182,16 @@ ...countRoute, ], }, - { - meta: { - title: '电网管理', - icon: '', - auth: '/electricity', - }, - children: [ - ...electricityRoute, - ], - }, + // { + // meta: { + // title: '电网管理', + // icon: '', + // auth: '/electricity', + // }, + // children: [ + // ...electricityRoute, + // ], + // }, { meta: { title: '数据管理', diff --git a/src/views/data/consumption/index.vue b/src/views/data/consumption/index.vue index ab3b507..49d7a3c 100644 --- a/src/views/data/consumption/index.vue +++ b/src/views/data/consumption/index.vue @@ -2,23 +2,24 @@ diff --git a/src/views/data/device/detail.vue b/src/views/data/device/detail.vue new file mode 100644 index 0000000..0294709 --- /dev/null +++ b/src/views/data/device/detail.vue @@ -0,0 +1,126 @@ + + + + diff --git a/src/views/data/device/index.vue b/src/views/data/device/index.vue index ca42d00..639b6d0 100644 --- a/src/views/data/device/index.vue +++ b/src/views/data/device/index.vue @@ -4,6 +4,7 @@ import editList from './pageAdd.vue' import { deleteDeviceList, getDeviceList } from '@/api/api/index' import { getDictByCode } from '@/api/system/dict' +const $router = useRouter() // 查询参数 const searchQuery = reactive({ offset: 1, @@ -90,6 +91,16 @@ .catch(() => { }) } +// 详情分析 +const detail = (row: any) => { + console.log(row, '设备信息') + $router.push({ + name: 'DdeviceDetail', + query: { + id: row.id, + }, + }) +} // 重置 const reset = () => { searchQuery.deviceType = '' @@ -120,27 +131,18 @@