App/app-govern
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

页面切图

Browse Source
This commit is contained in:
仲么了
2023-02-27 14:56:08 +08:00
parent 89f0e79ceb
commit a8eef6d797
15 changed files with 387 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
pages/message/incident.vue
View File

@@ -1,9 +1,53 @@
<template>
<view class="content">
<uni-list :border="false">
<uni-list-item :show-badge="item<4" badgeType="error" isDot badge-text="未读" title="输入电压异常"
note="2023-02-01 15:10:29" v-for="item in 5" />
</uni-list>
<uni-card title="NPQS_682发生暂降事件" extra="未读" sub-title="2023-02-27 15:13:29" @click="jump">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
特征增幅：88%，持续时间0.047s
</view>
<view class="term-list-bottom-item">
南京市 灿能园区
</view>
<view class="term-list-bottom-item">
电压等级：0.38kV
</view>
<view class="term-list-bottom-item">
网路参数：00-B7-8D-A8-00-D3
</view>
</view>
</uni-card>
<uni-card title="NPQS_682发生暂降事件" extra="未读" sub-title="2023-02-27 15:13:29" @click="jump">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
特征增幅：88%，持续时间0.047s
</view>
<view class="term-list-bottom-item">
南京市 灿能园区
</view>
<view class="term-list-bottom-item">
电压等级：0.38kV
</view>
<view class="term-list-bottom-item">
网路参数：00-B7-8D-A8-00-D3
</view>
</view>
</uni-card>
<uni-card title="NPQS_682发生暂降事件" sub-title="2023-02-27 15:13:29" @click="jump">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
特征增幅：88%，持续时间0.047s
</view>
<view class="term-list-bottom-item">
南京市 灿能园区
</view>
<view class="term-list-bottom-item">
电压等级：0.38kV
</view>
<view class="term-list-bottom-item">
网路参数：00-B7-8D-A8-00-D3
</view>
</view>
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
</view>
</template>
@@ -19,18 +63,40 @@ export default {
},
methods: {
jump () {
console.log(123);
uni.navigateTo({ url: '/pages/message/termDetail' })
}
}
}
</script>
<style lang="scss">
.content {
padding-top: 20rpx;
// padding-top: 20rpx;
}
.term-list-bottom {
.term-list-bottom-item {
font-size: 28rpx;
margin-bottom: 10rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type {
margin-bottom: 0;
}
}
/deep/ .uni-list-item {
background-color: $uni-theme-white !important;
}
/deep/ .uni-card__header-extra-text {
color: #dd524d !important;
}
</style>

3
pages/message/report.vue
View File

@@ -33,4 +33,7 @@ export default {
/deep/ .uni-list-item {
background-color: $uni-theme-white !important;
}
/deep/ .uni-badge {
background-color: unset !important;
}
</style>

43
pages/message/term.vue Normal file
View File

@@ -0,0 +1,43 @@
<template>
<view class="content">
<uni-list :border="false">
<uni-list-item :show-badge="true" badgeType="error" isDot badge-text="未读" title="终端异常共4台"
note="2023-02-27 15:13:29" clickable @click="jump" />
<uni-list-item badgeType="error" isDot badge-text="未读" title="终端异常共1台" note="2023-02-14 15:10:29" clickable
@click="jump" />
<uni-list-item badgeType="error" isDot badge-text="未读" title="终端异常共4台" note="2023-02-10 15:10:29" clickable
@click="jump" />
</uni-list>
<uni-load-more status="nomore"></uni-load-more>
</view>
</template>
<script>
export default {
data () {
return {
title: '灿能'
}
},
onLoad () {
},
methods: {
jump () {
console.log(123);
uni.navigateTo({ url: '/pages/message/termList' })
}
}
}
</script>
<style lang="scss">
.content {
padding-top: 20rpx;
}
/deep/ .uni-list-item {
background-color: $uni-theme-white !important;
}
</style>

60
pages/message/termDetail.vue Normal file
View File

@@ -0,0 +1,60 @@
<template>
<Cn-page :loading='loading'>
<view slot='body'>
<view class='detail'>
<view class="detail-content ">
<!-- <view class="detail-content-title mb20">发生时间</view> -->
<view>2023-02-14</view>
</view>
<view class="detail-content ">
<view class="detail-content-title mb20">终端基础信息</view>
<view class="mb10">灿能园区，NPQS_681</view>
<view>网络参数：00-B7-8D-A8-00-D3</view>
</view>
<view class="detail-content ">
<view class="detail-content-title mb20">终端通讯信息</view>
<view class="mb10">NPQS_681通讯终端1次，具体如下所示</view>
<view>2023-02-14 10:59:10至2023-02-14 10:59:57</view>
</view>
<view class="detail-content ">
<view class="detail-content-title mb20">终端告警信息</view>
<view class="mb10">暂无告警信息</view>
</view>
<view class="detail-content ">
<view class="detail-content-title mb20">终端流量信息</view>
<view class="mb10">NPQS_681的流量于2023-02-14 23:59:59占总流量的0.0%</view>
</view>
</view>
</view>
</Cn-page>
</template>
<script>
export default {
data () {
return {
loading: false
}
},
methods: {
}
}
</script>
<style lang='scss'>
.detail {
padding: 20rpx 0;
.detail-content {
padding: 20rpx;
background: #fff;
margin-bottom: 20rpx;
font-size: 26rpx;
.detail-content-title {
font-size: 32rpx;
color: #111;
font-weight: 700;
}
}
}
</style>

113
pages/message/termList.vue Normal file
View File

@@ -0,0 +1,113 @@
<template>
<view class="content">
<uni-card title="灿能园区，NPQS_682发生终端状态异常一次" sub-title="2023-02-27 15:13:29" @click="jump">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>终端告警</view>
<view>0次</view>
</view>
<view class="term-list-bottom-item">
<view>通讯终端</view>
<view>1次</view>
</view>
<view class="term-list-bottom-item">
<view>终端流量</view>
<view>0次</view>
</view>
</view>
</uni-card>
<uni-card title="灿能园区，NPQS_681发生终端状态异常一次" sub-title="2023-02-27 13:13:29" @click="jump">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>终端告警</view>
<view>0次</view>
</view>
<view class="term-list-bottom-item">
<view>通讯终端</view>
<view>1次</view>
</view>
<view class="term-list-bottom-item">
<view>终端流量</view>
<view>0次</view>
</view>
</view>
</uni-card>
<uni-card title="灿能园区，NPQS_682发生终端状态异常一次" sub-title="2023-02-27 11:13:29" @click="jump">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>终端告警</view>
<view>0次</view>
</view>
<view class="term-list-bottom-item">
<view>通讯终端</view>
<view>1次</view>
</view>
<view class="term-list-bottom-item">
<view>终端流量</view>
<view>0次</view>
</view>
</view>
</uni-card>
<uni-card title="灿能园区，NPQS_682发生终端状态异常一次" sub-title="2023-02-27 09:13:29" @click="jump">
<view class="term-list-bottom">
<view class="term-list-bottom-item">
<view>终端告警</view>
<view>0次</view>
</view>
<view class="term-list-bottom-item">
<view>通讯终端</view>
<view>1次</view>
</view>
<view class="term-list-bottom-item">
<view>终端流量</view>
<view>0次</view>
</view>
</view>
</uni-card>
<uni-load-more status="nomore"></uni-load-more>
</view>
</template>
<script>
export default {
data () {
return {
title: '灿能'
}
},
onLoad () {
},
methods: {
jump () {
console.log(123);
uni.navigateTo({ url: '/pages/message/termDetail' })
}
}
}
</script>
<style lang="scss">
.content {
// padding-top: 20rpx;
}
.term-list-bottom {
.term-list-bottom-item{
font-size: 28rpx;
margin-bottom: 20rpx;
display: flex;
justify-content: space-between;
// view:first-of-type{
// color: #111;
// }
}
.term-list-bottom-item:last-of-type{
margin-bottom: 0;
}
}
/deep/ .uni-list-item {
background-color: $uni-theme-white !important;
}
</style>