You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
149 lines
3.3 KiB
149 lines
3.3 KiB
<template> |
|
<view class="container"> |
|
<view class="padding-wrap"> |
|
<view class="message-box"> |
|
<view class="message-image"> |
|
<image class="image" src="@/static/msg-icon.png" mode="widthFix"></image> |
|
</view> |
|
<view class="message-info"> |
|
<view class="message-title"> |
|
报警消息 |
|
</view> |
|
<view class="message-des"> |
|
2023-07-17 09:58:26 |
|
</view> |
|
<uni-forms label-width="200upx" style="margin-top: 43upx;"> |
|
<uni-forms-item label="设备名称："><text class="form-text">空调</text></uni-forms-item> |
|
<uni-forms-item label="设备编号："><text class="form-text">A101</text></uni-forms-item> |
|
<uni-forms-item label="设备大类："><text class="form-text">空调设备</text></uni-forms-item> |
|
<uni-forms-item label="品牌型号："><text class="form-text">-</text></uni-forms-item> |
|
<uni-forms-item label="所属区域："><text class="form-text"></text></uni-forms-item> |
|
<uni-forms-item label="安装位置："><text class="form-text"></text></uni-forms-item> |
|
<uni-forms-item label="经度："><text class="form-text">120</text></uni-forms-item> |
|
<uni-forms-item label="纬度："><text class="form-text">34</text></uni-forms-item> |
|
<uni-forms-item label="消警时间："> |
|
<text class="form-text">2023-07-17 10:15:21</text> |
|
</uni-forms-item> |
|
</uni-forms> |
|
</view> |
|
</view> |
|
</view> |
|
<!-- 视频联动 --> |
|
<view class="video-box"> |
|
<view class="video-box-title">视频联动</view> |
|
<view class="video-item"> |
|
<video style="width:100%;height:100%;" title="视频名称" |
|
src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4"></video> |
|
</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
export default { |
|
data() { |
|
return {} |
|
}, |
|
onLoad() { |
|
// #ifdef APP-PLUS |
|
// #endif |
|
}, |
|
methods: { |
|
goDetail() { |
|
uni.navigateTo({ |
|
url: '/pages/message/detail' |
|
}) |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
page, |
|
.container { |
|
min-height: 100vh; |
|
background-color: #FFFFFF; |
|
|
|
/deep/.uni-forms-item { |
|
margin-bottom: 30upx; |
|
} |
|
|
|
/deep/.uni-forms-item__label { |
|
color: #90959D; |
|
font-size: 28upx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
} |
|
|
|
.form-text { |
|
color: #031945; |
|
line-height: 40upx; |
|
font-size: 28upx; |
|
font-family: PingFang SC-Regular, PingFang SC; |
|
font-weight: 400; |
|
} |
|
} |
|
|
|
.padding-wrap { |
|
padding: 30upx; |
|
} |
|
|
|
.message-box { |
|
display: flex; |
|
flex-direction: row; |
|
margin-bottom: 44upx; |
|
|
|
.message-image { |
|
display: block; |
|
margin-right: 20upx; |
|
|
|
.image { |
|
width: 88upx; |
|
height: 88upx; |
|
} |
|
} |
|
|
|
.message-info { |
|
flex: 1; |
|
color: #031945; |
|
font-size: 28upx; |
|
line-height: 40upx; |
|
font-family: PingFang SC-Bold, PingFang SC; |
|
font-weight: bold; |
|
|
|
.message-title { |
|
white-space: nowrap; |
|
text-overflow: ellipsis; |
|
} |
|
|
|
.message-des { |
|
color: #90959D; |
|
white-space: nowrap; |
|
text-overflow: ellipsis; |
|
} |
|
} |
|
} |
|
|
|
// 视频联动 |
|
.video-box { |
|
border-top: 14upx solid #F4F8FB; |
|
padding: 30upx; |
|
|
|
.video-box-title { |
|
color: #031945; |
|
font-size: 28upx; |
|
line-height: 40upx; |
|
font-family: PingFang SC-Bold, PingFang SC; |
|
font-weight: bold; |
|
margin-bottom: 30upx; |
|
} |
|
|
|
.video-item { |
|
height: 389upx; |
|
background: #B2B2B2; |
|
border-radius: 40upx; |
|
margin-bottom: 14upx; |
|
overflow: hidden; |
|
} |
|
} |
|
</style> |