308 lines
7.2 KiB
Vue
308 lines
7.2 KiB
Vue
<template>
|
|
<view class="all">
|
|
<view class="all-title">
|
|
<view class="rentou">
|
|
<view class="rentou-left">
|
|
<image class="rentou-left-img" src="/static/shouye/old.png" />
|
|
|
|
</view>
|
|
<view class="rentou-right">
|
|
{{ uni.getStorageSync('realname') }}
|
|
</view>
|
|
</view>
|
|
<view class="lingdang">
|
|
<image class="lingdang-img" src="/static/shouye/lingdang.png" />
|
|
<view class="hongdian"></view>
|
|
</view>
|
|
</view>
|
|
<view class="all-menu">
|
|
<view v-for="(item,index) in menuarray" :key="index" @click="clickleftmenu(index)">
|
|
<view class="menu-one" :style="leftarraytarget===index?{backgroundColor:`#fff`}:{}">
|
|
<image class="menu-one-img" :src="`/static/shouye/menu${index}.png`" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<exit :show="exitshow" @close="exitshow=false" />
|
|
<view class="right-content">
|
|
<view class="yanfazhong" v-show="!leftarraytarget">
|
|
研发中...
|
|
</view>
|
|
<view class="yanfazhong" v-show="leftarraytarget==3">
|
|
研发中...
|
|
</view>
|
|
<view class="componentall" v-show="leftarraytarget==4">
|
|
<menusettings :isShow="leftarraytarget==4" />
|
|
</view>
|
|
<view class="componentall" v-show="leftarraytarget==1 || leftarraytarget==2">
|
|
<scroll-view scroll-y class="componentall" >
|
|
<!-- 阻止scroll对容器样式的影响 {{item.nuName}}-->
|
|
<view class="card-father">
|
|
<view class="card"
|
|
:style="{border: cardtarget === index? '4rpx dashed #1083F8': '4rpx solid transparent',backgroundColor:cardtarget === index?`#F9FCFF`:``}"
|
|
v-for="(item,index) in cardarray" :key="index" @click="clickcard(index)">
|
|
<view class="card-title">
|
|
{{ item.areaFlag=="1"?`护理单元`:`库房` }}
|
|
</view>
|
|
<view style="display: flex;margin-top: 5%;">
|
|
<view style="width: 50%;">
|
|
<view style="color: #888888;">
|
|
机构名称
|
|
</view>
|
|
<view class="card-contect">
|
|
{{ item.nuName }}
|
|
</view>
|
|
</view>
|
|
<view style="width: 50%;" v-if="item.areaFlag==`1`">
|
|
<view style="color: #888888;">
|
|
状态
|
|
</view>
|
|
<view class="card-contect">
|
|
{{ item.elderId ? `已入驻`:`未入驻` }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view style="display: flex;margin-top: 5%;">
|
|
<view style="width: 50%;">
|
|
<view style="color: #888888;">
|
|
摄影设备
|
|
</view>
|
|
<view class="card-contect">
|
|
{{ item.cameraInfo? `运行中`:`离线` }}
|
|
</view>
|
|
</view>
|
|
<view style="width: 50%;" v-if="item.areaFlag==`1`">
|
|
<view style="color: #888888;">
|
|
老人姓名
|
|
</view>
|
|
<view class="card-contect">
|
|
{{ item.elderInfo?.name }}
|
|
</view>
|
|
</view>
|
|
<view style="width: 50%;" v-if="item.areaFlag==`3`">
|
|
<view style="color: #888888;">
|
|
库管姓名
|
|
</view>
|
|
<view class="card-contect">
|
|
{{ item.fzr }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted, onBeforeUnmount, computed, nextTick, reactive } from 'vue';
|
|
import { onShow, onLoad, onHide, onBackPress } from "@dcloudio/uni-app"
|
|
import exit from "@/component/public/exit.vue"
|
|
import menusettings from '@/pages/watch/settings/menusettings.vue'
|
|
import { queryPadPageList } from '@/pages/watch/api/lunpan.js'
|
|
|
|
const menuarray = ref(["", "", "", "", "", ""])
|
|
const leftarraytarget = ref(0);
|
|
// 我这么写是为了防止安卓组件被销毁
|
|
onBackPress(() => {
|
|
return true; // 禁止返回
|
|
})
|
|
const leftMenuArray = ref([])
|
|
// 生命周期钩子
|
|
onShow(() => {
|
|
queryPadPageList().then((res => {
|
|
leftMenuArray.value = res.result.records;
|
|
|
|
}))
|
|
});
|
|
const filteredMenu = (index:number) => {
|
|
return leftMenuArray.value.filter(item => Number(item.areaFlag) - 1 == index);
|
|
}
|
|
const clickcard = (index:number) => {
|
|
if(cardtarget.value === index){
|
|
jumptopage(index)
|
|
}else{
|
|
cardtarget.value = index;
|
|
}
|
|
}
|
|
const jumptopage = (index:number) => {
|
|
|
|
uni.setStorageSync('nuId', cardarray.value[index].nuId);
|
|
uni.setStorageSync('nuName', cardarray.value[index].nuName);
|
|
uni.setStorageSync('customerId', cardarray.value[index].elderInfo ? cardarray.value[index].elderInfo?.id : null);
|
|
uni.setStorageSync('NUall', cardarray.value[index]);
|
|
|
|
if (leftarraytarget.value===1) {
|
|
uni.navigateTo({
|
|
url: '/pages/NursingNew/index'
|
|
})
|
|
} else if (leftarraytarget.value===2) {
|
|
uni.navigateTo({
|
|
url: '/pages/Warehouse/warehome',
|
|
})
|
|
}
|
|
}
|
|
const exitshow = ref(false);
|
|
const cardarray = ref([])
|
|
|
|
const cardtarget = ref(-1);
|
|
const clickleftmenu = (index : number) => {
|
|
if (index === 5) {
|
|
exitshow.value = true;
|
|
return
|
|
}
|
|
cardtarget.value=-1
|
|
if(index===1){
|
|
cardarray.value = filteredMenu(0)
|
|
// console.log("??11111111",cardarray.value)
|
|
}else if(index===2){
|
|
cardarray.value = filteredMenu(2)
|
|
// console.log("??11111111",cardarray.value)
|
|
}
|
|
leftarraytarget.value = index;
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.all {
|
|
width: 100%;
|
|
height: 100vh;
|
|
background-color: #eff0f4;
|
|
|
|
|
|
.all-title {
|
|
width: 100%;
|
|
height: 13vh;
|
|
padding: 0 3vw;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: flex-end;
|
|
|
|
.rentou {
|
|
height: 7vh;
|
|
border-radius: 3vw;
|
|
background-color: #E3E4E8;
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 28rpx;
|
|
|
|
.rentou-left {
|
|
height: 7vh;
|
|
width: 7vh;
|
|
border-radius: 50%;
|
|
background-color: #D6D7DF;
|
|
margin-right: 0.5vw;
|
|
position: relative;
|
|
|
|
.rentou-left-img {
|
|
position: absolute;
|
|
left: 0vw;
|
|
top: 0.8vw;
|
|
height: 7vh;
|
|
width: 7vh;
|
|
}
|
|
}
|
|
|
|
.rentou-right {
|
|
margin-right: 1vw;
|
|
}
|
|
}
|
|
|
|
.lingdang {
|
|
width: 5vh;
|
|
height: 5vh;
|
|
border-radius: 1.5vh;
|
|
background-color: #fff;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-bottom: 0.5vh;
|
|
position: relative;
|
|
|
|
.lingdang-img {
|
|
width: 4vh;
|
|
height: 4vh;
|
|
margin-left: 0.2vh;
|
|
}
|
|
}
|
|
}
|
|
|
|
.right-content {
|
|
width: 88%;
|
|
margin-left: 10%;
|
|
height: 86vh;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
|
|
.yanfazhong {
|
|
font-size: 40rpx;
|
|
margin-top: -10vh;
|
|
}
|
|
}
|
|
}
|
|
|
|
.hongdian {
|
|
position: absolute;
|
|
right: 0.6vh;
|
|
top: 0.6vh;
|
|
width: 1vh;
|
|
height: 1vh;
|
|
background-color: #FF5757;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.all-menu {
|
|
position: fixed;
|
|
left: 3vw;
|
|
top: 18vh;
|
|
width: 5vw;
|
|
|
|
.menu-one {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 3.8vw;
|
|
width: 3.8vw;
|
|
border-radius: 50%;
|
|
margin-top: 1.2vw;
|
|
|
|
.menu-one-img {
|
|
height: 2.3vw;
|
|
width: 2.3vw;
|
|
margin-left: 0.1vw;
|
|
}
|
|
}
|
|
}
|
|
.componentall{
|
|
width: 100%;
|
|
height: 100%;
|
|
// background-color: red;
|
|
}
|
|
.card-father{
|
|
width: 100%;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
.card{
|
|
width: 32%;
|
|
margin-left: 1%;
|
|
height: 32%;
|
|
margin-top: 1%;
|
|
background-color: #fff;
|
|
border-radius: 23rpx;
|
|
// padding: 5vw;
|
|
padding: 1.5vw 2vw;
|
|
.card-title{
|
|
font-size: 35rpx;
|
|
font-weight: 600;
|
|
}
|
|
.card-contect{
|
|
font-size: 32rpx;
|
|
}
|
|
}
|
|
}
|
|
</style> |