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