zhangqun
2 years ago
parent
4303c2bb68
commit
159bbcaa6d
9 changed files with 355 additions and 59 deletions
@ -0,0 +1,252 @@ |
|||||||
|
<template> |
||||||
|
<basic-container> |
||||||
|
<avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" :page.sync="page" |
||||||
|
:permission="permissionList" @search-change="searchChange" @search-reset="searchReset" |
||||||
|
@current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad"> |
||||||
|
<template #menu="{ row, index }"> |
||||||
|
<el-button type="text" icon="el-icon-view" size="small" @click="rowView(row, index)">详情 |
||||||
|
</el-button> |
||||||
|
<el-button type="text" icon="el-icon-map-location" :disabled="row.x == null" size="small" @click="rowMap(row, index)">地图定位 |
||||||
|
</el-button> |
||||||
|
</template> |
||||||
|
</avue-crud> |
||||||
|
<!-- 地图定位 --> |
||||||
|
<el-dialog v-if="dialogVisible" :visible.sync="dialogVisible" modal="false" append-to-body fullscreen> |
||||||
|
<MapView :name="sn" :x="x" :y="y"></MapView> |
||||||
|
</el-dialog> |
||||||
|
</basic-container> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { bizLogin, terminalList } from "@/api/wirelessintrusion/wirelessintrusion"; |
||||||
|
import { mapGetters } from "vuex"; |
||||||
|
import { dateFormat } from "../../../util/date"; |
||||||
|
import MapView from "../../map/index.vue"; |
||||||
|
|
||||||
|
export default { |
||||||
|
components: { |
||||||
|
MapView |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
query: {}, |
||||||
|
loading: true, |
||||||
|
page: { |
||||||
|
size: 10, |
||||||
|
current: 1, |
||||||
|
total: 0 |
||||||
|
}, |
||||||
|
option: { |
||||||
|
height: 'auto', |
||||||
|
calcHeight: 30, |
||||||
|
tip: false, |
||||||
|
searchShow: true, |
||||||
|
searchMenuSpan: 6, |
||||||
|
border: true, |
||||||
|
index: true, |
||||||
|
selection: false, |
||||||
|
viewBtn: true, |
||||||
|
delBtn: false, |
||||||
|
dialogClickModal: false, |
||||||
|
menuWidth: 180, |
||||||
|
column: [ |
||||||
|
{ |
||||||
|
label: "设备名称", |
||||||
|
prop: "name", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label:"sn编号", |
||||||
|
prop: "sn", |
||||||
|
search: true, |
||||||
|
hide: true |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "建筑 id", |
||||||
|
prop: "buildId", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "楼层", |
||||||
|
prop: "floorNo", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "x坐标", |
||||||
|
prop: "x", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "y坐标", |
||||||
|
prop: "y", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "工作状态", |
||||||
|
type: "select", |
||||||
|
dicData: [ |
||||||
|
{value:'work', label:"工作"},{value:'sleep', label:"休眠"} |
||||||
|
], |
||||||
|
prop: "workStatus", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "通信状态", |
||||||
|
type: "select", |
||||||
|
dicData: [ |
||||||
|
{value:0, label:"在线"},{value:1, label:"离线"} |
||||||
|
], |
||||||
|
prop: "communicateStatus", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "最后一次通信时间", |
||||||
|
labelWidth: 150, |
||||||
|
prop: "lastCommunicateTime", |
||||||
|
span: 24, |
||||||
|
formatter: (data, value) => { |
||||||
|
return dateFormat(new Date(data.lastCommunicateTime)) |
||||||
|
}, |
||||||
|
hide: true |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "最后一次配置时间", |
||||||
|
labelWidth: 150, |
||||||
|
prop: "lastConfigTime", |
||||||
|
span: 24, |
||||||
|
formatter: (data, value) => { |
||||||
|
return dateFormat(new Date(data.lastConfigTime)) |
||||||
|
}, |
||||||
|
hide: true |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "最后一次定位时间", |
||||||
|
labelWidth: 150, |
||||||
|
prop: "lastLocateTime", |
||||||
|
span: 24, |
||||||
|
formatter: (data, value) => { |
||||||
|
return dateFormat(new Date(data.lastLocateTime)) |
||||||
|
}, |
||||||
|
hide:true |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "创建时间", |
||||||
|
prop: "createTime", |
||||||
|
formatter: (data, value) => { |
||||||
|
return dateFormat(new Date(data.createTime)) |
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "更新时间", |
||||||
|
prop: "updateTime", |
||||||
|
formatter: (data, value) => { |
||||||
|
return dateFormat(new Date(data.updateTime)) |
||||||
|
}, |
||||||
|
hide:true |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
data: [], |
||||||
|
submitLoading: false, |
||||||
|
buildingId: 202861, |
||||||
|
//地图定位查看 |
||||||
|
dialogVisible: false, |
||||||
|
sn: '', |
||||||
|
x: 0, |
||||||
|
y: 0, |
||||||
|
floorNo: 1 |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: { |
||||||
|
...mapGetters(["userInfo", "permission"]), |
||||||
|
permissionList() { |
||||||
|
return { |
||||||
|
addBtn: false, |
||||||
|
viewBtn: false, |
||||||
|
delBtn: true, |
||||||
|
editBtn: false |
||||||
|
}; |
||||||
|
}, |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//查看详情 |
||||||
|
rowView(row, index) { |
||||||
|
this.$refs.crud.rowView(row, index); |
||||||
|
}, |
||||||
|
//地图定位查看 |
||||||
|
rowMap(row, index) { |
||||||
|
if(row.x && row.y) { |
||||||
|
this.sn = row.sn; |
||||||
|
this.x = row.x; |
||||||
|
this.y = row.y; |
||||||
|
this.floorNo = row.floorNo; |
||||||
|
console.log(this.sn,this.x,this.y) |
||||||
|
this.dialogVisible = true; |
||||||
|
} |
||||||
|
}, |
||||||
|
searchReset() { |
||||||
|
this.query = {}; |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
searchChange(params, done) { |
||||||
|
this.query = params; |
||||||
|
this.page.current = 1; |
||||||
|
this.onLoad(this.page, params); |
||||||
|
done(); |
||||||
|
}, |
||||||
|
currentChange(current) { |
||||||
|
this.page.current = current; |
||||||
|
}, |
||||||
|
sizeChange(size) { |
||||||
|
this.page.size = size; |
||||||
|
}, |
||||||
|
refreshChange() { |
||||||
|
this.onLoad(this.page, this.query); |
||||||
|
}, |
||||||
|
onLoad(page, params = {}) { |
||||||
|
let token = window.sessionStorage.getItem('bizToken'); |
||||||
|
if (token == 'undefined' || !token) { |
||||||
|
bizLogin({ appKey: 'Arf7bd4f26', appSecret: 'kb207044c8' }).then(res => { |
||||||
|
window.sessionStorage.setItem('bizToken', res.data.data.token); |
||||||
|
this.loading = true; |
||||||
|
terminalList(res.data.data.token, Object.assign(params, this.query, { page: page.currentPage, size: page.pageSize, buildingIds: this.buildingId })).then(res2 => { |
||||||
|
this.loading = false; |
||||||
|
if (res2.data.code == 401) { |
||||||
|
window.sessionStorage.removeItem('bizToken'); |
||||||
|
this.onLoad(this.page); |
||||||
|
} |
||||||
|
else { |
||||||
|
const data = res2.data.data; |
||||||
|
this.page.total = data.totalElements; |
||||||
|
this.data = data.content; |
||||||
|
} |
||||||
|
}, err => { |
||||||
|
this.loading = false; |
||||||
|
}); |
||||||
|
}) |
||||||
|
} |
||||||
|
else { |
||||||
|
this.loading = true; |
||||||
|
terminalList(token, Object.assign(params, this.query, { page: page.currentPage, size: page.pageSize, buildingIds: this.buildingId })).then(res2 => { |
||||||
|
this.loading = false; |
||||||
|
if (res2.data.code == 401) { |
||||||
|
window.sessionStorage.removeItem('bizToken'); |
||||||
|
this.onLoad(this.page); |
||||||
|
} |
||||||
|
else { |
||||||
|
const data = res2.data.data; |
||||||
|
this.page.total = data.totalElements; |
||||||
|
this.data = data.content; |
||||||
|
} |
||||||
|
}, err => { |
||||||
|
this.loading = false; |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.el-table { |
||||||
|
width: 100% !important; |
||||||
|
border: 1px solid #D6D8DF; |
||||||
|
} |
||||||
|
|
||||||
|
.el-table th.el-table__cell { |
||||||
|
background: #F7F8FA; |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue