Compare commits
2 Commits
2477faf957
...
4805c5157d
Author | SHA1 | Date |
---|---|---|
TimSpan | 4805c5157d | |
TimSpan | 1df26a3362 |
|
@ -12,15 +12,20 @@ declare module 'vue' {
|
||||||
AButton: typeof import('ant-design-vue/es')['Button']
|
AButton: typeof import('ant-design-vue/es')['Button']
|
||||||
ACascader: typeof import('ant-design-vue/es')['Cascader']
|
ACascader: typeof import('ant-design-vue/es')['Cascader']
|
||||||
AConfigProvider: typeof import('ant-design-vue/es')['ConfigProvider']
|
AConfigProvider: typeof import('ant-design-vue/es')['ConfigProvider']
|
||||||
|
ADivider: typeof import('ant-design-vue/es')['Divider']
|
||||||
ADropdown: typeof import('ant-design-vue/es')['Dropdown']
|
ADropdown: typeof import('ant-design-vue/es')['Dropdown']
|
||||||
AForm: typeof import('ant-design-vue/es')['Form']
|
AForm: typeof import('ant-design-vue/es')['Form']
|
||||||
AFormItem: typeof import('ant-design-vue/es')['FormItem']
|
AFormItem: typeof import('ant-design-vue/es')['FormItem']
|
||||||
AImage: typeof import('ant-design-vue/es')['Image']
|
AImage: typeof import('ant-design-vue/es')['Image']
|
||||||
AInput: typeof import('ant-design-vue/es')['Input']
|
AInput: typeof import('ant-design-vue/es')['Input']
|
||||||
AInputPassword: typeof import('ant-design-vue/es')['InputPassword']
|
AInputPassword: typeof import('ant-design-vue/es')['InputPassword']
|
||||||
|
ALayout: typeof import('ant-design-vue/es')['Layout']
|
||||||
|
ALayoutContent: typeof import('ant-design-vue/es')['LayoutContent']
|
||||||
|
ALayoutSider: typeof import('ant-design-vue/es')['LayoutSider']
|
||||||
AMenu: typeof import('ant-design-vue/es')['Menu']
|
AMenu: typeof import('ant-design-vue/es')['Menu']
|
||||||
AMenuItem: typeof import('ant-design-vue/es')['MenuItem']
|
AMenuItem: typeof import('ant-design-vue/es')['MenuItem']
|
||||||
ASegmented: typeof import('ant-design-vue/es')['Segmented']
|
ASegmented: typeof import('ant-design-vue/es')['Segmented']
|
||||||
|
ASpace: typeof import('ant-design-vue/es')['Space']
|
||||||
ASpin: typeof import('ant-design-vue/es')['Spin']
|
ASpin: typeof import('ant-design-vue/es')['Spin']
|
||||||
AStatistic: typeof import('ant-design-vue/es')['Statistic']
|
AStatistic: typeof import('ant-design-vue/es')['Statistic']
|
||||||
ATimeline: typeof import('ant-design-vue/es')['Timeline']
|
ATimeline: typeof import('ant-design-vue/es')['Timeline']
|
||||||
|
|
|
@ -1,259 +1,241 @@
|
||||||
<template>
|
<template>
|
||||||
<!-- <v-scale-screen width="1185" height="784"> -->
|
<!-- <v-scale-screen width="1185" height="784"> -->
|
||||||
<div class="content" id="app">
|
<div class="content" id="app">
|
||||||
<div class="community_top" v-if="isshow">
|
<div class="community_top" v-if="isshow">
|
||||||
<div class="lefttit">多元警情融合及预警管控平台</div>
|
<div class="lefttit">多元警情融合及预警管控平台</div>
|
||||||
<div style="margin-left: 16px">
|
<div style="margin-left: 16px">
|
||||||
<ul style="display: flex; margin-top: 14px">
|
<ul style="display: flex; margin-top: 14px">
|
||||||
<li>
|
<li>
|
||||||
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
||||||
<router-link active-class="ist2"
|
<router-link active-class="ist2" style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold" to="/index/indexmin">服务总览</router-link>
|
||||||
style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold"
|
</li>
|
||||||
to="/index/indexmin">服务总览</router-link>
|
<li>
|
||||||
</li>
|
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
||||||
<li>
|
<router-link active-class="ist" style="color: #b2b6c3; padding: 10px 18px; margin-left: 10px; vertical-align: middle; font-weight: bold" to="/index/index">安保力量</router-link>
|
||||||
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
</li>
|
||||||
<router-link active-class="ist"
|
<li>
|
||||||
style="color: #b2b6c3; padding: 10px 18px; margin-left: 10px; vertical-align: middle; font-weight: bold"
|
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
||||||
to="/index/index">安保力量</router-link>
|
<router-link active-class="ist" style="color: #b2b6c3; padding: 10px 18px; margin-left: 10px; vertical-align: middle; font-weight: bold" to="/index/command">警情推送</router-link>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
||||||
<router-link active-class="ist"
|
<router-link active-class="ist" style="color: #b2b6c3; padding: 10px 18px; margin-left: 10px; vertical-align: middle; font-weight: bold" to="/index/system">智能布控</router-link>
|
||||||
style="color: #b2b6c3; padding: 10px 18px; margin-left: 10px; vertical-align: middle; font-weight: bold"
|
</li>
|
||||||
to="/index/command">警情推送</router-link>
|
</ul>
|
||||||
</li>
|
</div>
|
||||||
<li>
|
<div style="">
|
||||||
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
<ul style="display: flex; margin-top: 14px">
|
||||||
<router-link active-class="ist"
|
<li>
|
||||||
style="color: #b2b6c3; padding: 10px 18px; margin-left: 10px; vertical-align: middle; font-weight: bold"
|
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
||||||
to="/index/system">智能布控</router-link>
|
<router-link active-class="ist3" style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold" to="/index/histordata">AI预警</router-link>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
<li>
|
||||||
</div>
|
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
||||||
<div style="">
|
<router-link active-class="ist" style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold" to="/index/analysis">统计分析</router-link>
|
||||||
<ul style="display: flex; margin-top: 14px">
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
||||||
<router-link active-class="ist3"
|
<router-link active-class="ist" style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold" to="/index/information">资源管理</router-link>
|
||||||
style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold"
|
</li>
|
||||||
to="/index/histordata">AI预警</router-link>
|
</ul>
|
||||||
</li>
|
<el-popconfirm title="确定退出吗?" @confirm="confirmEvent">
|
||||||
<li>
|
<template #reference>
|
||||||
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
<el-icon :size="20" style="display: inline-block; position: absolute; top: 31px; right: 32px; margin-left: 10px; vertical-align: middle; color: #9a4b48; font-weight: bold">
|
||||||
<router-link active-class="ist"
|
<switch-button />
|
||||||
style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold"
|
<span style="color: #fff; position: absolute; right: 29px; font-weight: 100; font-size: 16px">{{ loginname }}</span>
|
||||||
to="/index/analysis">统计分析</router-link>
|
</el-icon>
|
||||||
</li>
|
</template>
|
||||||
<li>
|
</el-popconfirm>
|
||||||
<img style="vertical-align: middle" src="@/views/page/indeximag/ddh.png" alt="" />
|
</div>
|
||||||
<router-link active-class="ist"
|
</div>
|
||||||
style="color: #b2b6c3; padding: 10px 18px; vertical-align: middle; font-weight: bold"
|
<div class="community_center" v-if="isshow">
|
||||||
to="/index/information">资源管理</router-link>
|
<router-view></router-view>
|
||||||
</li>
|
</div>
|
||||||
</ul>
|
|
||||||
<el-popconfirm title="确定退出吗?" @confirm="confirmEvent">
|
|
||||||
<template #reference>
|
|
||||||
<el-icon :size="20"
|
|
||||||
style="display: inline-block; position: absolute; top: 31px; right: 32px; margin-left: 10px; vertical-align: middle; color: #9a4b48; font-weight: bold">
|
|
||||||
<switch-button />
|
|
||||||
<span style="color:#fff;position: absolute;right: 29px;font-weight: 100;font-size: 16px;">{{loginname}}</span>
|
|
||||||
</el-icon>
|
|
||||||
</template>
|
|
||||||
</el-popconfirm>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="community_center" v-if="isshow">
|
|
||||||
<router-view></router-view>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<router-view v-if="!isshow"></router-view>
|
<router-view v-if="!isshow"></router-view>
|
||||||
</div>
|
</div>
|
||||||
<!-- </v-scale-screen> -->
|
<!-- </v-scale-screen> -->
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { useUserStore } from '@/stores/modules/userStore'
|
import { useUserStore } from '@/stores/modules/userStore'
|
||||||
import { useWebSocket } from '@vueuse/core'
|
import { useWebSocket } from '@vueuse/core'
|
||||||
import { wsUrl } from '@/utils/webSocket'
|
import { wsUrl } from '@/utils/webSocket'
|
||||||
import { ref, reactive, watch, onMounted } from 'vue'
|
import { ref, reactive, watch, onMounted } from 'vue'
|
||||||
import api from '@/axios'
|
import api from '@/axios'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const isshow = ref(true)
|
const isshow = ref(true)
|
||||||
const loginname = localStorage.getItem('loginname')
|
const loginname = localStorage.getItem('loginname')
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
stationWebsocket()
|
stationWebsocket()
|
||||||
setInterval(function () {
|
setInterval(function () {
|
||||||
api.post('/multialarm/client/user/active', {}).then((res) => {
|
api.post('/multialarm/client/user/active', {}).then((res) => {
|
||||||
console.log('token保活', res)
|
console.log('token保活', res)
|
||||||
})
|
})
|
||||||
}, 180000)
|
}, 180000)
|
||||||
})
|
})
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => router.currentRoute.value,
|
() => router.currentRoute.value,
|
||||||
(newValue : any) => {
|
(newValue: any) => {
|
||||||
// console.log('newValue', newValue)
|
// console.log('newValue', newValue)
|
||||||
if (newValue.path == '/index/communitymanage' || newValue.path == '/index/hkplay') {
|
if (newValue.path == '/index/communitymanage' || newValue.path == '/index/hkplay') {
|
||||||
isshow.value = false
|
isshow.value = false
|
||||||
}
|
}
|
||||||
if (newValue.path == '/index/communitymanage' || newValue.path == '/index/cwPlay') {
|
if (newValue.path == '/index/communitymanage' || newValue.path == '/index/cwPlay') {
|
||||||
isshow.value = false
|
isshow.value = false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ immediate: true }
|
{ immediate: true }
|
||||||
)
|
)
|
||||||
let istab = ref('6')
|
let istab = ref('6')
|
||||||
const sendStationList = (rollCall_websocket : any, stationTempArr : any) => {
|
const sendStationList = (rollCall_websocket: any, stationTempArr: any) => {
|
||||||
var getIot = {
|
var getIot = {
|
||||||
msgcode: 102,
|
msgcode: 102,
|
||||||
msgname: 'station-sensor-list',
|
msgname: 'station-sensor-list',
|
||||||
message: stationTempArr,
|
message: stationTempArr,
|
||||||
}
|
}
|
||||||
var msg = JSON.stringify(getIot)
|
var msg = JSON.stringify(getIot)
|
||||||
rollCall_websocket.send(msg)
|
rollCall_websocket.send(msg)
|
||||||
}
|
}
|
||||||
const stationHashList = ref([])
|
const stationHashList = ref([])
|
||||||
const stationWebsocket = () => {
|
const stationWebsocket = () => {
|
||||||
//心跳检测 建立链接 断开重连
|
//心跳检测 建立链接 断开重连
|
||||||
const { data, ws } = useWebSocket(wsUrl('/ClientWebSocket'), {
|
const { data, ws } = useWebSocket(wsUrl('/ClientWebSocket'), {
|
||||||
heartbeat: {
|
heartbeat: {
|
||||||
message: 'ping',
|
message: 'ping',
|
||||||
interval: 1000 * 10,
|
interval: 1000 * 10,
|
||||||
pongTimeout: 1000 * 10,
|
pongTimeout: 1000 * 10,
|
||||||
},
|
},
|
||||||
autoReconnect: true,
|
autoReconnect: true,
|
||||||
})
|
})
|
||||||
ws.value.onopen = () => {
|
ws.value.onopen = () => {
|
||||||
console.log('链接打开')
|
console.log('链接打开')
|
||||||
var messageObj = {
|
var messageObj = {
|
||||||
msgcode: 100,
|
msgcode: 100,
|
||||||
msgname: 'session',
|
msgname: 'session',
|
||||||
message: useUserStore().getToken,
|
message: useUserStore().getToken,
|
||||||
}
|
}
|
||||||
var msg = JSON.stringify(messageObj)
|
var msg = JSON.stringify(messageObj)
|
||||||
ws.value.send(msg)
|
ws.value.send(msg)
|
||||||
var stationTempArr = []
|
var stationTempArr = []
|
||||||
for (var i in stationHashList.value) {
|
for (var i in stationHashList.value) {
|
||||||
stationTempArr.push(i)
|
stationTempArr.push(i)
|
||||||
if (stationTempArr.length >= 500) {
|
if (stationTempArr.length >= 500) {
|
||||||
sendStationList(ws.value, stationTempArr)
|
sendStationList(ws.value, stationTempArr)
|
||||||
stationTempArr = []
|
stationTempArr = []
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
sendStationList(ws.value, stationTempArr)
|
sendStationList(ws.value, stationTempArr)
|
||||||
}
|
}
|
||||||
ws.value.onclose = () => {
|
ws.value.onclose = () => {
|
||||||
// console.log('断开重连')
|
// console.log('断开重连')
|
||||||
//重连
|
//重连
|
||||||
// stationWebsocket();
|
// stationWebsocket();
|
||||||
}
|
}
|
||||||
ws.value.onmessage = function (evt) {
|
ws.value.onmessage = function (evt) {
|
||||||
var data = JSON.parse(evt.data)
|
var data = JSON.parse(evt.data)
|
||||||
var msgcode = data['msgcode']
|
var msgcode = data['msgcode']
|
||||||
var message = data['message']
|
var message = data['message']
|
||||||
switch (msgcode) {
|
switch (msgcode) {
|
||||||
case 1035: //获取传感器列表
|
case 1035: //获取传感器列表
|
||||||
// jinbao.value.push(message[0])
|
// jinbao.value.push(message[0])
|
||||||
useUserStore().setwebsoketdata(message[0])
|
useUserStore().setwebsoketdata(message[0])
|
||||||
break
|
break
|
||||||
case 1020: //接受别处登录的消息
|
case 1020: //接受别处登录的消息
|
||||||
// kickout(message);
|
// kickout(message);
|
||||||
break
|
break
|
||||||
default:
|
default:
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const toStudent = (a : any) => {
|
const toStudent = (a: any) => {
|
||||||
istab = a
|
istab = a
|
||||||
switch (a) {
|
switch (a) {
|
||||||
case '1':
|
case '1':
|
||||||
router.push('/index/index')
|
router.push('/index/index')
|
||||||
break
|
break
|
||||||
case '2':
|
case '2':
|
||||||
router.push('/index/histordata')
|
router.push('/index/histordata')
|
||||||
break
|
break
|
||||||
case '3':
|
case '3':
|
||||||
router.push('/index/system')
|
router.push('/index/system')
|
||||||
break
|
break
|
||||||
case '4':
|
case '4':
|
||||||
router.push('/index/command')
|
router.push('/index/command')
|
||||||
break
|
break
|
||||||
case '5':
|
case '5':
|
||||||
// router.push('/index/command')
|
// router.push('/index/command')
|
||||||
break
|
break
|
||||||
case '6':
|
case '6':
|
||||||
router.push('/index/indexmin')
|
router.push('/index/indexmin')
|
||||||
break
|
break
|
||||||
case '7':
|
case '7':
|
||||||
router.push('/index/information')
|
router.push('/index/information')
|
||||||
break
|
break
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const confirmEvent = () => {
|
const confirmEvent = () => {
|
||||||
console.log('退出')
|
console.log('退出')
|
||||||
localStorage.clear()
|
localStorage.clear()
|
||||||
// router.push('/login')
|
// router.push('/login')
|
||||||
// router.push({
|
// router.push({
|
||||||
// path: '/login'
|
// path: '/login'
|
||||||
// })
|
// })
|
||||||
location.reload()
|
location.reload()
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.ist {
|
.ist {
|
||||||
// background-image: url(@/assets/images/nav.png);
|
// background-image: url(@/assets/images/nav.png);
|
||||||
background-image: url(@/views/page/indeximag/dhxz.png);
|
background-image: url(@/views/page/indeximag/dhxz.png);
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
padding: 10px 18px;
|
padding: 10px 18px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
// background-size: 100% 100%;
|
// background-size: 100% 100%;
|
||||||
// background-repeat: no-repeat;
|
// background-repeat: no-repeat;
|
||||||
// background-position: center;
|
// background-position: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ist2 {
|
.ist2 {
|
||||||
background-image: url(@/views/page/indeximag/dhxz.png);
|
background-image: url(@/views/page/indeximag/dhxz.png);
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
padding: 10px 18px;
|
padding: 10px 18px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ist3 {
|
.ist3 {
|
||||||
background-image: url(@/views/page/indeximag/dhxz.png);
|
background-image: url(@/views/page/indeximag/dhxz.png);
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
padding: 10px 18px;
|
padding: 10px 18px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.active {
|
.active {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.content {
|
.content {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
// background: #142738;
|
// background: #142738;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
position: relative;
|
|
||||||
// background-image: url(@/assets/images/community_container.jpg);
|
// background-image: url(@/assets/images/community_container.jpg);
|
||||||
// background-size: 100% 100%;
|
// background-size: 100% 100%;
|
||||||
// background-repeat: no-repeat;
|
// background-repeat: no-repeat;
|
||||||
|
|
||||||
.community_top {
|
.community_top {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 60px;
|
height: 77px;
|
||||||
// position: absolute;
|
|
||||||
// top: 0;
|
|
||||||
// background:#4880FF;
|
// background:#4880FF;
|
||||||
background: #07315e;
|
background: #07315e;
|
||||||
// background-image: url(@/views/page/imag/titleBg1.png);
|
// background-image: url(@/views/page/imag/titleBg1.png);
|
||||||
|
@ -262,74 +244,74 @@
|
||||||
background-position-x: 55%;
|
background-position-x: 55%;
|
||||||
display: flex;
|
display: flex;
|
||||||
// justify-content: space-between;
|
// justify-content: space-between;
|
||||||
.title {
|
.title {
|
||||||
float: left;
|
float: left;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 400px;
|
width: 400px;
|
||||||
line-height: 80px;
|
line-height: 80px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 29px;
|
font-size: 29px;
|
||||||
font-family: pmzd;
|
font-family: pmzd;
|
||||||
font-weight: 550;
|
font-weight: 550;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
// background: linear-gradient(to bottom, #fff, #9cd7ff);
|
// background: linear-gradient(to bottom, #fff, #9cd7ff);
|
||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
}
|
}
|
||||||
.lefttit{
|
.lefttit {
|
||||||
height: 60px;
|
height: 60px;
|
||||||
line-height: 60px;
|
line-height: 60px;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
letter-spacing: 2px;
|
letter-spacing: 2px;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
background: -webkit-linear-gradient(45deg, #ffffff, #a1d7ff);
|
background: -webkit-linear-gradient(45deg, #ffffff, #a1d7ff);
|
||||||
-webkit-background-clip: text;
|
-webkit-background-clip: text;
|
||||||
-webkit-text-fill-color: transparent;
|
-webkit-text-fill-color: transparent;
|
||||||
// background: linear-gradient(to bottom, #ffffff, #a1d7ff);
|
// background: linear-gradient(to bottom, #ffffff, #a1d7ff);
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.community_top>ul:first-child {
|
.community_top > ul:first-child {
|
||||||
left: 44px;
|
left: 44px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.community_top>ul:first-child,
|
.community_top > ul:first-child,
|
||||||
.community_top>ul:last-child {
|
.community_top > ul:last-child {
|
||||||
width: 524px;
|
width: 524px;
|
||||||
float: left;
|
float: left;
|
||||||
height: 24px;
|
height: 24px;
|
||||||
margin-top: 23px;
|
margin-top: 23px;
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.community_top>ul:first-child>li,
|
.community_top > ul:first-child > li,
|
||||||
.community_top>ul:last-child>li {
|
.community_top > ul:last-child > li {
|
||||||
float: left;
|
float: left;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-family: ysbth;
|
font-family: ysbth;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
background: #1f1757;
|
background: #1f1757;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
padding: 2px 0px;
|
padding: 2px 0px;
|
||||||
}
|
}
|
||||||
.community_center {
|
.community_center {
|
||||||
// width: calc(100% - 100px);
|
// width: calc(100% - 100px);
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: calc(100% - 51px);
|
height: calc(100% - 51px);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
// height: 100%;
|
// height: 100%;
|
||||||
// margin: 10px 50px 30px 50px;
|
// margin: 10px 50px 30px 50px;
|
||||||
// position: absolute;
|
// position: absolute;
|
||||||
// position: relative;
|
// position: relative;
|
||||||
// background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 31, 65, 1));
|
// background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 31, 65, 1));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -20,15 +20,6 @@
|
||||||
<div @click="qhzty('3')" :class="{ active: isActive == '3' }">医疗单位</div>
|
<div @click="qhzty('3')" :class="{ active: isActive == '3' }">医疗单位</div>
|
||||||
<div @click="qhzty('5')" :class="{ active: isActive == '5' }">其他</div>
|
<div @click="qhzty('5')" :class="{ active: isActive == '5' }">其他</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="searchBox" v-show="show3">
|
|
||||||
<el-form-item label="">
|
|
||||||
<el-input v-model="searchValue" placeholder="请输入搜索关键词">
|
|
||||||
<template #append>
|
|
||||||
<el-button @click="onSearch" :icon="Search" />
|
|
||||||
</template>
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<div class="searchBox">
|
<div class="searchBox">
|
||||||
<a-cascader
|
<a-cascader
|
||||||
|
@ -43,11 +34,7 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- <button @click="refreshTreeData">刷新</button> -->
|
<div ref="scrollContainer" v-loading="loading" class="scrollContainer">
|
||||||
<!-- height: 75%; -->
|
|
||||||
<div ref="scrollContainer" v-loading="loading" style="margin: 10px 20px; height: 70%; overflow: auto">
|
|
||||||
<!-- —————————————————————————————重要的事情说三遍: key 值必须唯一 ————————————————————————————— -->
|
|
||||||
<!-- —————————————————————————————重要的事情说三遍: key 值必须唯一 ————————————————————————————— -->
|
|
||||||
<!-- —————————————————————————————重要的事情说三遍: key 值必须唯一 ————————————————————————————— -->
|
<!-- —————————————————————————————重要的事情说三遍: key 值必须唯一 ————————————————————————————— -->
|
||||||
<a-tree
|
<a-tree
|
||||||
:fieldNames="{ key: 'code', title: 'title', children: 'children' }"
|
:fieldNames="{ key: 'code', title: 'title', children: 'children' }"
|
||||||
|
@ -211,21 +198,21 @@
|
||||||
<p style="color: rgb(179, 194, 208)">视频点位:</p>
|
<p style="color: rgb(179, 194, 208)">视频点位:</p>
|
||||||
<ul v-if="ingrssddata">
|
<ul v-if="ingrssddata">
|
||||||
<li style="text-align: center; color: #fff" v-if="ingrssddata.ipcList.length < 1">暂无数据</li>
|
<li style="text-align: center; color: #fff" v-if="ingrssddata.ipcList.length < 1">暂无数据</li>
|
||||||
<li v-else style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)" v-for="(item, index) in ingrssddata.ipcList">{{ item.title }}</li>
|
<li v-else style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)" v-for="(item, index) in ingrssddata.ipcList" :key="index">{{ item.title }}</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top: 10px">
|
<div style="margin-top: 10px">
|
||||||
<p style="color: rgb(179, 194, 208)">安保点位:</p>
|
<p style="color: rgb(179, 194, 208)">安保点位:</p>
|
||||||
<ul v-if="ingrssddata">
|
<ul v-if="ingrssddata">
|
||||||
<li style="text-align: center; color: #fff" v-if="ingrssddata.mobileList.length < 1">暂无数据</li>
|
<li style="text-align: center; color: #fff" v-if="ingrssddata.mobileList.length < 1">暂无数据</li>
|
||||||
<li style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)" v-for="(item, index) in ingrssddata.mobileList">{{ item.title }}</li>
|
<li style="margin-left: 20px; margin-top: 10px; color: rgb(1, 216, 226)" v-for="(item, index) in ingrssddata.mobileList" :key="index">{{ item.title }}</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-top: 10px">
|
<div style="margin-top: 10px">
|
||||||
<p style="color: rgb(179, 194, 208)">文件列表:</p>
|
<p style="color: rgb(179, 194, 208)">文件列表:</p>
|
||||||
<ul v-if="ingrssddata">
|
<ul v-if="ingrssddata">
|
||||||
<li style="text-align: center; color: #fff" v-if="ingrssddata.fileList.length < 1">暂无数据</li>
|
<li style="text-align: center; color: #fff" v-if="ingrssddata.fileList.length < 1">暂无数据</li>
|
||||||
<li style="display: inline-block; margin-right: 5px" v-for="(item, index) in ingrssddata.fileList">
|
<li style="display: inline-block; margin-right: 5px" v-for="(item, index) in ingrssddata.fileList" :key="index">
|
||||||
<el-image
|
<el-image
|
||||||
style="width: 150px; height: 150px"
|
style="width: 150px; height: 150px"
|
||||||
v-if="item.type == 'image'"
|
v-if="item.type == 'image'"
|
||||||
|
@ -404,20 +391,15 @@ import closeimag from './imag/infoClose.png'
|
||||||
import { Ref, ref, watch, onMounted, onBeforeMount, reactive, getCurrentInstance, nextTick } from 'vue'
|
import { Ref, ref, watch, onMounted, onBeforeMount, reactive, getCurrentInstance, nextTick } from 'vue'
|
||||||
import type { CascaderProps } from 'ant-design-vue'
|
import type { CascaderProps } from 'ant-design-vue'
|
||||||
import type { ShowSearchType } from 'ant-design-vue/es/cascader'
|
import type { ShowSearchType } from 'ant-design-vue/es/cascader'
|
||||||
// import AMapLoader from "@amap/amap-jsapi-loader";
|
|
||||||
const value = ref<string[]>([])
|
const value = ref<string[]>([])
|
||||||
const options = ref<any[]>([])
|
const options = ref<any[]>([])
|
||||||
const filter: ShowSearchType['filter'] = (inputValue, path) => {
|
const filter: ShowSearchType['filter'] = (inputValue, path) => {
|
||||||
// console.log(inputValue, path)
|
|
||||||
|
|
||||||
return path.some((option) => option.title.toLowerCase().indexOf(inputValue.toLowerCase()) > -1)
|
return path.some((option) => option.title.toLowerCase().indexOf(inputValue.toLowerCase()) > -1)
|
||||||
}
|
}
|
||||||
const cascaderChange = (value: any, selectedOptions: any): void => {
|
const cascaderChange = (value: any, selectedOptions: any): void => {
|
||||||
// console.log('cascaderChange', value, selectedOptions)
|
|
||||||
// selectedKeys.value.push(value.slice(-1)[0])
|
|
||||||
let title = selectedOptions.slice(-1)[0]?.title
|
let title = selectedOptions.slice(-1)[0]?.title
|
||||||
expandedKeys.value = value
|
expandedKeys.value = value
|
||||||
scrollToMatchedNode(title) //此功能还有bug:滑动会带着父元素一起滑动
|
// scrollToMatchedNode(title) //此功能还有bug:滑动会带着父元素一起滑动
|
||||||
}
|
}
|
||||||
|
|
||||||
const showIframe = ref(false)
|
const showIframe = ref(false)
|
||||||
|
@ -456,7 +438,6 @@ const qhzty2 = (data: any) => {
|
||||||
isActive1.value = data
|
isActive1.value = data
|
||||||
}
|
}
|
||||||
|
|
||||||
//
|
|
||||||
watch(
|
watch(
|
||||||
() => useUserStore().getsoketData,
|
() => useUserStore().getsoketData,
|
||||||
(newValue: any) => {
|
(newValue: any) => {
|
||||||
|
@ -583,8 +564,6 @@ const qhzty = (data: any) => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const fieldNames: TreeProps['fieldNames'] = {
|
const fieldNames: TreeProps['fieldNames'] = {
|
||||||
// children: 'children',
|
|
||||||
// title: 'title',
|
|
||||||
key: 'code',
|
key: 'code',
|
||||||
}
|
}
|
||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
|
@ -628,10 +607,6 @@ const checkKeyExists = (nodes: any, key: string): boolean => {
|
||||||
// 展开指定 树节点
|
// 展开指定 树节点
|
||||||
const scrollToKey = (key: string) => {
|
const scrollToKey = (key: string) => {
|
||||||
console.log('scrollToKey', key)
|
console.log('scrollToKey', key)
|
||||||
|
|
||||||
// console.log('treeRef________', treeRef.value.scrollTo)
|
|
||||||
// 验证 key 是否存在于树中
|
|
||||||
// const exists = treedataall.value.some((node) => node.key === key || node.children?.some((child: any) => child.key === key))
|
|
||||||
const exists = checkKeyExists(treedataall.value, key)
|
const exists = checkKeyExists(treedataall.value, key)
|
||||||
if (!exists) {
|
if (!exists) {
|
||||||
console.error(`Key ${key} not found in the tree.`)
|
console.error(`Key ${key} not found in the tree.`)
|
||||||
|
@ -1462,7 +1437,7 @@ var state = {
|
||||||
const initMap = () => {
|
const initMap = () => {
|
||||||
let latitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['latitude']
|
let latitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['latitude']
|
||||||
let longitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['longitude']
|
let longitude = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['longitude']
|
||||||
// var cluster;
|
|
||||||
state.map = new AMap.Map(state.id, {
|
state.map = new AMap.Map(state.id, {
|
||||||
// center: [113.015117, 28.209425],
|
// center: [113.015117, 28.209425],
|
||||||
center: [longitude, latitude],
|
center: [longitude, latitude],
|
||||||
|
@ -1475,9 +1450,12 @@ const initMap = () => {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
// .input-with-select .el-input-group__prepend {
|
.scrollContainer {
|
||||||
// background-color: var(--el-fill-color-blank);
|
margin: 10px 20px;
|
||||||
// }
|
height: 70%;
|
||||||
|
overflow: auto;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
.slide-fade-enter-active {
|
.slide-fade-enter-active {
|
||||||
transition: all 0.3s linear;
|
transition: all 0.3s linear;
|
||||||
}
|
}
|
||||||
|
@ -1757,7 +1735,7 @@ const initMap = () => {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
// position: absolute;
|
// position: absolute !important;
|
||||||
|
|
||||||
.left-cont {
|
.left-cont {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
Loading…
Reference in New Issue