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