Commit 6d1b59a856c1113392d8a4486546d66b9d3f5025

Authored by loveumiko
1 parent b2bfdf0d

fix: 修复告警记录筛选界面底部兼容问题

1 1 <template>
2   - <u-popup @close="$emit('close')" closeable bgColor="transparent" :overlay="true" :show="show" mode="bottom">
  2 + <u-popup @close="$emit('close')" closeable :safeAreaInsetBottom="false" bgColor="transparent" :overlay="true" :show="show" mode="bottom">
3 3 <view class="popup-page">
4 4 <view class="popup-text"><text class="text">{{$t('device.alarmFiltering')}}</text></view>
5 5 <view class="popup-alarm-page u-flex">
6 6 <view>
7   - <query-item ref="queryItemAlarmStatusRef" :leftText="$t(leftAlarmStatusText)" :queryStatus="alertStatus.map(item=>({...item,name:$t(item.name)}))"
  7 + <view style="margin-left:98rpx">
  8 + <query-item ref="queryItemAlarmStatusRef" :leftText="$t(leftAlarmStatusText)" :queryStatus="alertStatus.map(item=>({...item,name:$t(item.name)}))"
8 9 @currentClick="getAlarmStatus"></query-item>
9   - <query-item ref="queryDeviceTypeStatusRef" :leftText="$t(leftDeviceTypeText)" :queryStatus="deviceType.map(item=>({...item,name:$t(item.name)}))"
10   - @currentClick="getDeviceType"></query-item>
11   - <query-item ref="queryItemAlarmLevelRef" :leftText="$t(leftAlarmLevelText)" :queryStatus="alertLevel.map(item=>({...item,name:$t(item.name)}))"
12   - @currentClick="getAlarmLevel"></query-item>
13   - <query-item ref="queryItemSelectTimeRef" :leftText="$t(leftSelectTimeText)" :queryStatus="timeArea.map(item=>({...item,name:$t(item.name)}))"
14   - @currentClick="getSelectTime"></query-item>
15   - <view class="select-date">
16   - <view class="home-text-muted">{{ $t('device.selectDate') }}</view>
17   - <view class="datetime-picker">
18   - <uni-datetime-picker return-type="timestamp" v-model="range" type="datetimerange"
19   - :rangeSeparator="$t('common.toText')" />
  10 + <query-item ref="queryDeviceTypeStatusRef" :leftText="$t(leftDeviceTypeText)" :queryStatus="deviceType.map(item=>({...item,name:$t(item.name)}))"
  11 + @currentClick="getDeviceType"></query-item>
  12 + <query-item ref="queryItemAlarmLevelRef" :leftText="$t(leftAlarmLevelText)" :queryStatus="alertLevel.map(item=>({...item,name:$t(item.name)}))"
  13 + @currentClick="getAlarmLevel"></query-item>
  14 + <query-item ref="queryItemSelectTimeRef" :leftText="$t(leftSelectTimeText)" :queryStatus="timeArea.map(item=>({...item,name:$t(item.name)}))"
  15 + @currentClick="getSelectTime"></query-item>
  16 + <view class="select-date">
  17 + <view class="home-text-muted">{{ $t('device.selectDate') }}</view>
  18 + <view class="datetime-picker">
  19 + <uni-datetime-picker return-type="timestamp" v-model="range" type="datetimerange"
  20 + :rangeSeparator="$t('common.toText')" />
  21 + </view>
20 22 </view>
21 23 </view>
22   - <view class="h-30"></view>
23   - <view class="u-flex bottom-button">
  24 + <view class="h-45" :style="{paddingBottom:paddingBottom + 'px' }"></view>
  25 + <view class="u-flex bottom-button " :style="{paddingBottom:paddingBottom + 'px',background:'#fff' }">
24 26 <view class="button-item">
25 27 <u-button @click="resetQuery" type="info" shape="circle" :text="$t('common.resetting')">
26 28 </u-button>
... ... @@ -45,6 +47,7 @@
45 47 timeArea
46 48 } from '../config/data.js';
47 49 import queryItem from './query-item.vue'
  50 + import base from '@/config/baseUrl.js';
48 51
49 52 export default {
50 53 components: {
... ... @@ -72,6 +75,7 @@
72 75 startTime: 0,
73 76 endTime: 0,
74 77 },
  78 + paddingBottom: uni.$u?.sys?.()?.safeAreaInsets?.bottom || base?.systemInfo?.tabbarPaddingB,
75 79
76 80 };
77 81 },
... ... @@ -145,7 +149,6 @@
145 149
146 150 .popup-alarm-page {
147 151 margin-top: 97rpx;
148   - margin-left: 98rpx;
149 152 flex-direction: column;
150 153 justify-content: space-between;
151 154
... ... @@ -164,15 +167,18 @@
164 167
165 168 .bottom-button {
166 169 position: fixed;
167   - bottom: 10rpx;
  170 + bottom: -6rpx;
168 171 z-index: 9999;
169 172 flex-direction: row;
170 173 margin-top: 128rpx;
171   - margin-left: 10rpx;
172   -
  174 + margin-left: 98rpx;
173 175 .button-item {
174 176 width: 300rpx
175 177 }
  178 + // display: flex;
  179 + // justify-content: center;
  180 + width: 100%;
  181 + padding-top:12rpx
176 182 }
177 183 }
178 184 }
... ...