feat 异常警告
This commit is contained in:
2
src/components.d.ts
vendored
2
src/components.d.ts
vendored
@@ -29,5 +29,7 @@ declare module 'vue' {
|
|||||||
SettingsSensorConfig: typeof import('./components/settings/sensorConfig.vue')['default']
|
SettingsSensorConfig: typeof import('./components/settings/sensorConfig.vue')['default']
|
||||||
SettingsWifiNetwork: typeof import('./components/settings/wifiNetwork.vue')['default']
|
SettingsWifiNetwork: typeof import('./components/settings/wifiNetwork.vue')['default']
|
||||||
SettingsWifiSettings: typeof import('./components/settings/wifiSettings.vue')['default']
|
SettingsWifiSettings: typeof import('./components/settings/wifiSettings.vue')['default']
|
||||||
|
WarningFilter: typeof import('./components/warning/filter.vue')['default']
|
||||||
|
WarningItem: typeof import('./components/warning/item.vue')['default']
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,10 +1,18 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
function goToWarningList() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/warning/index',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<view class="card">
|
<view class="card">
|
||||||
<view class="card-header">
|
<view class="card-header">
|
||||||
<text class="card-title">
|
<text class="card-title">
|
||||||
异常警告
|
异常警告
|
||||||
</text>
|
</text>
|
||||||
<wd-button variant="text">
|
<wd-button variant="text" @tap="goToWarningList">
|
||||||
查看全部
|
查看全部
|
||||||
</wd-button>
|
</wd-button>
|
||||||
</view>
|
</view>
|
||||||
|
|||||||
122
src/components/warning/filter.vue
Normal file
122
src/components/warning/filter.vue
Normal file
@@ -0,0 +1,122 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
const activeTab = ref(0)
|
||||||
|
const dateRange = ref('')
|
||||||
|
const level = ref('')
|
||||||
|
|
||||||
|
const tabs = ['全部', '定位异常', '高温异常']
|
||||||
|
|
||||||
|
const dateOptions = [
|
||||||
|
{ value: 'today', text: '今天' },
|
||||||
|
{ value: 'yesterday', text: '昨天' },
|
||||||
|
{ value: 'week', text: '本周' },
|
||||||
|
{ value: 'month', text: '本月' },
|
||||||
|
]
|
||||||
|
|
||||||
|
const levelOptions = [
|
||||||
|
{ value: 'all', text: '全部级别' },
|
||||||
|
{ value: 'critical', text: '严重' },
|
||||||
|
{ value: 'warning', text: '警告' },
|
||||||
|
{ value: 'info', text: '提醒' },
|
||||||
|
]
|
||||||
|
|
||||||
|
const totalCount = ref(8)
|
||||||
|
const unhandledCount = ref(3)
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="warning-filter">
|
||||||
|
<!-- 标签页 -->
|
||||||
|
<view class="tabs">
|
||||||
|
<view
|
||||||
|
v-for="(tab, index) in tabs"
|
||||||
|
:key="index"
|
||||||
|
class="tab-item"
|
||||||
|
:class="{ active: activeTab === index }"
|
||||||
|
@tap="activeTab = index"
|
||||||
|
>
|
||||||
|
<text class="tab-text">
|
||||||
|
{{ tab }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 筛选条件 -->
|
||||||
|
<view class="filters">
|
||||||
|
<uni-data-select v-model="dateRange" :localdata="dateOptions" />
|
||||||
|
<uni-data-select v-model="level" :localdata="levelOptions" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 警告统计 -->
|
||||||
|
<view class="warning-summary">
|
||||||
|
<text class="summary-text">
|
||||||
|
共{{ totalCount }}条警告,其中<text class="highlight">
|
||||||
|
{{ unhandledCount }}条
|
||||||
|
</text>未处理
|
||||||
|
</text>
|
||||||
|
<text class="unhandled-title">
|
||||||
|
未处理警告 ({{ unhandledCount }}条)
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.warning-filter {
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item {
|
||||||
|
flex: 1;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 12px 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item.active {
|
||||||
|
background-color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-text {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-item.active .tab-text {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filters {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-summary {
|
||||||
|
padding: 16px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.summary-text {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.highlight {
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unhandled-title {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
104
src/components/warning/item.vue
Normal file
104
src/components/warning/item.vue
Normal file
@@ -0,0 +1,104 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
defineProps<{
|
||||||
|
deviceName: string
|
||||||
|
tags: string[]
|
||||||
|
time: string
|
||||||
|
trigger: string
|
||||||
|
status?: '未处理' | '已处理'
|
||||||
|
}>()
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="warning-item">
|
||||||
|
<view class="item-header">
|
||||||
|
<text class="device-name">
|
||||||
|
{{ deviceName }}
|
||||||
|
</text>
|
||||||
|
<text class="status" :class="status === '已处理' ? 'processed' : 'unprocessed'">
|
||||||
|
{{ status || '未处理' }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="tags">
|
||||||
|
<view v-for="(tag, index) in tags" :key="index" class="tag">
|
||||||
|
<text class="tag-text">
|
||||||
|
{{ tag }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<text class="time">
|
||||||
|
{{ time }}
|
||||||
|
</text>
|
||||||
|
<text class="trigger">
|
||||||
|
{{ trigger }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.warning-item {
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 16px;
|
||||||
|
/* border-left: 4px solid #ff4d4f; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.device-name {
|
||||||
|
font-size: 22px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status {
|
||||||
|
font-size: 14px;
|
||||||
|
padding: 4px 12px;
|
||||||
|
border-radius: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unprocessed {
|
||||||
|
background-color: #fff1f0;
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.processed {
|
||||||
|
background-color: #f6ffed;
|
||||||
|
color: #52c41a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tags {
|
||||||
|
display: flex;
|
||||||
|
gap: 8px;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
background-color: #fff1f0;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 4px 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag-text {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #ff4d4f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #666;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.trigger {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
65
src/pages/warning/index.vue
Normal file
65
src/pages/warning/index.vue
Normal file
@@ -0,0 +1,65 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
definePage({
|
||||||
|
layout: false,
|
||||||
|
style: {
|
||||||
|
navigationStyle: 'custom',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
const warnings = [
|
||||||
|
{
|
||||||
|
deviceName: '徐工XS65H #01',
|
||||||
|
tags: ['定位异常', '警告'],
|
||||||
|
time: '14:10:04·已持续5分30秒',
|
||||||
|
trigger: '触发阈值:RTK信号弱,精度下降',
|
||||||
|
status: '未处理' as const,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
deviceName: '徐工XS65H #01',
|
||||||
|
tags: ['定位异常', '警告'],
|
||||||
|
time: '14:10:04·已持续5分30秒',
|
||||||
|
trigger: '触发阈值:RTK信号弱,精度下降',
|
||||||
|
status: '未处理' as const,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="page">
|
||||||
|
<back-nav title="异常警告" />
|
||||||
|
|
||||||
|
<view class="content">
|
||||||
|
<warning-filter />
|
||||||
|
|
||||||
|
<view class="warning-list">
|
||||||
|
<warning-item
|
||||||
|
v-for="(item, index) in warnings"
|
||||||
|
:key="index"
|
||||||
|
:device-name="item.deviceName"
|
||||||
|
:tags="item.tags"
|
||||||
|
:time="item.time"
|
||||||
|
:trigger="item.trigger"
|
||||||
|
:status="item.status"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.page {
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: #EAEFF9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
padding: 16px;
|
||||||
|
padding-top: 72px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warning-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 12px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
1
src/uni-pages.d.ts
vendored
1
src/uni-pages.d.ts
vendored
@@ -9,6 +9,7 @@ type _LocationUrl =
|
|||||||
"/pages/message/index" |
|
"/pages/message/index" |
|
||||||
"/pages/report/index" |
|
"/pages/report/index" |
|
||||||
"/pages/settings/index" |
|
"/pages/settings/index" |
|
||||||
|
"/pages/warning/index" |
|
||||||
"/pages/work/index";
|
"/pages/work/index";
|
||||||
|
|
||||||
interface NavigateToOptions {
|
interface NavigateToOptions {
|
||||||
|
|||||||
Reference in New Issue
Block a user