This commit is contained in:
parent
73c0a60c2a
commit
3dc64c826e
|
|
@ -1,49 +1,93 @@
|
|||
<template>
|
||||
<view class="index-content-other" :style="transition?{opacity: `1`}:{opacity: `0`}">
|
||||
<view class="right-container-title-nav">
|
||||
<text style="margin-left: 30rpx;">
|
||||
NUID：{{ uni.getStorageSync('nuId')}}
|
||||
</text>
|
||||
<text class="new-weight">
|
||||
{{ uni.getStorageSync('nuName')}}
|
||||
</text>
|
||||
<view class="right-icons">
|
||||
<view class="title-card">
|
||||
<view class="card-top">
|
||||
<view class="card-top-left">
|
||||
50
|
||||
</view>
|
||||
<view class="card-top-right">
|
||||
<image class="right-img" src="/static/index/card/arrow.png" />
|
||||
</view>
|
||||
<view class="card-spec">
|
||||
<view class="line">
|
||||
</view>
|
||||
<view class="line-gray">
|
||||
80
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="card-bottom">
|
||||
<image class="bottom-img" src="/static/index/card/help.png" />
|
||||
<view class="bottom-font">
|
||||
护理
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="title-card">
|
||||
<view class="card-top">
|
||||
<view class="card-top-left">
|
||||
32
|
||||
</view>
|
||||
<view class="card-top-right">
|
||||
<image class="right-img" src="/static/index/card/arrow.png" />
|
||||
</view>
|
||||
<view class="card-spec">
|
||||
<view class="line">
|
||||
</view>
|
||||
<view class="line-gray">
|
||||
60
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="card-bottom">
|
||||
<image class="bottom-img" src="/static/index/card/doctor.png" />
|
||||
<view class="bottom-font">
|
||||
医疗
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="title-card">
|
||||
<view class="card-top">
|
||||
<view class="card-top-left">
|
||||
65
|
||||
</view>
|
||||
<view class="card-top-right">
|
||||
<image class="right-img" src="/static/index/card/arrow.png" />
|
||||
</view>
|
||||
<view class="card-spec">
|
||||
<view class="line">
|
||||
</view>
|
||||
<view class="line-gray">
|
||||
70
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="card-bottom">
|
||||
<image class="bottom-img" src="/static/index/card/work.png" />
|
||||
<view class="bottom-font">
|
||||
行政
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="title-time">
|
||||
<view class="time-title">
|
||||
{{ currentTime }}
|
||||
</view>
|
||||
<view class="time-date">
|
||||
{{ fullDate }}
|
||||
</view>
|
||||
<view class="right-container-tem">
|
||||
<image class="right-container-tem-img" src="/static/index/newindex/wendu/0.png" />
|
||||
<text class="right-container-tem-text">{{ (uni.getStorageSync('NUall').humidDeviceList && uni.getStorageSync('NUall').humidDeviceList[0])? uni.getStorageSync('NUall').humidDeviceList[0].temperature: '-' }}°C</text>
|
||||
<image class="right-container-tem-img" src="/static/index/newindex/wendu/1.png" />
|
||||
<text class="right-container-tem-text">{{ (uni.getStorageSync('NUall').humidDeviceList && uni.getStorageSync('NUall').humidDeviceList[0])? uni.getStorageSync('NUall').humidDeviceList[0].humidity: '-' }}%</text>
|
||||
</view>
|
||||
|
||||
<image class="right-icons-img" :src="`/static/index/undericons/man.png`" />
|
||||
<view>{{name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="scroll-vi">
|
||||
<view class="zhezhao-left"></view>
|
||||
<view class="zhezhao-right"></view>
|
||||
<scroll-view scroll-x="true" style="width: 100%;height: 100%;">
|
||||
<view style="display: flex;align-items: center;">
|
||||
<view style="width: 30rpx;"></view>
|
||||
<view v-for="(item,index) in typeArray" :key="index"
|
||||
:class="{zerotarget: movetype===0 && zeroIndex===index}" class="menu"
|
||||
:style="{backgroundColor: movetype===0 && zeroIndex===index?`#ddf0ff`:``}"
|
||||
@click="typeNow=index;zeroIndex=index;clean();movetype=0;">
|
||||
|
||||
<donghua :links="item.url" :playing="typeNow===index" />
|
||||
<text class="menu-font" :class="{ zoom: typeNow===index }"
|
||||
:style="typeNow===index?{color:`#008FF5`}:{}">
|
||||
{{item.name}}
|
||||
</text>
|
||||
</view>
|
||||
<view style="width: 100rpx;">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="photo-father">
|
||||
<view class="juzhong" style="margin-left: -30rpx;">
|
||||
<donghua :width="`1300rpx`" :height="`900rpx`" :links="blueArray" :playing="photoplay" :loop="true"
|
||||
|
|
@ -81,13 +125,12 @@
|
|||
<image class="down-img" :src="`/static/index/newindex/states/right.png`" />
|
||||
</view>
|
||||
<view style="display: flex;margin-top: 40rpx;">
|
||||
<view :class="{thirdtarget: movetype===3 && zeroIndex===0}"
|
||||
style="width: 240rpx;height: 90rpx;margin-right: 40rpx;">
|
||||
<view style="width: 240rpx;height: 90rpx;margin-right: 40rpx;">
|
||||
<view class="start-button">
|
||||
开始服务
|
||||
</view>
|
||||
</view>
|
||||
<view :class="{thirdtarget: movetype===3 && zeroIndex===1}" style="width: 240rpx;height: 90rpx;">
|
||||
<view style="width: 240rpx;height: 90rpx;">
|
||||
<view class="end-button">
|
||||
结束服务
|
||||
</view>
|
||||
|
|
@ -96,9 +139,8 @@
|
|||
</view>
|
||||
</view>
|
||||
<view class="left-menu">
|
||||
<view v-for="(item,index) in leftArray" :key="index" style="margin: 30rpx 0;"
|
||||
:class="{firsttarget: movetype===1 && zeroIndex===index}">
|
||||
<view class="left-ball" :style="{backgroundColor: movetype===1 && zeroIndex===index?`#ddf0ff`:``}">
|
||||
<view v-for="(item,index) in leftArray" :key="index" style="margin: 30rpx 0;">
|
||||
<view class="left-ball">
|
||||
<image class="left-menu-img" :src="item" />
|
||||
</view>
|
||||
|
||||
|
|
@ -110,13 +152,11 @@
|
|||
<image class="top-img" :src="`/static/index/newindex/rightmenu/top.png`"
|
||||
@click="scrollTop>0? scrollTop -= 115:scrollTop=0" />
|
||||
<scroll-view scroll-y="true" class="right-scroll" :scroll-top="scrollTop" @scroll="onScroll">
|
||||
<view style="height: 30rpx;">
|
||||
<view style="height: 20rpx;">
|
||||
|
||||
</view>
|
||||
<view v-for="(item,index) in rightMenu" :class="{secondtarget: movetype===2 && zeroIndex===index}"
|
||||
style="margin: 20rpx auto;width: 110rpx;">
|
||||
<view class="white-circle"
|
||||
:style="{backgroundColor: movetype===2 && zeroIndex===index?`#ddf0ff`:``}">
|
||||
<view v-for="(item,index) in rightMenu" style="margin: 20rpx 0;width: 110rpx;margin-left: 20rpx;">
|
||||
<view class="white-circle">
|
||||
<image class="right-menu-img" :src="item.url" />
|
||||
<view class="right-menu-name">
|
||||
{{ item.name }}
|
||||
|
|
@ -132,15 +172,30 @@
|
|||
<image class="top-img" :src="`/static/index/newindex/rightmenu/bottom.png`"
|
||||
@click="scrollTop > (55* rightMenu.length) ? scrollTop = (55* rightMenu.length) : scrollTop += 115 " />
|
||||
</view>
|
||||
<!-- 轮盘 -->
|
||||
|
||||
</view>
|
||||
|
||||
<view class="index-content-right" :style="transition?{opacity: `1`}:{opacity: `0`}">
|
||||
<view class="right-top">
|
||||
|
||||
</view>
|
||||
<view class="right-bottom">
|
||||
<view class="bottom-title">
|
||||
<image class="bottom-carmera" src="/static/index/newindex/leftmenu/carmera.png" />
|
||||
<view class="blue-button">
|
||||
长者标签
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<image class="big-older" src="/static/index/newindex/leftmenu/older.png" />
|
||||
<view class="name-weight">
|
||||
{{ uni.getStorageSync('NUall').elderInfo?.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch } from 'vue';
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
|
|
@ -204,8 +259,8 @@
|
|||
])
|
||||
const leftArray = ref(genPaths(
|
||||
'/static/index/newindex/leftmenu',
|
||||
'',
|
||||
3, // 张数
|
||||
'left',
|
||||
5, // 张数
|
||||
'png',
|
||||
0, // 起始索引
|
||||
false // 不补零
|
||||
|
|
@ -257,6 +312,7 @@
|
|||
// console.log("????",transition.value)
|
||||
setTimeout(() => {
|
||||
transition.value = true;
|
||||
// console.log("看看",uni.getStorageSync('NUall'))
|
||||
}, 50)
|
||||
} else {
|
||||
transition.value = false;
|
||||
|
|
@ -267,52 +323,87 @@
|
|||
const name = ref("");
|
||||
|
||||
// 定义响应式数据现在时间
|
||||
// const currentTime = ref('');
|
||||
// const fullDate = ref('');
|
||||
// const weekDay = ref('');
|
||||
// let timerId = null;
|
||||
// // 更新时间、日期和星期的方法
|
||||
// const updateTime = () => {
|
||||
// const now = new Date();
|
||||
const currentTime = ref('');
|
||||
const fullDate = ref('');
|
||||
const weekDay = ref('');
|
||||
let timerId = null;
|
||||
// 更新时间、日期和星期的方法
|
||||
const updateTime = () => {
|
||||
const now = new Date();
|
||||
|
||||
// // 获取当前时间的时分
|
||||
// const hours = now.getHours().toString().padStart(2, '0');
|
||||
// const minutes = now.getMinutes().toString().padStart(2, '0');
|
||||
// currentTime.value = `${hours}:${minutes}`;
|
||||
// 获取当前时间的时分
|
||||
const hours = now.getHours().toString().padStart(2, '0');
|
||||
const minutes = now.getMinutes().toString().padStart(2, '0');
|
||||
currentTime.value = `${hours}:${minutes}`;
|
||||
|
||||
// // 获取完整的日期（年/月/日）
|
||||
// const year = now.getFullYear();
|
||||
// const month = (now.getMonth() + 1).toString().padStart(2, '0');
|
||||
// const day = now.getDate().toString().padStart(2, '0');
|
||||
// fullDate.value = `${month}-${day}`;
|
||||
|
||||
// // 获取星期几
|
||||
// const weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
|
||||
// const week = weekDays[now.getDay()];
|
||||
// weekDay.value = week;
|
||||
// };
|
||||
// 获取星期几
|
||||
const weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
|
||||
const week = weekDays[now.getDay()];
|
||||
weekDay.value = week;
|
||||
|
||||
// 获取完整的日期（年/月/日）
|
||||
const year = now.getFullYear();
|
||||
const month = (now.getMonth() + 1).toString().padStart(2, '0');
|
||||
const day = now.getDate().toString().padStart(2, '0');
|
||||
fullDate.value = `${year}.${month}.${day} ${weekDay.value}`;
|
||||
};
|
||||
onMounted(() => {
|
||||
name.value = uni.getStorageSync('realname')
|
||||
typeNow.value = 0;
|
||||
// timerId = updateTime();
|
||||
// // 每秒更新一次时间
|
||||
// setInterval(updateTime, 1000);
|
||||
timerId = updateTime();
|
||||
// 每秒更新一次时间
|
||||
setInterval(updateTime, 1000);
|
||||
photoplay.value = true;
|
||||
})
|
||||
const lanjie = ref(false);
|
||||
// const clean = () => {
|
||||
// if (movetype.value == -1) {
|
||||
// lanjie.value = true;
|
||||
// emit("cleanmain")
|
||||
// }
|
||||
|
||||
// }
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.index-content-right{
|
||||
width: 19.5vw;
|
||||
margin-left: 2vw;
|
||||
height: 100%;
|
||||
transition: opacity 1s ease;
|
||||
.right-top{
|
||||
margin-top: 8vh;
|
||||
width: 100%;
|
||||
height: 50vh;
|
||||
background-color: #fff;
|
||||
border-radius: 4vh;
|
||||
}
|
||||
.right-bottom{
|
||||
margin-top: 2vh;
|
||||
width: 100%;
|
||||
height: 38vh;
|
||||
background-color: #fff;
|
||||
border-radius: 3vh;
|
||||
padding-top: 1vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.bottom-title{
|
||||
|
||||
width: 100%;
|
||||
padding: 0 8%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.bottom-carmera{
|
||||
width: 3vw;
|
||||
height: 3vw;
|
||||
}
|
||||
}
|
||||
.big-older{
|
||||
margin-top: 0.5vw;
|
||||
width: 10vw;
|
||||
height: 10vw;
|
||||
border: 1rpx solid #DCDCDC;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.index-content-other {
|
||||
width: calc(100% - 260rpx);
|
||||
// background-color: red;
|
||||
width: 65vw;
|
||||
height: 100%;
|
||||
transition: opacity 1s ease;
|
||||
position: relative;
|
||||
|
|
@ -334,81 +425,22 @@
|
|||
}
|
||||
|
||||
.right-container-title-nav {
|
||||
margin-top: 60rpx;
|
||||
margin-top: 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 60rpx;
|
||||
height: 20vh;
|
||||
position: relative;
|
||||
font-size: 28rpx;
|
||||
|
||||
.new-weight {
|
||||
margin-left: 30rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.right-icons {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 0;
|
||||
// transform: translateY(-50%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.right-icons-img {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
margin-left: 20rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-vi {
|
||||
height: 120rpx;
|
||||
width: 95%;
|
||||
margin-left: 0rpx;
|
||||
margin-top: 20rpx;
|
||||
position: relative;
|
||||
margin-bottom: 80rpx;
|
||||
|
||||
.menu {
|
||||
margin-top: 15rpx;
|
||||
flex: 0 0 auto; // 👈 关键点
|
||||
height: 90rpx;
|
||||
width: 240rpx;
|
||||
border-radius: 50rpx;
|
||||
// margin: 45rpx auto;
|
||||
margin-right: 20rpx;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-top: 9rpx;
|
||||
|
||||
.menu-img {
|
||||
width: 55rpx;
|
||||
height: 55rpx;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.menu-font {
|
||||
margin-top: 18rpx;
|
||||
font-size: 25rpx;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.date {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
margin-top: 10rpx;
|
||||
margin-top: 0.8vw;
|
||||
}
|
||||
|
||||
.right-container-tem {
|
||||
display: flex;
|
||||
margin-top: 0.8vw;
|
||||
|
||||
.right-container-tem-text {
|
||||
font-size: 30rpx;
|
||||
|
|
@ -447,7 +479,6 @@
|
|||
margin-bottom: 0rpx;
|
||||
position: relative;
|
||||
margin-left: -50rpx;
|
||||
// z-index: 3;
|
||||
}
|
||||
|
||||
.big-img {
|
||||
|
|
@ -520,7 +551,6 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 40rpx;
|
||||
// color: #fff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
|
|
@ -548,8 +578,8 @@
|
|||
|
||||
.left-menu {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 30rpx;
|
||||
top: 55%;
|
||||
left: 100rpx;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
|
|
@ -561,8 +591,8 @@
|
|||
|
||||
.left-ball {
|
||||
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
|
@ -571,14 +601,14 @@
|
|||
background-color: #fff;
|
||||
|
||||
.left-menu-img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.right-menu {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
top: 60%;
|
||||
right: 80rpx;
|
||||
transform: translateY(-50%);
|
||||
display: flex;
|
||||
|
|
@ -592,29 +622,13 @@
|
|||
padding: 0 50rpx;
|
||||
}
|
||||
|
||||
// .top-img ::before {
|
||||
// content: "";
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
|
||||
// filter: blur(10px);
|
||||
// /* 模糊强度 */
|
||||
// z-index: 1;
|
||||
// }
|
||||
|
||||
.right-scroll {
|
||||
width: 100%;
|
||||
height: 750rpx;
|
||||
// background-color: red;
|
||||
height: 650rpx;
|
||||
}
|
||||
|
||||
.white-circle {
|
||||
|
||||
height: 200rpx;
|
||||
|
||||
height: 170rpx;
|
||||
border-radius: 60rpx;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
|
|
@ -622,14 +636,16 @@
|
|||
align-items: center;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
font-size: 25rpx;
|
||||
width: 100rpx;
|
||||
|
||||
.right-menu-img {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
|
||||
.right-menu-name {
|
||||
width: 80rpx;
|
||||
width: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -694,106 +710,124 @@
|
|||
z-index: 4;
|
||||
}
|
||||
|
||||
.zerotarget {
|
||||
--color: #99C9FD;
|
||||
--thick: 2px;
|
||||
--radius: 50rpx;
|
||||
--outline-offset: 0rpx;
|
||||
/* 外扩多少 */
|
||||
/* 内层虚线（你现在用的） */
|
||||
border-radius: var(--radius);
|
||||
background-color: white;
|
||||
/* 内部背景 */
|
||||
animation: scalePulse 360ms cubic-bezier(.2, .8, .2, 1);
|
||||
/* 外层虚线：放在 outline（不会影响元素尺寸） */
|
||||
outline: var(--thick) dashed var(--color);
|
||||
outline-offset: var(--outline-offset);
|
||||
|
||||
/* 保证文本 / 子元素在最上层 */
|
||||
.title-card {
|
||||
width: 10vw;
|
||||
height: 9vw;
|
||||
border-radius: 2vw;
|
||||
background-color: #FFFFFF;
|
||||
padding: 1.6vw;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.firsttarget {
|
||||
--color: #99C9FD;
|
||||
--thick: 2px;
|
||||
--radius: 50%;
|
||||
--outline-offset: 0rpx;
|
||||
/* 外扩多少 */
|
||||
|
||||
/* 内层虚线（你现在用的） */
|
||||
border-radius: var(--radius);
|
||||
background-color: white;
|
||||
/* 内部背景 */
|
||||
animation: scalePulse 360ms cubic-bezier(.2, .8, .2, 1);
|
||||
/* 外层虚线：放在 outline（不会影响元素尺寸） */
|
||||
outline: var(--thick) dashed var(--color);
|
||||
outline-offset: var(--outline-offset);
|
||||
|
||||
/* 保证文本 / 子元素在最上层 */
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.secondtarget {
|
||||
--color: #99C9FD;
|
||||
--thick: 2px;
|
||||
--radius: 60rpx;
|
||||
--outline-offset: 0rpx;
|
||||
/* 外扩多少 */
|
||||
|
||||
/* 内层虚线（你现在用的） */
|
||||
border-radius: var(--radius);
|
||||
background-color: white;
|
||||
/* 内部背景 */
|
||||
animation: scalePulse 360ms cubic-bezier(.2, .8, .2, 1);
|
||||
/* 外层虚线：放在 outline（不会影响元素尺寸） */
|
||||
outline: var(--thick) dashed var(--color);
|
||||
outline-offset: var(--outline-offset);
|
||||
|
||||
/* 保证文本 / 子元素在最上层 */
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.thirdtarget {
|
||||
--color: #99C9FD;
|
||||
--thick: 2px;
|
||||
--radius: 40rpx;
|
||||
--outline-offset: 0rpx;
|
||||
/* 外扩多少 */
|
||||
|
||||
/* 内层虚线（你现在用的） */
|
||||
border-radius: var(--radius);
|
||||
background-color: white;
|
||||
/* 内部背景 */
|
||||
animation: scalePulse 360ms cubic-bezier(.2, .8, .2, 1);
|
||||
/* 外层虚线：放在 outline（不会影响元素尺寸） */
|
||||
outline: var(--thick) dashed var(--color);
|
||||
outline-offset: var(--outline-offset);
|
||||
|
||||
/* 保证文本 / 子元素在最上层 */
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
@keyframes scalePulse {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
margin-right: 1.5vw;
|
||||
|
||||
.card-bottom{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 3vw;
|
||||
display: flex;
|
||||
.bottom-img{
|
||||
width: 1.6vw;
|
||||
height: 1.6vw;
|
||||
margin-left: 1.8vw;
|
||||
}
|
||||
.bottom-font{
|
||||
color: #555555;
|
||||
font-size: 1.4vw;
|
||||
margin-left: 0.5vw;
|
||||
}
|
||||
}
|
||||
|
||||
25% {
|
||||
/* 先收缩一点点 */
|
||||
transform: scale(0.94);
|
||||
}
|
||||
.card-top {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
|
||||
65% {
|
||||
/* 再放大到略超出的感觉 */
|
||||
transform: scale(1.08);
|
||||
}
|
||||
.card-top-left {
|
||||
font-size: 1.8vw;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
.card-top-right {
|
||||
width: 2vw;
|
||||
height: 2vw;
|
||||
border-radius: 50%;
|
||||
background-color: #F1F2F3;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.right-img {
|
||||
width: 0.8vw;
|
||||
height: 0.8vw;
|
||||
}
|
||||
}
|
||||
|
||||
.card-spec {
|
||||
position: absolute;
|
||||
top: 1.1vw;
|
||||
left: 1.6vw;
|
||||
width: 1.5vw;
|
||||
height: 2vw;
|
||||
// background-color: #0076FF;
|
||||
|
||||
.line {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(to bottom right,
|
||||
transparent calc(50% - 1px),
|
||||
#d5d5d5 50%,
|
||||
transparent calc(50% + 1px))
|
||||
}
|
||||
|
||||
.line-gray {
|
||||
position: absolute;
|
||||
right: -1.1vw;
|
||||
bottom: -0.6vw;
|
||||
color: #888888;
|
||||
font-size: 1.3vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.title-time{
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 15vw;
|
||||
height: 9.5vw;
|
||||
border-radius: 2vw;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.time-title{
|
||||
font-weight: 600;
|
||||
font-size: 3vw;
|
||||
margin-top: 0.4vw;
|
||||
}
|
||||
.time-date{
|
||||
margin-top: 0.2vw;
|
||||
font-size: 1.3vw;
|
||||
color: #222222;
|
||||
}
|
||||
}
|
||||
.blue-button{
|
||||
margin-top: 0.5vw;
|
||||
width: 7vw;
|
||||
height: 2.5vw;
|
||||
background: linear-gradient(to bottom, #009DEF, #0076FF);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 40rpx;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.name-weight{
|
||||
font-size: 2vw;
|
||||
font-weight: 600;
|
||||
margin: 0.2vw 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -2120,7 +2120,7 @@
|
|||
bodyTagListLook.value.push(res.netPic)
|
||||
}
|
||||
})
|
||||
console.log("res11111",res)
|
||||
// console.log("res11111",res)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -2164,7 +2164,7 @@
|
|||
})
|
||||
})
|
||||
bigArray.value = res.result;
|
||||
console.log("右侧",bigArray.value)
|
||||
// console.log("右侧",bigArray.value)
|
||||
}
|
||||
downList.value = bigArray.value[0].children
|
||||
upmenuIndex.value = -1;
|
||||
|
|
|
|||
|
|
@ -61,6 +61,10 @@
|
|||
<image class="small-imge" src="/static/index/warehouse/t2.png" mode=""></image>
|
||||
医疗矩阵
|
||||
</view>
|
||||
<view class="one-button">
|
||||
<image class="small-imge" src="/static/index/warehouse/t5.png" mode=""></image>
|
||||
库房矩阵
|
||||
</view>
|
||||
</view>
|
||||
<view class="openmore-button">
|
||||
<view class="one-button">
|
||||
|
|
@ -813,7 +817,7 @@
|
|||
position: fixed;
|
||||
top: 30vh;
|
||||
left: 33.5vw;
|
||||
width: 22vw;
|
||||
width: 27.7vw;
|
||||
height: 22.5vh;
|
||||
background-color: #fff;
|
||||
z-index: 53;
|
||||
|
|
@ -847,10 +851,10 @@
|
|||
// background-color: red;
|
||||
.one-button{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
// justify-content: center;
|
||||
align-items: center;
|
||||
height: 1vw;
|
||||
width: 10vw;
|
||||
width: 8vw;
|
||||
font-size: 1.2vw;
|
||||
.small-imge{
|
||||
width: 1.5vw;
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 9.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 934 B |
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 104 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Loading…
Reference in New Issue