Skip to content

D
device-new-platform
Commit 2c8afda2 authored by 赵啸非's avatar 赵啸非
Browse files
Options

地图详细显示

parent 2418c3c5
Hide whitespace changes
Inline Side-by-side
Showing with 397 additions and 118 deletions
device-manager-ui/admin/src/components/Map.vue
View file @ 2c8afda2
......@@ -18,33 +18,95 @@
<el-amap-marker
v-for="(marker, index) in markers"
:key="'marker' + index"
:events="events"
:events="marker.events"
:position="marker.position"
:label="marker.label"
:icon="marker.icon"
:extData="marker.extData"
:extData="marker"
>
</el-amap-marker>
<!-- 标记 -->
<!-- <el-amap-marker v-for="(marker, index) in markers" :position="marker" :key="index"></el-amap-marker> -->
<!-- <el-amap-marker v-for="(marker, index) in markers" :key="index" :position="marker.position">
<div class='map-marker'>
<img src="../assets/images/ego_box_img_normal.png" alt="">
<p>
<el-tag type='danger'>1231</el-tag>
</p>
</div>
</el-amap-marker> -->
<!--信息窗体-->
<el-amap-info-window
:position="window.position"
:visible="window.visible"
:content="window.content"
><el-row :body-style="{ padding: '0px' }">
<el-row type="flex" justify="space-between">
<span style="font-size: 18px"
><b>{{ info.siteName }}</b></span
>
<el-button
type="text"
size="mini"
@click="getDeviceDetial"
class="button"
>查看详情</el-button
>
</el-row>
<el-divider></el-divider>
<el-row type="flex" justify="space-around">
<el-col :span="4">
<span style="font-size: 13px"
><b>{{ info.deviceTotal }}</b></span
><br />
<span style="font-size: 12px">设备总数</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"
><b style="color: green">{{ info.onlineCount }}</b></span
><br />
<span style="font-size: 12px">在线</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"
><b style="color: red">{{ info.offlineCount }}</b></span
><br />
<span style="font-size: 12px">离线</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"
><b style="color: orange">{{ info.stopCount }}</b></span
><br />
<span style="font-size: 12px">停用</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"
><b style="color: grey">{{ info.unActiveCount }}</b></span
><br />
<span style="font-size: 12px">待激活</span>
</el-col>
</el-row>
<el-divider></el-divider>
<el-descriptions :column="1" size="small">
<el-descriptions-item label="站点编码">{{
info.siteCode
}}</el-descriptions-item>
<el-descriptions-item label="站点地址">{{
info.address
}}</el-descriptions-item>
<el-descriptions-item
label="联系人"
:labelStyle="{ 'text-align': 'right', width: '50px' }"
>{{ info.leadingOfficial }}</el-descriptions-item
>
<el-descriptions-item label="联系电话">
{{ info.leadingOfficialTelephone }}
</el-descriptions-item>
<el-descriptions-item label="创建时间">{{
formatterDate(info.createTime)
}}</el-descriptions-item>
</el-descriptions>
</el-row></el-amap-info-window
>
</el-amap>
<!-- <div slot="footer" class="dialog-footer">
<el-button size='mini' @click="$emit('input', false)">取 消</el-button>
<el-button size='mini' type="primary" @click="choose">确 定</el-button>
</div> -->
</div>
</template>
<script>
import { formatterDate } from "@/assets/utils/index";
import { AMapManager, lazyAMapApiLoaderInstance } from "vue-amap";
let amapManager = new AMapManager();
......@@ -73,31 +135,55 @@ export default {
},
},
},
created() {
this.refresh( this.markersData)
},
methods: {
formatterDate,
getDeviceDetial(){
//获取设备列表
console.log("device siteId",this.info.siteId)
},
refresh(data) {
console.log("刷新数据", data);
this.markersData = data;
this.markersData.map((item) => {
this.setMarker(item.lng, item.lat, item.address, item.siteId);
// console.log("marker", item);
this.setMarker(item);
});
},
relocate(center){
this.center = [center.lng, center.lat];
this.zoom=12
//重新定位中心点
relocate(center) {
this.center = [center.lng, center.lat];
this.zoom = 10;
//重新定位中心点
},
setMarker(lng, lat, address, siteId) {
if (!lng && !lat) return;
const size = (address || "").length * 5;
setMarker(item) {
if (!item.lng && !item.lat) return;
//console.log("data",formatterDate(item.createTime))
let markerLabel = {
label: { content: address, offset: [30, 70] },
position: [lng, lat],
label: { content: item.siteName, offset: [30, 70] },
position: [item.lng, item.lat],
icon: require("@/assets/images/ego_box_img_normal.png"),
extData: { siteId: siteId },
extData: item,
events: {
click: (e) => {
console.log("getExtData", e.target.getExtData());
let exData = e.target.getExtData();
this.info = exData.extData;
this.window.position = exData.position;
this.$nextTick(() => {
this.window.visible = true; //点击点坐标，出现信息窗体
});
},
},
};
this.markers.push(markerLabel);
......@@ -121,43 +207,87 @@ export default {
},
choose() {
this.$emit("input", false);
this.$emit("choose", JSON.parse(JSON.stringify(this.mapData)));
this.$emit("choose", JSON.parse(JSON.stringify(this.mapData)), (val) => {
//data = val;
console.log("callback:" + val);
});
},
},
data() {
let self = this;
return {
visiblepop: false,
searchEvents: {
init: (e) => {},
},
window: {
position: [104.405994, 30.915378],
visible: false,
content: '<div class="red">Hi! I am here!</div>',
},
mapData: {},
info: {},
markers: [],
geocoder: null,
amapManager,
zoom: 8,
center: [104.007767, 30.568308],
marker: {},
events: {
init: (e) => {
this.geocoder = new AMap.Geocoder();
console.log("markersData", this.markersData);
// this.markersData.map((item) => {
// this.setMarker(item.lng, item.lat, item.address);
// });
},
click: (e) => {
//alert(e.target.getExtData().siteId);
this.$emit("choose", e.target.getExtData().siteId);
// const { lat, lng } = e.lnglat;
// this.geocoder.getAddress([lng, lat], (status, result) => {
// if (status === "complete" && result.info === "OK") {
// const address = result.regeocode.formattedAddress;
// this.setMarker(lng, lat, address);
// this.center = [lng, lat];
// }
// });
},
},
// events: {
// init: (e) => {
// this.geocoder = new AMap.Geocoder();
// console.log("markersData", this.markersData);
// // this.markersData.map((item) => {
// // this.setMarker(item.lng, item.lat, item.address);
// // });
// },
// click: (e) => {
// console.log(e);
// self.window.position = [e.lnglat.lng, e.lnglat.lat];
// self.window.content=` <el-card :body-style="{ padding: '0px' }">
// <img src="https://shadow.elemecdn.com/app/element/hamburger.9cf7b091-55e9-11e9-a976-7f4d0b07eef6.png" class="image">
// <div style="padding: 14px;">
// <span>好吃的汉堡</span>
// <div class="bottom clearfix">
// <time class="time">{{ currentDate }}</time>
// <el-button type="text" class="button">操作按钮</el-button>
// </div>
// </div>
// </el-card>`
// console.log(self.window)
// self.$nextTick(() => {
// self.window.visible = true; //点击点坐标，出现信息窗体
// });
// //更新窗体数据，
// // that.windows.forEach((window) => {
// // window.visible = false; //关闭窗体
// // });
// // that.window = that.windows[index];
// // that.$nextTick(() => {
// // that.window.visible = true; //点击点坐标，出现信息窗体
// // });
// alert(e.target.getExtData());
// // this.visiblepop = true;
// // let resp=this.$emit("choose", e.target.getExtData().siteId);
// //console.log("resp",resp)
// // const { lat, lng } = e.lnglat;
// // this.geocoder.getAddress([lng, lat], (status, result) => {
// // if (status === "complete" && result.info === "OK") {
// // const address = result.regeocode.formattedAddress;
// // this.setMarker(lng, lat, address);
// // this.center = [lng, lat];
// // }
// // });
// },
// },
// 一些工具插件
plugin: [
{
......@@ -236,6 +366,12 @@ export default {
</script>
<style lang="less">
.amap-info-content {
position: relative;
background: #fff;
line-height: 1.4;
overflow: auto;
}
.my-map {
.amap-demo {
position: relative;
......
device-manager-ui/admin/src/components/SearchForm.vue
View file @ 2c8afda2
......@@ -229,10 +229,7 @@ export default {
//初始化查询表单
let newFormData = {};
// this.form = this.encode(data, this.form);
console.log("data", data);
console.log("form", this.form);
this.search.forEach((item) => {
console.log("search-item", item);
//复选框
if (item.type === "checkbox") {
if (this.form[item.name] == undefined) {
......@@ -257,8 +254,6 @@ export default {
});
this.form = Object.assign({}, this.form, newFormData);
this.form = Object.assign({}, this.form, data);
console.log("form2", this.form);
},
cleanForm() {
this.clean();
......
device-manager-ui/admin/src/views/device/dialogshow.vue
View file @ 2c8afda2
......@@ -51,6 +51,7 @@
title: "设备",
// 是否显示弹出层
open: false,
direction:"rtl",
toString:[
"deviceType",
"deviceOnlineStatus",
......
device-manager-ui/admin/src/views/login/login.vue
View file @ 2c8afda2
......@@ -19,36 +19,104 @@
<div class="footer">
登陆 &copy; <a href="">信宏翔网络科技有限公司</a> 出品
</div>
</div>
<!-- <Map ref="map1" :markersData="originData" @choose="getDetailData" /> -->
<!-- <el-card :body-style="{ padding: '5px' }" style="width: 300px">
<el-row type="flex" class="row-bg" justify="space-around">
<span style="font-size: 18px"><b>高新区政务服务中心</b></span>
<el-button type="text" size="mini" class="button">查看详情</el-button>
</el-row>
<el-divider></el-divider>
<el-row type="flex" justify="space-around">
<el-col :span="4">
<span style="font-size: 13px"><b>100</b></span
><br />
<span style="font-size: 12px">设备总数</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"><b>100</b></span
><br />
<span style="font-size: 12px">在线</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"><b>100</b></span
><br />
<span style="font-size: 12px">离线</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"><b>100</b></span
><br />
<span style="font-size: 12px">停用</span>
</el-col>
<el-col :span="4">
<span style="font-size: 13px"><b>100</b></span
><br />
<span style="font-size: 12px">待激活</span>
</el-col>
</el-row>
<el-divider></el-divider>
<el-descriptions :column="1" size="small">
<el-descriptions-item label="站点编码"
>kooriookami</el-descriptions-item
>
<el-descriptions-item label="站点地址"
>18100000000</el-descriptions-item
>
<el-descriptions-item
label="联系人"
:labelStyle="{ 'text-align': 'right', width: '50px' }"
>苏州市</el-descriptions-item
>
<el-descriptions-item label="联系电话">
<el-tag size="small">学校</el-tag>
</el-descriptions-item>
<el-descriptions-item label="创建时间"
>江苏省苏州市吴中区吴中大道 1188 号</el-descriptions-item
>
</el-descriptions>
</el-card> -->
</div>
</template>
<script>
import { createSocket } from '@/assets/utils/websocket'
import { createSocket } from "@/assets/utils/websocket";
export default {
name: 'login',
name: "login",
created() {
// window.location.href=process.env.VUE_APP_PORTAL_URL=='undefined'?'http://192.168.0.98:11072':process.env.VUE_APP_PORTAL_URL
// let obj = {};
// obj.lng = 104.21;
// obj.lat = 30.56;
// obj.address = "测试站点";
// obj.siteId = 2;
// this.originData.push(obj);
// this.$nextTick(() => {
// this.$refs.map1.refresh(this.originData);
// });
// window.location.href=process.env.VUE_APP_PORTAL_URL=='undefined'?'http://192.168.0.98:11072':process.env.VUE_APP_PORTAL_URL
},
methods: {
login() {
this.loading = true;
this.$post('/login/login', this.form).then(this.loginSuccess).catch(this.loginFail)
this.$post("/login/login", this.form)
.then(this.loginSuccess)
.catch(this.loginFail);
},
loginSuccess({data}) {
console.log("userData",data)
this.$store.commit('setUserData', data);
loginSuccess({ data }) {
console.log("userData", data);
this.$store.commit("setUserData", data);
this.$router.replace({
path: this.redirect,
});
//成功 创建websocket连接 process.env.VUE_WEBSOCKET_BASE_API +
console.log("process",process.env)
// createSocket("ws://"+process.env.VUE_APP_BASE_API +"/ws?accessToken="+data.id)
console.log("process", process.env);
// createSocket("ws://"+process.env.VUE_APP_BASE_API +"/ws?accessToken="+data.id)
},
loginFail(error) {
this.loading = false;
......@@ -62,11 +130,11 @@ export default {
onSubmit(e) {
e.preventDefault();
if(!this.form.loginName.length){
return this.$message.warning('请输入用户名')
if (!this.form.loginName.length) {
return this.$message.warning("请输入用户名");
}
if(!this.form.password.length){
return this.$message.warning('请输入密码')
if (!this.form.password.length) {
return this.$message.warning("请输入密码");
}
this.login();
......@@ -74,50 +142,56 @@ export default {
},
data() {
return {
originData: [],
loading: false,
redirect: this.$route.query.redirect || '/',
redirect: this.$route.query.redirect || "/",
form: {
loginName: '',
password: ''
}
}
}
}
loginName: "",
password: "",
},
};
},
};
</script>
<style lang="less">
.el-divider--horizontal {
margin: 5px 0;
background: 0 0;
border-top: 2px solid #e8eaec;
}
.page-login {
background-image: linear-gradient(45deg, #333, #111);
background-size: 40px 40px;
margin: 0;
height: 100%;
.el-form{
.el-form {
margin: auto;
width: 400px;
padding: 25px 25px 0 0;
background: #fff;
h1{
h1 {
text-align: center;
font-size: 20px;
font-weight: 500;
margin-bottom: 20px;
}
button{
button {
margin-top: 10px;
width: 240px;
}
.el-input-group__append{
.el-input-group__append {
padding: 0;
font-size: 0;
}
}
.footer{
.footer {
height: 80px;
font-size: 12px;
color: #999;
text-align: center;
line-height: 80px;
a{
a {
color: #999;
}
}
......
device-manager-ui/admin/src/views/sitestat/maplist.vue
View file @ 2c8afda2
......@@ -40,7 +40,6 @@
</el-row>
<dialog-show ref="dialogform" @ok="getData" />
</div>
</template>
......@@ -64,14 +63,15 @@ export default {
created() {
this.pageInfo.list = "/sitestat/list";
this.$get("/sitestat/maplist", {}).then(({ data }) => {
this.originData = data.data.map((i) => {
let obj = {};
obj.lng = i.longitude;
obj.lat = i.latitude;
obj.address = i.siteName;
obj.siteId = i.id;
return obj;
});
this.originData=data
// this.originData = data.data.map((i) => {
// let obj = {};
// obj.lng = i.longitude;
// obj.lat = i.latitude;
// obj.address = i.siteName;
// obj.siteId = i.id;
// return obj;
// });
this.$refs.map.refresh(this.originData);
});
......@@ -107,14 +107,24 @@ export default {
this.isExport = false;
this.$message.error(error.message);
});
},
},
getDetailData(siteId) {
// console.log("111");
getDetailData(siteId, callback) {
console.log("siteId:", siteId);
this.$get("/sitestat/siteInfo", { siteId, siteId }).then((res) => {
console.log("res",res)
// if (res.code == 1 && res.data.data.length > 0) {
// callback(res.data.data[0]);
// }
});
//关闭弹窗
// this.$refs.popoverRef.doClose()
//this.$refs.popoverRef.doShow() //开启弹窗
// this.$refs.popoverRef.doClose()
//this.$refs.popoverRef.doShow() //开启弹窗
},
/** 重写新增方法 */
......
device-manager/src/main/java/com/mortals/xhx/module/device/model/vo/DeviceStatVo.java
View file @ 2c8afda2
package com.mortals.xhx.module.device.model.vo;
import com.mortals.framework.model.BaseEntityLong;
import com.mortals.xhx.module.device.model.DeviceStatEntity;
import lombok.Data;
import java.util.ArrayList;
import java.util.List;
/**
* 设备统计视图对象
*
* @author zxfei
* @date 2022-07-05
*/
* 设备统计视图对象
*
* @author zxfei
* @date 2022-07-05
*/
@Data
public class DeviceStatVo extends BaseEntityLong {
}
\ No newline at end of file
device-manager/src/main/java/com/mortals/xhx/module/device/service/DeviceStatService.java
View file @ 2c8afda2
package com.mortals.xhx.module.device.service;
import com.mortals.framework.service.ICRUDService;
import com.mortals.xhx.feign.site.ISiteFeign;
import com.mortals.xhx.module.device.model.DeviceStatEntity;
import org.springframework.beans.factory.annotation.Autowired;
/**
* DeviceStatService
*
......@@ -11,4 +14,6 @@ import com.mortals.xhx.module.device.model.DeviceStatEntity;
*/
public interface DeviceStatService extends ICRUDService<DeviceStatEntity,Long>{
}
\ No newline at end of file
device-manager/src/main/java/com/mortals/xhx/module/device/service/impl/DeviceStatServiceImpl.java
View file @ 2c8afda2
package com.mortals.xhx.module.device.service.impl;
import com.mortals.framework.exception.AppException;
import com.mortals.framework.model.Context;
import com.mortals.framework.model.PageInfo;
import com.mortals.xhx.common.pdu.site.SitePdu;
import com.mortals.xhx.feign.site.ISiteFeign;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.mortals.framework.service.impl.AbstractCRUDServiceImpl;
import com.mortals.xhx.module.device.dao.DeviceStatDao;
import com.mortals.xhx.module.device.model.DeviceStatEntity;
import com.mortals.xhx.module.device.service.DeviceStatService;
import org.springframework.util.ObjectUtils;
import java.util.List;
import java.util.Map;
import java.util.stream.Collectors;
/**
* DeviceStatService
* 设备统计 service实现
......@@ -13,5 +25,23 @@ import com.mortals.xhx.module.device.service.DeviceStatService;
*/
@Service("deviceStatService")
public class DeviceStatServiceImpl extends AbstractCRUDServiceImpl<DeviceStatDao, DeviceStatEntity, Long> implements DeviceStatService {
// @Autowired
// private ISiteFeign siteFeign;
//
//
// @Override
// protected void findAfter(DeviceStatEntity params, PageInfo pageInfo, Context context, List<DeviceStatEntity> list) throws AppException {
// SitePdu sitePdu = new SitePdu();
// sitePdu.setSize(-1);
// Map<Long, SitePdu> collect = siteFeign.list(sitePdu).getData().getData().stream().collect(Collectors.toMap(x -> x.getId(), y -> y));
//
// list.stream().forEach(item->{
// if(ObjectUtils.isEmpty())
// });
//
//
//
// super.findAfter(params, pageInfo, context, list);
// }
}
\ No newline at end of file
device-manager/src/main/java/com/mortals/xhx/module/sitestat/model/SitestatEntity.java
View file @ 2c8afda2
package com.mortals.xhx.module.sitestat.model;
import java.util.List;
import java.util.ArrayList;
import com.fasterxml.jackson.annotation.JsonFormat;
import com.mortals.framework.annotation.Excel;
import com.mortals.framework.model.BaseEntityLong;
import com.mortals.xhx.module.sitestat.model.vo.SitestatVo;
/**
* 站点统计实体对象
......
device-manager/src/main/java/com/mortals/xhx/module/sitestat/model/vo/SitestatVo.java
View file @ 2c8afda2
......@@ -19,4 +19,15 @@ public class SitestatVo extends BaseEntityLong {
* 站点Id，来源基础服务平台列表
*/
private List<Long> siteIdList;
private String lng;
private String lat;
private String address;
private String leadingOfficial;
private String leadingOfficialTelephone;
}
\ No newline at end of file
device-manager/src/main/java/com/mortals/xhx/module/sitestat/web/SitestatController.java
View file @ 2c8afda2
......@@ -20,6 +20,7 @@ import com.mortals.xhx.module.sitestat.model.SitestatQuery;
import com.mortals.xhx.module.sitestat.service.SitestatService;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.ObjectUtils;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
......@@ -28,6 +29,7 @@ import org.springframework.web.bind.annotation.RestController;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.stream.Collectors;
/**
* 站点统计
......@@ -108,9 +110,8 @@ public class SitestatController extends BaseCRUDJsonBodyMappingController<Sitest
* 站点列表
*/
@GetMapping(value = "maplist")
public String maplist() {
public Rest<List<SitestatEntity>> maplist() {
JSONObject jsonObject = new JSONObject();
String busiDesc = this.getModuleDesc() + "构建站点列表";
try {
SitePdu sitePdu = new SitePdu();
sitePdu.setPage(1);
......@@ -120,13 +121,29 @@ public class SitestatController extends BaseCRUDJsonBodyMappingController<Sitest
sitePdu.setIdList(siteIdList);
}
Rest<RespData<List<SitePdu>>> resp = siteFeign.list(sitePdu);
return JSON.toJSONString(resp);
//根据站点id 获取统计信息
List<SitestatEntity> collect = resp.getData().getData().stream().map(item -> {
SitestatEntity sitestatEntity = this.service.selectOne(new SitestatQuery().siteId(item.getId()));
if (!ObjectUtils.isEmpty(sitestatEntity)) {
sitestatEntity.setSiteId(item.getId());
sitestatEntity.setSiteCode(item.getSiteCode());
sitestatEntity.setSiteName(item.getSiteName());
sitestatEntity.setLng(item.getLongitude());
sitestatEntity.setLat(item.getLatitude());
sitestatEntity.setAddress(item.getDetailAddress());
sitestatEntity.setLeadingOfficial(item.getLeadingOfficial());
sitestatEntity.setLeadingOfficialTelephone(item.getLeadingOfficialTelephone());
return sitestatEntity;
}
return null;
}).filter(f -> f != null).collect(Collectors.toList());
return Rest.ok("获取成功", collect);
} catch (Exception e) {
log.error("站点异常", e);
jsonObject.put(KEY_RESULT_CODE, VALUE_RESULT_FAILURE);
jsonObject.put(KEY_RESULT_MSG, super.convertException(e));
log.error("获取异常", e);
return Rest.fail("获取异常！");
}
return jsonObject.toJSONString();
}
......@@ -154,6 +171,4 @@ public class SitestatController extends BaseCRUDJsonBodyMappingController<Sitest
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment