西海岸bug修复
This commit is contained in:
parent
d3d9ac328d
commit
8904da5a13
|
|
@ -2,13 +2,13 @@
|
|||
* @Author: hisense.wuhongjian
|
||||
* @Date: 2020-07-07 16:03:23
|
||||
* @LastEditors: hisense.wuhongjian
|
||||
* @LastEditTime: 2022-11-24 19:38:36
|
||||
* @LastEditTime: 2022-11-27 23:42:04
|
||||
* @Description: 系统静态参数配置
|
||||
*/
|
||||
var _global = {}
|
||||
var CONFIGITEM = {
|
||||
// version: 'qingdao', //青岛
|
||||
version: 'dev', // 西海岸
|
||||
version: 'xihaian', // 西海岸
|
||||
// version: 'dev', // 开发
|
||||
// version: 'zhanTingDev', // 展厅dev (2022-09-13:姜永超让添加)
|
||||
// version: 'qingdao', // 测试
|
||||
|
|
|
|||
|
|
@ -66,15 +66,6 @@ function createMarkerClusterLayer(layerClassName, mapObj) {
|
|||
} else {
|
||||
// 使用默认图标
|
||||
markerClusterLayer = L.markerClusterGroup({
|
||||
// iconCreateFunction(cluster) {
|
||||
// const markers = cluster.getAllChildMarkers()
|
||||
// let n = 0
|
||||
// for (let i = 0; i < markers.length; i++) {
|
||||
// n += markers[i].number
|
||||
// }
|
||||
// return L.divIcon({ html: markers.length, className: "topic-marker-cluster-video" })
|
||||
// },
|
||||
// 是否允许指定 PolylineOptions 样式 spider
|
||||
spiderfyOnMaxZoom: false,
|
||||
// 是否显示标记的边界
|
||||
showCoverageOnHover: true,
|
||||
|
|
|
|||
|
|
@ -1651,8 +1651,9 @@
|
|||
})
|
||||
}
|
||||
const showFlag = ref(true)
|
||||
mybus.on('getCameraByParentId', (ids) => {
|
||||
paramsGetResources2.value.regionId = ids
|
||||
mybus.on('getCameraByParentId', (val) => {
|
||||
console.log('倒腾位置2')
|
||||
paramsGetResources2.value.regionId = val.id
|
||||
getAppResources()
|
||||
})
|
||||
mybus.on('changeShowFlag', (flag) => {
|
||||
|
|
|
|||
|
|
@ -224,19 +224,20 @@
|
|||
}
|
||||
)
|
||||
},
|
||||
// 实时播放
|
||||
videoPlay(playURL, index1) {
|
||||
let that = this
|
||||
this.realTime = true
|
||||
mybus.emit('closeLoading', true)
|
||||
setTimeout(() => {
|
||||
mybus.emit('closeLoading', false)
|
||||
if (!that.unStopable) {
|
||||
message.warning('预览将在2s后停止')
|
||||
setTimeout(() => {
|
||||
that.stopAllPlay()
|
||||
}, 6000)
|
||||
}
|
||||
}, 3000)
|
||||
if (!that.unStopable) {
|
||||
message.warning('预览将在约6s后停止')
|
||||
setTimeout(() => {
|
||||
that.stopAllPlay()
|
||||
}, 6000)
|
||||
}
|
||||
this.mode = 0 //解码方式：0普通模式 1高级模式
|
||||
const { player, mode, urls } = this
|
||||
// playURL = this.realplay
|
||||
|
|
|
|||
|
|
@ -2,7 +2,11 @@
|
|||
<div class="wrapper">
|
||||
<div class="wrapper-title-left-tree" :key="showKey">
|
||||
<div v-for="item in treeData" :key="item.id" class="primaryNode">
|
||||
<div class="top" @click="showBottom(item)" :class="item.show ? 'topSelect' : ''">
|
||||
<div
|
||||
class="top"
|
||||
@click="showBottom(item)"
|
||||
:class="item.show ? 'topSelect' : ''"
|
||||
>
|
||||
{{ item.name }}
|
||||
({{ item.channelCount }})
|
||||
<DownOutlined v-show="!item.show" />
|
||||
|
|
@ -10,13 +14,28 @@
|
|||
</div>
|
||||
<div class="bottom" v-show="item.show">
|
||||
<div v-for="val in item.children" :key="val.id" class="item">
|
||||
<div class="up" :class="selectId == val.id ? 'select' : ''"
|
||||
@click="showDown(item, val), onSelect(item, val)">
|
||||
<div
|
||||
class="up"
|
||||
:class="selectId == val.id ? 'select' : ''"
|
||||
@click="showDown(item, val), onSelect(item, val)"
|
||||
>
|
||||
<div>
|
||||
<svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="2156" width="0.25rem" height="0.25rem"
|
||||
v-show="selectId == val.id">
|
||||
<path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157" fill="#0058e1"></path>
|
||||
<svg
|
||||
t="1654068878091"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="2156"
|
||||
width="0.25rem"
|
||||
height="0.25rem"
|
||||
v-show="selectId == val.id"
|
||||
>
|
||||
<path
|
||||
d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z"
|
||||
p-id="2157"
|
||||
fill="#0058e1"
|
||||
></path>
|
||||
</svg>
|
||||
<span class="name">{{ val.name }}({{ val.channelCount }})</span>
|
||||
</div>
|
||||
|
|
@ -27,13 +46,30 @@
|
|||
</span>
|
||||
</div>
|
||||
<div class="down" v-show="val.show">
|
||||
<div v-for="child in val.children" :key="child.id" class="child"
|
||||
:class="selectId == child.id ? 'select2' : ''" @click="onSelect(item, child, child)">
|
||||
<div
|
||||
v-for="child in val.children"
|
||||
:key="child.id"
|
||||
class="child"
|
||||
:class="selectId == child.id ? 'select2' : ''"
|
||||
@click="onSelect(item, child, child)"
|
||||
>
|
||||
<div>
|
||||
<svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg" p-id="2156" width="0.25rem" height="0.25rem"
|
||||
v-show="selectId == child.id">
|
||||
<path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157" fill="#0058e1"></path>
|
||||
<svg
|
||||
t="1654068878091"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="2156"
|
||||
width="0.25rem"
|
||||
height="0.25rem"
|
||||
v-show="selectId == child.id"
|
||||
>
|
||||
<path
|
||||
d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z"
|
||||
p-id="2157"
|
||||
fill="#0058e1"
|
||||
></path>
|
||||
</svg>
|
||||
<span class="name">
|
||||
{{ child.name }}
|
||||
|
|
@ -49,247 +85,198 @@
|
|||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { defineComponent, ref, watch } from 'vue'
|
||||
import { getCameraAllOrgan } from '@/api/videoSurveillance'
|
||||
import { getCameraInfoByAreaId } from '@/api/file'
|
||||
import mybus from '@/myplugins/mybus'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { UpOutlined, DownOutlined } from '@ant-design/icons-vue'
|
||||
import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
|
||||
import { defineComponent, ref, watch } from 'vue'
|
||||
import { getCameraAllOrgan } from '@/api/videoSurveillance'
|
||||
import { getCameraInfoByAreaId } from '@/api/file'
|
||||
import mybus from '@/myplugins/mybus'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { UpOutlined, DownOutlined } from '@ant-design/icons-vue'
|
||||
import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const router = useRouter()
|
||||
const whoShow1 = ref(whoShow)
|
||||
const showKey = ref(0)
|
||||
const treeData = ref([])
|
||||
const selectId = ref('')
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const router = useRouter()
|
||||
const whoShow1 = ref(whoShow)
|
||||
const showKey = ref(0)
|
||||
const treeData = ref([])
|
||||
const selectId = ref('')
|
||||
|
||||
// 初始化
|
||||
const init = async () => {
|
||||
treeData.value = []
|
||||
console.log(
|
||||
'router.currentRoute.value.query.select',
|
||||
router.currentRoute.value.query.select
|
||||
)
|
||||
let select = router.currentRoute.value.query.select || DETAIL_PAGE_CONTENT_DEFAULT_TAB
|
||||
if (select === '123') {
|
||||
select = ''
|
||||
// 初始化
|
||||
const init = async () => {
|
||||
treeData.value = []
|
||||
console.log(
|
||||
'router.currentRoute.value.query.select',
|
||||
router.currentRoute.value.query.select
|
||||
)
|
||||
let select =
|
||||
router.currentRoute.value.query.select ||
|
||||
DETAIL_PAGE_CONTENT_DEFAULT_TAB
|
||||
if (select === '123') {
|
||||
select = ''
|
||||
}
|
||||
console.log(
|
||||
'获取url中的select=====================>',
|
||||
router.currentRoute.value.query.select
|
||||
)
|
||||
if (select == '基础设施') {
|
||||
let res = {}
|
||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||
res = await getCameraAllOrgan({
|
||||
parentId: 'S4NbecfYB1DBH8HNULGS34',
|
||||
})
|
||||
} else {
|
||||
// 西海岸
|
||||
res = await getCameraInfoByAreaId({
|
||||
areaId: '70be8c5b664f4bcf869d82f2e8335051',
|
||||
})
|
||||
}
|
||||
treeData.value = (res.data && res.data.data) || []
|
||||
// 只有一个，默认展开到二级菜单
|
||||
if (res.data && res.data.data.length == 1) {
|
||||
showBottom(treeData.value[0])
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(
|
||||
'获取url中的select=====================>',
|
||||
router.currentRoute.value.query.select
|
||||
)
|
||||
if (select == '基础设施') {
|
||||
let res = {};
|
||||
mybus.on('getDeptList', () => {
|
||||
init()
|
||||
})
|
||||
|
||||
const onSelect = async (item, val, child) => {
|
||||
console.log('item--------onSelect---->', item)
|
||||
console.log('val------onSelect------>', val)
|
||||
console.log('child-----onSelect------->', child)
|
||||
mybus.emit('getCameraByParentId', {
|
||||
id: val.id,
|
||||
})
|
||||
mybus.emit('getListByParentId', val.id)
|
||||
let res = {}
|
||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||
res = await getCameraAllOrgan({ parentId: 'S4NbecfYB1DBH8HNULGS34' })
|
||||
res = await getCameraAllOrgan({ parentId: val.id })
|
||||
} else {
|
||||
// 西海岸
|
||||
res = await getCameraInfoByAreaId({
|
||||
areaId: '70be8c5b664f4bcf869d82f2e8335051',
|
||||
})
|
||||
res = await getCameraInfoByAreaId({ areaId: val.id })
|
||||
}
|
||||
treeData.value = res.data && res.data.data || []
|
||||
// 只有一个，默认展开到二级菜单
|
||||
if(res.data && res.data.data.length == 1) {
|
||||
showBottom(treeData.value[0])
|
||||
treeData.value.map((treeDataItem, index) => {
|
||||
if (item.id == treeDataItem.id) {
|
||||
treeData.value[index].children.map((childItem, childIndex) => {
|
||||
if (childItem.id == val.id) {
|
||||
treeData.value[index].children[childIndex].children =
|
||||
res.data.data
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
if (child) {
|
||||
selectId.value = child.id
|
||||
}
|
||||
}
|
||||
}
|
||||
mybus.on('getDeptList', () => {
|
||||
init()
|
||||
})
|
||||
|
||||
const onSelect = async (item, val, child) => {
|
||||
console.log('item--------onSelect---->', item);
|
||||
console.log('val------onSelect------>', val);
|
||||
console.log('child-----onSelect------->', child);
|
||||
mybus.emit('getCameraByParentId', val.id)
|
||||
mybus.emit('getListByParentId', val.id)
|
||||
let res = {}
|
||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||
res = await getCameraAllOrgan({ parentId: val.id })
|
||||
} else {
|
||||
// 西海岸
|
||||
res = await getCameraInfoByAreaId({ areaId: val.id })
|
||||
}
|
||||
treeData.value.map((treeDataItem, index) => {
|
||||
if (item.id == treeDataItem.id) {
|
||||
treeData.value[index].children.map((childItem, childIndex) => {
|
||||
if (childItem.id == val.id) {
|
||||
treeData.value[index].children[childIndex].children =
|
||||
res.data.data
|
||||
}
|
||||
watch(selectId, (newVal) => {
|
||||
if (newVal == '') {
|
||||
mybus.emit('getCameraByParentId', {
|
||||
id: '',
|
||||
})
|
||||
mybus.emit('getListByParentId', '')
|
||||
}
|
||||
})
|
||||
if (child) {
|
||||
selectId.value = child.id
|
||||
}
|
||||
}
|
||||
|
||||
watch(selectId, (newVal) => {
|
||||
if (newVal == '') {
|
||||
mybus.emit('getCameraByParentId', '')
|
||||
mybus.emit('getListByParentId', '')
|
||||
}
|
||||
})
|
||||
|
||||
const showBottom = async (item) => {
|
||||
item.show = !item.show;
|
||||
let res = {};
|
||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||
res = await getCameraAllOrgan({ parentId: item.id })
|
||||
} else {
|
||||
// 西海岸
|
||||
res = await getCameraInfoByAreaId({ areaId: item.id })
|
||||
}
|
||||
|
||||
treeData.value.map((treeDataItem, index) => {
|
||||
if (item.id == treeDataItem.id) {
|
||||
treeData.value[index].children = res.data && res.data.data || []
|
||||
console.log('treeData.value.[index]', treeData.value[index])
|
||||
const showBottom = async (item) => {
|
||||
item.show = !item.show
|
||||
let res = {}
|
||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||
res = await getCameraAllOrgan({ parentId: item.id })
|
||||
} else {
|
||||
// 西海岸
|
||||
res = await getCameraInfoByAreaId({ areaId: item.id })
|
||||
}
|
||||
})
|
||||
}
|
||||
const showDown = (item, val) => {
|
||||
selectId.value = val.id
|
||||
console.log('item---showDown--------->', item);
|
||||
console.log('val----showDown-------->', val);
|
||||
if (item.children) {
|
||||
val.show = !val.show;
|
||||
// 取消选中
|
||||
if (!val.show) {
|
||||
selectId.value = ''
|
||||
|
||||
treeData.value.map((treeDataItem, index) => {
|
||||
if (item.id == treeDataItem.id) {
|
||||
treeData.value[index].children = (res.data && res.data.data) || []
|
||||
console.log('treeData.value.[index]', treeData.value[index])
|
||||
}
|
||||
})
|
||||
}
|
||||
const showDown = (item, val) => {
|
||||
selectId.value = val.id
|
||||
console.log('item---showDown--------->', item)
|
||||
console.log('val----showDown-------->', val)
|
||||
if (item.children) {
|
||||
val.show = !val.show
|
||||
// 取消选中
|
||||
if (!val.show) {
|
||||
selectId.value = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return {
|
||||
treeData,
|
||||
showKey,
|
||||
onSelect,
|
||||
showBottom,
|
||||
showDown,
|
||||
selectId,
|
||||
}
|
||||
},
|
||||
beforeUnmount() {
|
||||
mybus.off('getDeptList')
|
||||
console.log('getDeptList销毁~~~~~~~~~~~~~~~~~~~')
|
||||
},
|
||||
components: {
|
||||
UpOutlined,
|
||||
DownOutlined,
|
||||
},
|
||||
})
|
||||
return {
|
||||
treeData,
|
||||
showKey,
|
||||
onSelect,
|
||||
showBottom,
|
||||
showDown,
|
||||
selectId,
|
||||
}
|
||||
},
|
||||
beforeUnmount() {
|
||||
mybus.off('getDeptList')
|
||||
console.log('getDeptList销毁~~~~~~~~~~~~~~~~~~~')
|
||||
},
|
||||
components: {
|
||||
UpOutlined,
|
||||
DownOutlined,
|
||||
},
|
||||
})
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.primaryNode {
|
||||
.top {
|
||||
width: 100%;
|
||||
height: 0.4rem;
|
||||
background: rgba(0, 135, 225, 0.1);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 0.1rem;
|
||||
margin-top: 0.08rem;
|
||||
}
|
||||
|
||||
.top:hover {
|
||||
cursor: pointer;
|
||||
// 0058e1 透明度 0.5
|
||||
background: rgba(0, 88, 225, 0.8);
|
||||
color: white;
|
||||
|
||||
:deep(.anticon) {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.topSelect {
|
||||
background: #0058e1;
|
||||
color: white;
|
||||
|
||||
:deep(.anticon) {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
background: rgba(244, 245, 248, 0.8);
|
||||
padding: 0 0.1rem;
|
||||
|
||||
// margin-bottom: .08rem;
|
||||
.up {
|
||||
cursor: pointer;
|
||||
.primaryNode {
|
||||
.top {
|
||||
width: 100%;
|
||||
height: 0.4rem;
|
||||
background: rgba(0, 135, 225, 0.1);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-top: 0.01rem solid #ccc;
|
||||
padding: 0 0.1rem;
|
||||
margin-top: 0.08rem;
|
||||
}
|
||||
|
||||
.top:hover {
|
||||
cursor: pointer;
|
||||
// 0058e1 透明度 0.5
|
||||
background: rgba(0, 88, 225, 0.8);
|
||||
color: white;
|
||||
|
||||
:deep(.anticon) {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.topSelect {
|
||||
background: #0058e1;
|
||||
color: white;
|
||||
|
||||
:deep(.anticon) {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
width: 100%;
|
||||
background: rgba(244, 245, 248, 0.8);
|
||||
padding: 0 0.1rem;
|
||||
|
||||
&>div {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.up:hover {
|
||||
.name {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.select {
|
||||
padding: 0 0.1rem 0 0;
|
||||
|
||||
.name {
|
||||
width: 1.7rem;
|
||||
color: #0058e1 !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.item:nth-of-type(1) .up {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.down {
|
||||
width: 100%;
|
||||
|
||||
.child {
|
||||
// margin-bottom: .08rem;
|
||||
.up {
|
||||
cursor: pointer;
|
||||
height: 0.4rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-top: 0.01rem solid #ccc;
|
||||
padding: 0 0.1rem;
|
||||
|
||||
&>div {
|
||||
& > div {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
|
@ -304,7 +291,7 @@ export default defineComponent({
|
|||
}
|
||||
}
|
||||
|
||||
.child:hover {
|
||||
.up:hover {
|
||||
.name {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
|
|
@ -316,10 +303,12 @@ export default defineComponent({
|
|||
}
|
||||
}
|
||||
|
||||
.select2 {
|
||||
.select {
|
||||
padding: 0 0.1rem 0 0;
|
||||
|
||||
.name {
|
||||
width: 1.7rem;
|
||||
color: #0058e1;
|
||||
color: #0058e1 !important;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
|
|
@ -327,10 +316,65 @@ export default defineComponent({
|
|||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
padding: 0 0.1rem 0 0;
|
||||
.item:nth-of-type(1) .up {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
.down {
|
||||
width: 100%;
|
||||
|
||||
.child {
|
||||
cursor: pointer;
|
||||
height: 0.4rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 0.1rem;
|
||||
|
||||
& > div {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
.child:hover {
|
||||
.name {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.select2 {
|
||||
.name {
|
||||
width: 1.7rem;
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
span {
|
||||
color: #0058e1;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
padding: 0 0.1rem 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -157,7 +157,9 @@
|
|||
}
|
||||
} else {
|
||||
if (selectId.value !== '') {
|
||||
mybus.emit('getCameraByParentId', selectId.value)
|
||||
mybus.emit('getCameraByParentId', {
|
||||
id: selectId.value,
|
||||
})
|
||||
} else {
|
||||
mybus.emit('clearLeftSelect')
|
||||
}
|
||||
|
|
@ -228,14 +230,21 @@
|
|||
selectId.value = ''
|
||||
} else {
|
||||
selectId.value = child.id
|
||||
mybus.emit('getCameraByParentId', val.id)
|
||||
// 查询数据并上图
|
||||
const param = {
|
||||
id: val.id,
|
||||
reset: true,
|
||||
}
|
||||
mybus.emit('getCameraByParentId', param)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
watch(selectId, (newVal) => {
|
||||
if (newVal == '') {
|
||||
mybus.emit('getCameraByParentId', '70be8c5b664f4bcf869d82f2e8335051')
|
||||
mybus.emit('getCameraByParentId', {
|
||||
id: '70be8c5b664f4bcf869d82f2e8335051',
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
|
|
@ -261,7 +270,9 @@
|
|||
selectId.value = ''
|
||||
// mybus.emit('clearLeftSelect')
|
||||
} else {
|
||||
mybus.emit('getCameraByParentId', val.id)
|
||||
mybus.emit('getCameraByParentId', {
|
||||
id: val.id,
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -403,7 +403,14 @@
|
|||
</div>
|
||||
<div v-if="room">
|
||||
<!-- 地图 -->
|
||||
<div class="map-contain" v-if="showMap">
|
||||
<div
|
||||
class="map-contain"
|
||||
v-if="showMap"
|
||||
v-loading="spinningHome"
|
||||
element-loading-text="Loading..."
|
||||
element-loading-svg-view-box="-10, -10, 50, 50"
|
||||
element-loading-background="rgba(122, 122, 122, 0.8)"
|
||||
>
|
||||
<video-surveillance></video-surveillance>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
|
|
@ -692,6 +699,7 @@
|
|||
import moment from 'moment'
|
||||
import { useStore } from 'vuex'
|
||||
import debounce from 'lodash/debounce'
|
||||
import { stubFalse } from 'lodash'
|
||||
const store = useStore()
|
||||
const username = store.getters['user/username']
|
||||
const props = defineProps({
|
||||
|
|
@ -699,6 +707,7 @@
|
|||
searchValue: { type: String, default: '' },
|
||||
searchType: { type: String, default: '' },
|
||||
})
|
||||
const spinningHome = ref(false)
|
||||
const current = ref(1)
|
||||
const videoTotal = ref(0)
|
||||
const router = useRouter()
|
||||
|
|
@ -2036,9 +2045,12 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
console.log('位置1')
|
||||
spinningHome.value = true
|
||||
getCameraByCondition(params)
|
||||
.then((res) => {
|
||||
console.log('res--查询摄像头---------->', res)
|
||||
spinningHome.value = false
|
||||
loadingCamera.value = false
|
||||
dataSource.value = res.data.data
|
||||
pagination.value.total = res.data.count
|
||||
|
|
|
|||
|
|
@ -1,10 +1,19 @@
|
|||
<template>
|
||||
<div class="ucs-leaflet-map">
|
||||
<div id="contain">
|
||||
<div class="map-box">
|
||||
|
||||
<div id="contain" >
|
||||
|
||||
<div class="map-box" >
|
||||
|
||||
<div :id="mapId" class="normal-map-content">
|
||||
<tiled-map :hi-map="hiMap" :map-id="mapId" />
|
||||
|
||||
<tiled-map v-loading="spinning" element-loading-text="Loading..."
|
||||
element-loading-svg-view-box="-10, -10, 50, 50"
|
||||
element-loading-background="rgba(122, 122, 122, 0.8)"
|
||||
:hi-map="hiMap" :map-id="mapId" />
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="searchPoint">
|
||||
|
|
@ -41,6 +50,7 @@
|
|||
:fetch-suggestions="querySearch"
|
||||
clearable
|
||||
class="input-with-select"
|
||||
@change = "changeComplete"
|
||||
placeholder="请输入关键字"
|
||||
@select="
|
||||
(addressItem) => {
|
||||
|
|
@ -92,7 +102,7 @@
|
|||
data-spm-anchor-id="a313x.7781069.0.i0"
|
||||
></path>
|
||||
</svg>
|
||||
<img class="icon-poylon" @click="areaMode()" src="~@/supermap/image/icon-poylon.png">
|
||||
<img class="icon-poylon" @click="areaMode()" src="~@/supermap/image/icon-poylon.png">
|
||||
|
||||
</div>
|
||||
<video-play
|
||||
|
|
@ -104,7 +114,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { ElMessage, ElLoading } from 'element-plus'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { HieimpMap } from '@/supermap/map-init'
|
||||
import TiledMap from './components/tiledMap'
|
||||
|
|
@ -134,6 +144,7 @@ import { ElMessage } from 'element-plus'
|
|||
checkboxGroup: [],
|
||||
tabList: [],
|
||||
state: '',
|
||||
spinning: false,
|
||||
timeout: null,
|
||||
camreaTree: [],
|
||||
camreaTreeIsShow: true,
|
||||
|
|
@ -193,9 +204,14 @@ import { ElMessage } from 'element-plus'
|
|||
// this.getMapPoint()
|
||||
// 点击左侧根据parentId查询摄像头列表
|
||||
mybus.off('getCameraByParentId')
|
||||
mybus.on('getCameraByParentId', (parentId) => {
|
||||
mybus.on('getCameraByParentId', (val) => {
|
||||
debugger
|
||||
this.mapSearchParam.parentId = parentId
|
||||
console.log('倒腾位置1')
|
||||
// 判断是否重置位置
|
||||
if (val.reset) {
|
||||
this.hiMapFun.mapFlyTo({lat:'36.017043',lng: '119.922772'}, 9)
|
||||
}
|
||||
this.mapSearchParam.parentId = val.id
|
||||
this.mapSearchParam.type = "1"
|
||||
this.mapSearchParam.pageSize = 10000
|
||||
this.getCameraByParentId('','department')
|
||||
|
|
@ -234,6 +250,12 @@ import { ElMessage } from 'element-plus'
|
|||
})
|
||||
},
|
||||
methods: {
|
||||
changeComplete(val) {
|
||||
if (val === '') {
|
||||
// console.log('触发清空点位')
|
||||
this.hiMapFun.removeLayerByLayerName('potcon');
|
||||
}
|
||||
},
|
||||
//查询标签视频
|
||||
queryCameraConditionPlace(data) {
|
||||
let params = {
|
||||
|
|
@ -367,13 +389,6 @@ import { ElMessage } from 'element-plus'
|
|||
this.mapSearchParam.gpsY = e.layer._latlng.lat
|
||||
this.mapSearchParam.radius = radius
|
||||
this.mapSearchParam.type = 1
|
||||
const params = {
|
||||
gpsX: this.mapSearchParam.gpsX,
|
||||
gpsY: this.mapSearchParam.gpsY,
|
||||
radius: radius,
|
||||
type: this.mapSearchParam.type,
|
||||
}
|
||||
// mybus.emit('getListByMap', params)
|
||||
this.getCameraByParentId('map')
|
||||
}
|
||||
}
|
||||
|
|
@ -387,14 +402,11 @@ import { ElMessage } from 'element-plus'
|
|||
this.addResourceTomap('videoMap', res.data.data)
|
||||
})
|
||||
} else {
|
||||
this.hiMapFun.mapFlyTo({lat:'36.017043',lng: '119.922772'}, 9)
|
||||
console.log('根据parent查询摄像头111111',this.mapSearchParam)
|
||||
// this.hiMapFun.mapFlyTo({lat:'36.017043',lng: '119.922772'}, 9)
|
||||
let params = {
|
||||
regionId:
|
||||
this.mapSearchParam.parentId ||
|
||||
'70be8c5b664f4bcf869d82f2e8335051',
|
||||
// pageNum: this.mapSearchParam.pageNum,
|
||||
// pageSize: this.mapSearchParam.type!=0?this.mapSearchParam.pageSize:10,
|
||||
name: this.mapSearchParam.cameraName || '',
|
||||
longitude: this.mapSearchParam.gpsX || '',
|
||||
latitude: this.mapSearchParam.gpsY || '',
|
||||
|
|
@ -420,8 +432,11 @@ import { ElMessage } from 'element-plus'
|
|||
if(dataName){
|
||||
params.type='0';
|
||||
}
|
||||
console.log('位置2')
|
||||
this.spinning = true;
|
||||
getCameraByCondition(params).then((res) => {
|
||||
//console.log('根据parent查询摄像头44444', res.data.data)
|
||||
this.spinning = false;
|
||||
if(type=='map'){
|
||||
let params = this.mapSearchParam;
|
||||
params.dataSource = res.data.data||0;
|
||||
|
|
@ -429,11 +444,11 @@ import { ElMessage } from 'element-plus'
|
|||
mybus.emit('getListByMap', params);
|
||||
}
|
||||
this.pointAllData = res.data.data;
|
||||
if(this.mapSearchParam.type!=0)
|
||||
// if(this.mapSearchParam.type!=0)
|
||||
this.addResourceTomap('videoMap', res.data.data)
|
||||
|
||||
else
|
||||
this.addResourceTomap('videoMap', []) //查询全部时不打点}
|
||||
// else
|
||||
// this.addResourceTomap('videoMap', []) //查询全部时不打点}
|
||||
|
||||
})
|
||||
}
|
||||
|
|
@ -509,6 +524,7 @@ import { ElMessage } from 'element-plus'
|
|||
async searchAddressByKeyWord(queryString, cb, indexX) {
|
||||
console.log('querySearch',queryString, cb,this.restaurants)
|
||||
if(queryString){
|
||||
console.log('位置3')
|
||||
getCameraByCondition({
|
||||
// pageNum: 1,
|
||||
// pageSize: 40000,
|
||||
|
|
@ -779,7 +795,7 @@ import { ElMessage } from 'element-plus'
|
|||
.leaflet-control-attribution {
|
||||
display: none;
|
||||
}
|
||||
svg,.icon-poylon {
|
||||
.icon, .icon-poylon {
|
||||
position: absolute;
|
||||
bottom: 0.1rem;
|
||||
right: 0.1rem;
|
||||
|
|
|
|||
Loading…
Reference in New Issue