157 lines
3.6 KiB
Vue
157 lines
3.6 KiB
Vue
<template>
|
||
<view class="right-top">
|
||
<view class="top-title">
|
||
切换机构
|
||
</view>
|
||
<scroll-view class="top-list" scroll-y>
|
||
<view class="list-view" :style="menutarget===index?{borderColor:`#8DD6FF`,backgroundColor:`#F7F7F9`}:{}"
|
||
v-for="(item,index) in leftMenuArray" :key="index" @click="clickmenu(index)">
|
||
<image class="list-img" v-show="item.areaFlag==1"
|
||
:src="`/static/index/newindex/leftmenu/NU${item.elderInfo?.name?`blue`:`white`}.png`" />
|
||
<image class="list-img" v-show="item.areaFlag==3"
|
||
:src="`/static/index/newindex/leftmenu/ware${item.elderInfo?.name?`blue`:`white`}.png`" />
|
||
<view class="" v-show="item.areaFlag==1">
|
||
<view class="first-line">
|
||
<view style="font-size: 1.2vw;">
|
||
{{ item.nuName }}
|
||
</view>
|
||
<view class="first-line-second">
|
||
{{ item.elderInfo?.name?`入住`:`空闲` }}
|
||
</view>
|
||
</view>
|
||
<view class="second-line">
|
||
NUID:{{ item.nuId }}
|
||
</view>
|
||
</view>
|
||
<view class="" v-show="item.areaFlag==3">
|
||
<view class="first-line">
|
||
<view style="font-size: 1.2vw;">
|
||
{{ item.nuName }}
|
||
</view>
|
||
<view class="first-line-second">
|
||
{{ item.elderInfo?.name?`盘点`:`正常` }}
|
||
</view>
|
||
</view>
|
||
<view class="second-line">
|
||
NUID:{{ item.nuId }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import {
|
||
ref,
|
||
onMounted,
|
||
onBeforeUnmount,
|
||
computed,
|
||
nextTick,
|
||
watch
|
||
} from 'vue';
|
||
import {
|
||
queryPadPageList
|
||
} from '@/pages/watch/api/lunpan.js'
|
||
const menutarget = ref(-1)
|
||
// 1️⃣ 定义 emit 事件(推荐写法)
|
||
const emit = defineEmits(['change'])
|
||
const clickmenu = (index) => {
|
||
if(menutarget.value == index){
|
||
return
|
||
}
|
||
menutarget.value = index
|
||
let data = leftMenuArray.value[index]
|
||
uni.setStorageSync('nuId', data.nuId);
|
||
uni.setStorageSync('nuName', data.nuName);
|
||
uni.setStorageSync('elderId', data.elderInfo ? data.elderInfo?.id : null);
|
||
uni.setStorageSync('NUall', data);
|
||
emit('change')
|
||
uni.$emit('fullmonitor:killView');
|
||
if (data?.cameraInfo !== null && data?.cameraInfo[0].deviceName) {
|
||
uni.$emit('fullmonitor:isshow', true);
|
||
|
||
// 加点延迟吧
|
||
setTimeout(() => {
|
||
uni.$emit('fullmonitor:changeinit', data?.cameraInfo[0].deviceIndex);
|
||
}, 100)
|
||
|
||
} else {
|
||
uni.$emit('fullmonitor:isshow', false)
|
||
}
|
||
}
|
||
const leftMenuArray = ref([]);
|
||
onMounted(() => {
|
||
queryPadPageList().then((res => {
|
||
leftMenuArray.value = res.result.records;
|
||
clickmenu(0)
|
||
}))
|
||
})
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
.right-top {
|
||
margin-top: 80rpx;
|
||
width: 100%;
|
||
height: 50vh;
|
||
background-color: #fff;
|
||
border-radius: 4vh;
|
||
|
||
.top-title {
|
||
width: 100%;
|
||
height: 7vh;
|
||
display: flex;
|
||
align-items: center;
|
||
margin-left: 2vw;
|
||
font-size: 1.4vw;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.top-list {
|
||
width: 100%;
|
||
height: 41vh;
|
||
|
||
.list-view {
|
||
width: 86%;
|
||
margin-left: 7%;
|
||
height: 8vh;
|
||
border: 2rpx solid transparent;
|
||
border-radius: 7vw;
|
||
margin-bottom: 0.6vh;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.list-img {
|
||
width: 4vw;
|
||
height: 4vw;
|
||
margin-left: 0.5vw;
|
||
margin-right: 0.5vw;
|
||
}
|
||
|
||
.first-line {
|
||
display: flex;
|
||
|
||
.first-line-second {
|
||
background-color: #E5E5E5;
|
||
color: #555555;
|
||
width: 3.2vw;
|
||
height: 1.5vw;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 0.9vw;
|
||
border-radius: 0.5vw;
|
||
margin-left: 0.5vw;
|
||
}
|
||
}
|
||
|
||
.second-line {
|
||
color: #999999;
|
||
margin-top: 0.2vw;
|
||
font-size: 1vw;
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
</style> |