Skip to content

E
east-nanjing-new
Commit b0fde650 authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

小区监控视频更新

parent 77ef89d7
Hide whitespace changes
Inline Side-by-side
Showing with 211 additions and 75 deletions
src/ajax/api.ts
View file @ b0fde650
......@@ -9,6 +9,7 @@ switch (process.env.NODE_ENV) {
export default {
BASE_URL,
SOURCE_URL: 'http://zhongbang.omniview.pro/',
GET_BUILDING: '/service-basicdatasync-ddd/building', // 门牌幢列表
GET_INDUSTRY_AUTHORITY: '/service-basicdatasync-ddd/indCous', // 业委会列表
GET_COMMITTEE: '/service-basicdatasync-ddd/residentsCommittees', // 居委会列表
......@@ -38,6 +39,7 @@ export default {
GET_COMMUNITY_INFO: '/service-special-nandong/bigscreenCommunity/statistical', // 小区档案
GET_COMMUNITY_FACILITY: '/service-special-nandong/communityRelations', // 小区设施
GET_ISSUE_LIST: '/service-special-nandong/management/factors', // 管理要素列表
GET_SCORE_ISSUE: '/service-special-nandong/score/elements', // 评分要素
GET_COMBINE_LIST: '/service-special-nandong/league/linkage', // 联勤联动列表
/** 报警发短信 */
POST_ALARM: '/service-alarm-nandong/public/alarm',
......
src/store/actions.ts
View file @ b0fde650
......@@ -286,6 +286,7 @@ export default {
initCommunityData({ dispatch }: { dispatch: Dispatch }, id: string): void {
dispatch('getCommunityInfo', id)
dispatch('getIssueList', id)
dispatch('getScoreIssue', id)
dispatch('getCombineList', id)
},
async getCommunityInfo(
......@@ -314,6 +315,18 @@ export default {
).data
commit('SET_ISSUE_DATA', content)
},
async getScoreIssue(
{ commit }: { commit: Commit },
id: string
): Promise<void> {
const { content } = (
await ajax.get({
url: api.GET_SCORE_ISSUE,
params: { bigscreenCommunityId: id },
})
).data
commit('SET_SCORE_ISSUE', content)
},
async getCombineList(
{ commit }: { commit: Commit },
id: string
......
src/store/index.ts
View file @ b0fde650
......@@ -64,6 +64,7 @@ export interface GlobalStateProps {
showLoading: boolean
curView: ViewType
curMapType: string
showCommunityPoints: boolean
readonly zhenxing: any
readonly weihai: any
readonly workArea1: any
......@@ -95,6 +96,7 @@ export interface GlobalStateProps {
/** 小区页面 */
communityInfo: Partial<CommunityInfoProp>
issueData: IssueProp[]
scoreIssue: any
combineData: CombineProp
/** 工作站 */
......
src/store/mutations.ts
View file @ b0fde650
......@@ -23,6 +23,9 @@ export default {
SET_CURRENT_THEME(state: GlobalStateProps, val: ThemeType): void {
state.curTheme = val
},
SET_SHOW_COMMUNITY_POINTS(state: GlobalStateProps, val: boolean): void {
state.showCommunityPoints = val
},
SET_PROPERTY_SUMMARY(
state: GlobalStateProps,
val: { [key: string]: number }
......@@ -38,14 +41,14 @@ export default {
SET_PUBLICSAFE_GATESENTRY_SHEHUIWUYE(
// 公共安全-门岗值守-社会物业
state: GlobalStateProps,
data: { [key: string]: number }
data: { [key: string]: number }[]
): void {
state.pubulicSafeGateSenteryShehuiwuye = data
},
SET_PUBLICSAFE_GATESENTRY_ZHIGUANGONGFANG(
// 公共安全-门岗值守-直管公房
state: GlobalStateProps,
data: { [key: string]: number }
data: { [key: string]: number }[]
): void {
state.pubulicSafeGateSenteryZhiguangongfang = data
},
......@@ -162,6 +165,9 @@ export default {
SET_ISSUE_DATA(state: GlobalStateProps, data: IssueProp[]): void {
state.issueData = data
},
SET_SCORE_ISSUE(state: GlobalStateProps, data: unknown): void {
state.scoreIssue = data
},
SET_COMBINE_DATA(state: GlobalStateProps, data: CombineProp): void {
state.combineData = data
},
......
src/store/state.ts
View file @ b0fde650
......@@ -4,6 +4,7 @@ export default {
showLoading: false,
curMapType: '2D',
curView: { name: '南京东路街道', type: 'street' },
showCommunityPoints: false,
viewOptions: [
{ name: '南京东路街道', type: 'street' },
{ name: '第一工作站', type: 'work1', id: '01001' },
......@@ -195,6 +196,7 @@ export default {
pubulicLeftEconomic: {},
communityInfo: {},
issueData: [],
scoreIssue: [],
combineData: { cleanList: [], securityList: [], orderlyList: [] },
dutySum: {},
dutyList: [],
......
src/view/community.vue
View file @ b0fde650
......@@ -36,16 +36,20 @@
</div>
<SiteSelector />
<div class="operates">
<img
src="@/assets/images/map-btn5.png"
title="旋转90度"
@click="rotateAngle"
/>
<img
src="@/assets/images/map-btn6.png"
title="电瓶车入梯报警"
@click="showMonitor = true"
/>
<a-tooltip placement="left">
<img src="@/assets/images/map-btn5.png" @click="rotateAngle" />
<template #title>旋转90度</template>
</a-tooltip>
<a-tooltip placement="left">
<img src="@/assets/images/map-btn4.png" @click="showMonitor = true" />
<template #title>电瓶车入梯报警</template>
</a-tooltip>
<a-tooltip placement="left">
<img src="@/assets/images/map-btn6.png" @click="showCommunityPoints" />
<template #title>
{{ isCommunityPointsShowNow ? '隐藏' : '显示' }}小区点
</template>
</a-tooltip>
</div>
<m-modal v-model="showMonitor" title="电瓶车入梯监控" width="50%">
<div>
......@@ -54,18 +58,19 @@
</div>
</m-modal>
<m-drawer v-model="showDrawer" width="32vw">
<div class="community-device">
<p>类型：{{ drawerInfo.key }}</p>
<p>名称：{{ drawerInfo.relationName }}</p>
<div v-if="drawerInfo.beforPhoto">
<p>改造前</p>
<img :src="drawerInfo.beforPhoto" />
<m-card :title="drawerInfo.key">
<div class="drawer-info">
<p class="title">[ {{ drawerInfo.relationName }} ]</p>
<div v-if="drawerInfo.afterPhoto">
<p>整改后</p>
<img :src="drawerInfo.afterPhoto" />
</div>
<div v-if="drawerInfo.beforPhoto">
<p>整改前</p>
<img :src="drawerInfo.beforPhoto" />
</div>
</div>
<div v-if="drawerInfo.afterPhoto">
<p>改造后</p>
<img :src="drawerInfo.afterPhoto" />
</div>
</div>
</m-card>
</m-drawer>
</m-grid>
</template>
......@@ -186,19 +191,27 @@ export default defineComponent({
drawerInfo.value = e
showDrawer.value = true
}
const isCommunityPointsShowNow = ref(false)
async function showCommunityPoints() {
isCommunityPointsShowNow.value = !isCommunityPointsShowNow.value
if (!isCommunityPointsShowNow.value) {
map.value.hideCommunity()
return
}
store.commit('SET_LOADING', true)
const { content } = (
await ajax.get({
url: api.GET_COMMUNITY_IDS,
params: { bigscreenCommunityId: curId.value },
showLoading: false,
})
).data
map.value.setFilter(content)
map.value.showCommunity()
store.commit('SET_LOADING', false)
}
const handleComplete = () => {
map.value.layer('model_white_zw').visible = false
showCommunityPoints()
focusCenterAndAddLayer().layer()
loading.value = false
......@@ -254,7 +267,6 @@ export default defineComponent({
map.value.remove(points.value)
if (curBtn.value === key) {
curBtn.value = null
showCommunityPoints()
return
}
const pointList = (
......@@ -314,6 +326,8 @@ export default defineComponent({
showMonitor,
video,
handleAlarm,
isCommunityPointsShowNow,
showCommunityPoints,
}
},
})
......@@ -326,7 +340,7 @@ export default defineComponent({
right calc(49vw + .1rem)
top .45rem
z-index 999
>img
img
display block
width .2rem
height @width
......@@ -336,9 +350,25 @@ export default defineComponent({
&:hover
transform-origin right top
transform scale(1.2)
.community-device
$full()
overflow hidden
.drawer-info
height 81vh
overflow-x hidden
overflow-y auto
.title
color $blue
font-size .14rem
font-family $font-zcool
margin-bottom .1rem
>div
display flex
margin-bottom .1rem
>p
width .25rem
padding 0 .05rem
$center()
border .01rem solid $primary-border
img
flex 1
img
width 3rem
.btns
......
src/view/community/community-photo.vue
View file @ b0fde650
......@@ -3,8 +3,11 @@
<div
v-for="item in list"
:key="item.name"
:style="`background:url(${item.photo}) 100% / 100% 100% no-repeat`"
@click="handleClick(item.id)"
:style="`background:url(${
item.photo &&
item.photo.replace('http://zhongbang.omniview.pro/', prefix)
}) 100% / 100% 100% no-repeat`"
@click="handleClick(item.video)"
>
<p>{{ item.name }}</p>
<div class="mask">
......@@ -18,13 +21,15 @@
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
import photo1 from '@/assets/images/community1.png'
import photo2 from '@/assets/images/community2.png'
import photo3 from '@/assets/images/community3.png'
import { ajax } from '@/ajax'
import { computed, defineComponent, ref } from 'vue'
// import photo1 from '@/assets/images/community1.png'
// import photo2 from '@/assets/images/community2.png'
// import photo3 from '@/assets/images/community3.png'
// import { ajax } from '@/ajax'
import VideoComponent from '../components/video-component.vue'
import video from '@/assets/images/video.mp4'
import store from '@/store'
import { useRoute } from 'vue-router'
import { api } from '@/ajax'
export default defineComponent({
name: 'CommunityPhoto',
......@@ -32,7 +37,8 @@ export default defineComponent({
setup() {
const showModal = ref(false)
const src = ref<string | null>(null)
const handleClick = async (id: string) => {
const prefix = computed(() => api.SOURCE_URL)
const handleClick = async (video: string) => {
// if (!id) return
// const [{ remark2 }] = (
// await ajax.get({
......@@ -41,30 +47,67 @@ export default defineComponent({
// ).data
// src.value = remark2
src.value =
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB5KNmAWXGgAfLx1DPNngc885.mp4'
video && video.replace('http://zhongbang.omniview.pro/', prefix.value)
showModal.value = true
}
const route = useRoute()
const curId = computed(
() => (route && route.query.id) || store.state.communityOptions[0].type
)
const list = computed(() => {
if (curId.value === '527635870583459840') {
// 振兴小区
return [
{
name: '重庆北路177弄64号',
photo:
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB9AQCAEc3pAASC2UqtXWs052.jpg',
video:
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB9AVyAanZkApsdVDHEGc0527.mp4',
},
{
name: '重庆北路后门',
photo:
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB9AXyAIUKZAAIFC2qNmKI384.jpg',
video:
'http://zhongbang.omniview.pro/file/group1/M00/00/1A/CgAG5GB9AaCAPxQuAJBKkDzXu6A359.mp4',
},
{
name: '大沽路大门',
photo:
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB9AYmAT-A1AAMElShNriM149.jpg',
video:
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB9AbiAQSm8AFcZgGM-DsE721.mp4',
},
]
}
return [
{
name: '62弄朝北',
photo:
'http://zhongbang.omniview.pro/file/group1/M00/00/1A/CgAG5GB5GdOAW6qQAAvNhxSqO-g179.jpg',
video:
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB8_neAFTSLAfLx1EXkWbg945.mp4',
},
{
name: '62弄朝东',
photo:
'https://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB5Kj-AX3OMAAwPqHZi_Kg064.jpg',
video:
'http://zhongbang.omniview.pro/file/group1/M00/00/1A/CgAG5GB9AKeAStEUAYtR_B1xies646.mp4',
},
{
name: '62弄朝南',
photo:
'http://zhongbang.omniview.pro/file/group1/M00/00/1A/CgAG5GB5KrOAVcluAAnbZjB7fNA165.jpg',
video:
'http://zhongbang.omniview.pro/file/group1/M00/00/30/CgAG5WB5KrSAB6piAV39_CAFs0Y956.mp4',
},
]
})
return {
list: [
{ name: '重庆北路205号入口', photo: photo1 },
{ name: '重庆北路205号道路', photo: photo2 },
{ name: '重庆北路205号电梯', photo: photo3 },
// {
// name: '威海路163',
// photo: photo1,
// id: '05e1a5f24a224d66955ba2d22d6f64d3',
// },
// {
// name: '威海路167',
// photo: photo2,
// id: 'fc82739cb3354262850c715aa9098c83',
// },
// {
// name: '成都北路140',
// photo: photo3,
// id: '3c23b0ecd6bb4d73842617010a84cbcf',
// },
],
prefix,
list,
handleClick,
showModal,
src,
......
src/view/community/manage-issue.vue
View file @ b0fde650
......@@ -54,7 +54,7 @@
</template>
<script lang="ts">
import { defineComponent, ref, watch } from 'vue'
import { defineComponent, ref, watch, computed } from 'vue'
import { ChartTypes } from '@/components/MyComponent'
import Circle from '../components/circle.vue'
import store from '@/store'
......@@ -120,13 +120,32 @@ export default defineComponent({
max: 100,
},
})
const issues = ref([
{ name: '充电桩', value: 3 },
{ name: '监控点位', value: 30 },
{ name: '垃圾箱房', value: 5 },
{ name: '停车棚', value: 3 },
{ name: '物业公司', value: 4 },
])
const scoreIssue = computed(() => {
const data = store.state.scoreIssue
const result: any = {}
data.forEach((item: { [key: string]: string | number }) => {
const [key] = Object.keys(item)
if (!key) return
result[key] = +item[key] || 0
})
return result
})
const issues = computed(() => {
const {
monitoryPoint = 0,
garbageWing = 0,
bikeShed = 0,
propertyCompany = 0,
chargingPile = 0,
} = scoreIssue.value
return [
{ name: '充电桩', value: chargingPile },
{ name: '监控点位', value: monitoryPoint },
{ name: '垃圾箱房', value: garbageWing },
{ name: '停车棚', value: bikeShed },
{ name: '物业公司', value: propertyCompany },
]
})
return {
counts,
totalValue,
......
src/view/components/map-btns.vue
View file @ b0fde650
......@@ -2,7 +2,7 @@
<div class="map-btns" :class="{ full: fullScreen }">
<!-- <a-checkbox-group :option="options" @change="handleChange" /> -->
<template v-for="btn in btns">
<a-tooltip v-if="btn.key === 'home'" :key="btn.key" placement="right">
<a-tooltip v-if="btn.key === 'polyline'" :key="btn.key" placement="right">
<img :key="btn.key" :src="btn.icon" draggable="false" />
<template v-if="options.length > 0" #title>
<div class="btns-tip">
......@@ -67,6 +67,7 @@ import btn3 from '@/assets/images/map-btn3.png'
import btn4 from '@/assets/images/map-btn4.png'
import btn5 from '@/assets/images/map-btn5.png'
import btn6 from '@/assets/images/map-btn6.png'
import btn7 from '@/assets/images/map-btn7.png'
import d2 from '@/assets/images/2d.png'
import d3 from '@/assets/images/3d.png'
import store from '@/store'
......@@ -83,9 +84,10 @@ export default defineComponent({
const list = [
{ key: 'search', icon: btn1 },
{ key: 'full', icon: btn2 },
{ key: 'home', icon: btn3 },
{ key: '', icon: btn4 },
{ key: '', icon: btn5 },
{ key: 'points', icon: btn6 },
{ key: 'polyline', icon: btn7 },
// { key: '', icon: btn4 },
// { key: '', icon: btn5 },
// { key: '', icon: btn6 },
]
return [mapType, ...list]
......@@ -107,6 +109,12 @@ export default defineComponent({
case 'search':
searchModal.value = true
break
case 'points':
store.commit(
'SET_SHOW_COMMUNITY_POINTS',
!store.state.showCommunityPoints
)
break
default:
break
}
......@@ -292,4 +300,7 @@ $bg = rgba(6,34,67,.4)
height @width
margin-top .05rem
cursor pointer
transition .3s ease
&:hover
transform scale(1.2)
</style>
src/view/hooks/useSwitchMap.ts
View file @ b0fde650
......@@ -13,9 +13,16 @@ export default function useSwitchMap(map: any) {
},
{ immediate: true }
)
watch(
() => store.state.showCommunityPoints,
(val) => {
val ? setPoints(curViewType.value) : map.value.hideCommunity()
}
)
watch(
() => curViewType.value,
(type) => {
store.commit('SET_SHOW_COMMUNITY_POINTS', false)
setPoints(type)
if (areaLines.value && areaLines.value.length > 0) {
map.value.remove(areaLines.value)
......@@ -27,21 +34,22 @@ export default function useSwitchMap(map: any) {
// 根据条件显示小区点
function setPoints(type: string) {
const show = store.state.showCommunityPoints
switch (type) {
case 'work1':
showPoints({ gridId: store.state.workArea1.id })
show && showPoints({ gridId: store.state.workArea1.id })
map.value.focus(...store.state.workArea1.center, 7.660867453405492)
break
case 'work2':
showPoints({ gridId: store.state.workArea2.id })
show && showPoints({ gridId: store.state.workArea2.id })
map.value.focus(...store.state.workArea2.center, 7)
break
case 'work3':
showPoints({ gridId: store.state.workArea3.id })
show && showPoints({ gridId: store.state.workArea3.id })
map.value.focus(...store.state.workArea3.center, 7)
break
case 'street':
showPoints()
show && showPoints()
map.value.focus(990.973466, 10.295931, 7)
// map.value.focus(1019.614669, 54.167243, 6.5)
break
......
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