| | |
| | | <a-empty style="color: #fff;" :image="simpleImage" description="暂无数据" :image-style="{ height: '60px' }" /> |
| | | </div> |
| | | <div v-else class="fz12" style="color: white;"> |
| | | <div v-for="dock in onlineDocks.data" :key="dock.sn" style="background: #3c3c3c; height: 90px; width: 250px; margin-bottom: 10px;"> |
| | | <div v-for="dock in onlineDocks.data" :key="dock.sn" style="background: #3c3c3c; height: 90px; margin-bottom: 10px;"> |
| | | <div style="border-radius: 2px; height: 100%; width: 100%;" class="flex-row flex-justify-between flex-align-center"> |
| | | <div style="float: left; padding: 0px 5px 8px 8px; width: 88%"> |
| | | <div style="width: 80%; height: 30px; line-height: 30px; font-size: 16px;"> |
| | |
| | | <div class="mt5 flex-align-center flex-row flex-justify-between" style="background: #595959;"> |
| | | <div class="flex-align-center flex-row"> |
| | | <span class="ml5 mr5"><RobotOutlined /></span> |
| | | 132 |
| | | <div class="font-bold text-hidden" style="max-width: 80px;" :style="dockInfo[dock.gateway.sn] && dockInfo[dock.gateway.sn].basic_osd?.mode_code !== EDockModeCode.Disconnected ? 'color: #00ee8b' : 'color: red;'"> |
| | | {{ dockInfo[dock.gateway.sn] ? EDockModeCode[dockInfo[dock.gateway.sn].basic_osd?.mode_code] : EDockModeCode[EDockModeCode.Disconnected] }} |
| | | </div> |
| | |
| | | <a-empty :image="simpleImage" style="color: #fff;" description="暂无数据" :image-style="{ height: '60px' }" /> |
| | | </div> |
| | | <div v-else class="fz12" style="color: white;"> |
| | | <div v-for="device in onlineDevices.data" :key="device.sn" style="background: #3c3c3c; height: 90px; width: 250px; margin-bottom: 10px;"> |
| | | <div v-for="device in onlineDevices.data" :key="device.sn" style="background: #3c3c3c; height: 90px; margin-bottom: 10px;"> |
| | | <div class="battery-slide" v-if="deviceInfo[device.sn]"> |
| | | <div style="background: #535759; width: 100%;"></div> |
| | | <div class="capacity-percent" :style="{ width: deviceInfo[device.sn].battery.capacity_percent + '%'}"></div> |
| | |
| | | </a-collapse-panel> |
| | | </a-collapse> |
| | | </div> |
| | | <Drawer title="项目设置" :styleDrawer="styleDrawer" v-model:show="showDrawer"> |
| | | <DockConfig /> |
| | | </Drawer> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts" setup> |
| | | import { styleDrawer } from './common/common' |
| | | import { computed, onMounted, reactive, ref, watch, WritableComputedRef } from 'vue' |
| | | import { EDeviceTypeName, ELocalStorageKey } from '/@/types' |
| | | import Drawer from '/@/components/Drawer/Drawer.vue' |
| | | import noData from '/@/assets/icons/no-data.png' |
| | | import { Empty } from 'ant-design-vue' |
| | | import rc from '/@/assets/icons/rc.png' |
| | |
| | | import { getDeviceTopo, getUnreadDeviceHms, updateDeviceHms } from '/@/api/manage' |
| | | import { RocketOutlined, EyeInvisibleOutlined, EyeOutlined, RobotOutlined, DoubleRightOutlined } from '@ant-design/icons-vue' |
| | | import { EHmsLevel } from '/@/types/enums' |
| | | import { UranusMqtt } from '/@/mqtt/index' |
| | | import DockConfig from './components/DockConfig.vue' |
| | | const { appContext } = getCurrentInstance() |
| | | const global = appContext.config.globalProperties |
| | | const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE |
| | | const store = useMyStore() |
| | | const username = ref(localStorage.getItem(ELocalStorageKey.Username)) |
| | |
| | | const osdVisible = ref({} as OSDVisible) |
| | | const hmsVisible = new Map<string, boolean>() |
| | | const scorllHeight = ref() |
| | | |
| | | const showDrawer = ref(false) |
| | | const onlineDevices = reactive({ |
| | | data: [] as OnlineDevice[] |
| | | }) |
| | |
| | | sn: '我是sn字段', |
| | | mode: '我是mode字段', |
| | | gateway: { |
| | | model: '我是gateway.model字段', |
| | | callsign: '我是gateway.callsign字段', |
| | | model: 'gateway.model', |
| | | callsign: 'gateway.callsign', |
| | | sn: '我是gateway.sn字段', |
| | | mode: '我是gateway.mode字段', |
| | | }, |
| | |
| | | }) |
| | | |
| | | onMounted(() => { |
| | | console.log(global, 'global') |
| | | // const mqtt = new UranusMqtt('ws://192.168.1.198:8083/mqtt', {}) |
| | | // mqtt.initMqtt() |
| | | getOnlineTopo() |
| | | setTimeout(() => { |
| | | watch(() => store.state.deviceStatusEvent, |
| | |
| | | } |
| | | |
| | | function switchVisible (e: any, device: OnlineDevice, isDock: boolean, isClick: boolean) { |
| | | if (!isClick) { |
| | | e.target.style.cursor = 'not-allowed' |
| | | return |
| | | } |
| | | if (device.sn === osdVisible.value.sn) { |
| | | osdVisible.value.visible = !osdVisible.value.visible |
| | | } else { |
| | | osdVisible.value.sn = device.sn |
| | | osdVisible.value.callsign = device.callsign |
| | | osdVisible.value.model = device.model |
| | | osdVisible.value.visible = true |
| | | osdVisible.value.gateway_sn = device.gateway.sn |
| | | osdVisible.value.is_dock = isDock |
| | | osdVisible.value.gateway_callsign = device.gateway.callsign |
| | | osdVisible.value.payloads = device.payload |
| | | } |
| | | store.commit('SET_OSD_VISIBLE_INFO', osdVisible) |
| | | showDrawer.value = !showDrawer.value |
| | | // if (!isClick) { |
| | | // e.target.style.cursor = 'not-allowed' |
| | | // return |
| | | // } |
| | | // if (device.sn === osdVisible.value.sn) { |
| | | // osdVisible.value.visible = !osdVisible.value.visible |
| | | // } else { |
| | | // osdVisible.value.sn = device.sn |
| | | // osdVisible.value.callsign = device.callsign |
| | | // osdVisible.value.model = device.model |
| | | // osdVisible.value.visible = true |
| | | // osdVisible.value.gateway_sn = device.gateway.sn |
| | | // osdVisible.value.is_dock = isDock |
| | | // osdVisible.value.gateway_callsign = device.gateway.callsign |
| | | // osdVisible.value.payloads = device.payload |
| | | // } |
| | | // store.commit('SET_OSD_VISIBLE_INFO', osdVisible) |
| | | } |
| | | |
| | | function getUnreadHms (sn: string) { |