Commit 16484f0c5236e21b6ffe4f9fccccbd5ed846b33c

Authored by sqy
1 parent a8d35317

fix:[DEFECT-352] 修复滚动问题

1 <template> 1 <template>
2 <view class="command-record"> 2 <view class="command-record">
3 - <!-- 公共组件-每个页面必须引入 -->  
4 - <public-module></public-module>  
5 - <view class="search">  
6 - <view>  
7 - <view class="search-left"><u--input prefixIcon="search" placeholder="请输入名称搜索" shape="circle" @change="inputChanged"></u--input></view>  
8 - </view>  
9 - <view @click="openSearchDialog" class="search-right">  
10 - <text>筛选</text>  
11 - <image src="../../../static/shaixuan.png" />  
12 - </view> 3 + <view class="filter-button" @click="openSearchDialog">
  4 + <text>筛选</text>
  5 + <image src="../../../static/shaixuan.png" />
13 </view> 6 </view>
14 - <mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" @up="upCallback"> 7 +
  8 + <mescroll-uni ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" @up="upCallback" height="700px">
15 <view @click="openCommandDetail(item)" class="list-item" v-for="(item, index) in list" :key="index"> 9 <view @click="openCommandDetail(item)" class="list-item" v-for="(item, index) in list" :key="index">
16 <view class="item"> 10 <view class="item">
17 <view class="item-first"> 11 <view class="item-first">
@@ -30,10 +24,10 @@ @@ -30,10 +24,10 @@
30 <view class="time">{{ format(item.createTime) }}</view> 24 <view class="time">{{ format(item.createTime) }}</view>
31 </view> 25 </view>
32 </view> 26 </view>
33 - </mescroll-body> 27 + </mescroll-uni>
34 <!-- 告警筛选 --> 28 <!-- 告警筛选 -->
35 - <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20" @touchmove.stop.prevent="disabledScroll">  
36 - <view class="filter" @touchmove.stop.prevent="disabledScroll"> 29 + <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20" @touchmove.stop.prevent="disabledScroll">
  30 + <view class="filter" @touchmove.stop.prevent="disabledScroll">
37 <view class="filter-title"><text>筛选条件</text></view> 31 <view class="filter-title"><text>筛选条件</text></view>
38 <FilterItem :filterList="issueStatus" title="下发状态" @clickTag="currentIndex => handleClickTag(currentIndex, issueStatus)"></FilterItem> 32 <FilterItem :filterList="issueStatus" title="下发状态" @clickTag="currentIndex => handleClickTag(currentIndex, issueStatus)"></FilterItem>
39 <view class="button-group"> 33 <view class="button-group">
@@ -58,6 +52,7 @@ @@ -58,6 +52,7 @@
58 import FilterItem from '@/pages/device/FilterItem.vue'; 52 import FilterItem from '@/pages/device/FilterItem.vue';
59 import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js'; 53 import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js';
60 import { formatToDate } from '@/plugins/utils.js'; 54 import { formatToDate } from '@/plugins/utils.js';
  55 +import { debounce } from '@/plugins/throttle.js';
61 export default { 56 export default {
62 mixins: [MescrollMixin], 57 mixins: [MescrollMixin],
63 components: { 58 components: {
@@ -118,7 +113,7 @@ export default { @@ -118,7 +113,7 @@ export default {
118 format(date) { 113 format(date) {
119 return formatToDate(date, 'YYYY-MM-DD HH:mm:ss'); 114 return formatToDate(date, 'YYYY-MM-DD HH:mm:ss');
120 }, 115 },
121 - disabledScroll(){ 116 + disabledScroll() {
122 return; 117 return;
123 }, 118 },
124 /*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */ 119 /*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
@@ -184,7 +179,6 @@ export default { @@ -184,7 +179,6 @@ export default {
184 }, 179 },
185 confirmFilter() { 180 confirmFilter() {
186 const issueStatus = this.issueStatus.find(item => item.checked); 181 const issueStatus = this.issueStatus.find(item => item.checked);
187 - console.log('--------',this.tbDeviceId)  
188 this.loadData(1, { 182 this.loadData(1, {
189 status: issueStatus.type ? issueStatus.type : undefined, 183 status: issueStatus.type ? issueStatus.type : undefined,
190 tbDeviceId: this.tbDeviceId 184 tbDeviceId: this.tbDeviceId
@@ -205,76 +199,69 @@ export default { @@ -205,76 +199,69 @@ export default {
205 199
206 <style lang="scss" scoped> 200 <style lang="scss" scoped>
207 .command-record { 201 .command-record {
208 - padding: 0 20rpx;  
209 - .search { 202 + padding: 0 30rpx;
  203 + .filter-button {
  204 + font-size: 12px;
  205 + width: 160rpx;
  206 + height: 64rpx;
  207 + border-radius: 32rpx;
210 display: flex; 208 display: flex;
211 - justify-content: space-between;  
212 - padding-bottom: 10rpx;  
213 - border-bottom: 1px solid #f5f5f5;  
214 - .search-left {  
215 - width: 580rpx;  
216 - background-color: #f8f9fa;  
217 - border-radius: 200rpx;  
218 - }  
219 - .search-right {  
220 - display: flex;  
221 - align-items: center;  
222 - text {  
223 - color: #333;  
224 - font-size: 14px;  
225 - }  
226 - image {  
227 - width: 40rpx;  
228 - height: 40rpx;  
229 - } 209 + justify-content: center;
  210 + align-items: center;
  211 + background: #f0f1f2;
  212 + color: #666;
  213 + image {
  214 + width: 28rpx;
  215 + height: 28rpx;
  216 + margin-left: 4rpx;
230 } 217 }
231 } 218 }
  219 +}
232 220
233 - .list-item {  
234 - width: 690rpx;  
235 - background-color: #fff;  
236 - border-radius: 20rpx;  
237 - margin: 0 auto;  
238 - margin-bottom: 20rpx;  
239 - color: #333;  
240 - .item {  
241 - padding: 30rpx;  
242 - view {  
243 - font-size: 14px;  
244 - margin-bottom: 10rpx;  
245 - }  
246 - .time {  
247 - margin-top: 20rpx;  
248 - color: #999;  
249 - }  
250 - .item-first { 221 +.list-item {
  222 + width: 690rpx;
  223 + background-color: #fff;
  224 + border-radius: 20rpx;
  225 + margin: 20rpx auto;
  226 + color: #333;
  227 + .item {
  228 + padding: 30rpx;
  229 + view {
  230 + font-size: 14px;
  231 + margin-bottom: 10rpx;
  232 + }
  233 + .time {
  234 + margin-top: 20rpx;
  235 + color: #999;
  236 + }
  237 + .item-first {
  238 + display: flex;
  239 + justify-content: space-between;
  240 + align-items: center;
  241 + font-size: 15px;
  242 + font-weight: 500;
  243 + align-items: center;
  244 + .item-right {
251 display: flex; 245 display: flex;
252 - justify-content: space-between; 246 + justify-content: center;
253 align-items: center; 247 align-items: center;
254 - font-size: 15px;  
255 - font-weight: 500;  
256 - align-items: center;  
257 - .item-right {  
258 - display: flex;  
259 - justify-content: center;  
260 - align-items: center;  
261 - width: 104rpx;  
262 - height: 36rpx;  
263 - font-size: 10px;  
264 - border-radius: 20rpx;  
265 - }  
266 - .item-fail {  
267 - color: #848383;  
268 - background-color: #84838325;  
269 - }  
270 - .item.success {  
271 - color: #00c9a7;  
272 - background-color: #00c9a725;  
273 - } 248 + width: 104rpx;
  249 + height: 36rpx;
  250 + font-size: 10px;
  251 + border-radius: 20rpx;
  252 + }
  253 + .item-fail {
  254 + color: #848383;
  255 + background-color: #84838325;
274 } 256 }
  257 + .item.success {
  258 + color: #00c9a7;
  259 + background-color: #00c9a725;
  260 + }
275 } 261 }
276 } 262 }
277 } 263 }
  264 +
278 .filter { 265 .filter {
279 padding: 0 30rpx; 266 padding: 0 30rpx;
280 .filter-title { 267 .filter-title {
@@ -5,7 +5,7 @@ @@ -5,7 +5,7 @@
5 <image src="../../../static/shaixuan.png" /> 5 <image src="../../../static/shaixuan.png" />
6 </view> 6 </view>
7 7
8 - <mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" @up="upCallback"> 8 + <mescroll-uni ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" @up="upCallback" height="700px">
9 <view @click="openDeviceDetail(item)" class="list-item" v-for="(item, index) in list" :key="index"> 9 <view @click="openDeviceDetail(item)" class="list-item" v-for="(item, index) in list" :key="index">
10 <view class="item"> 10 <view class="item">
11 <view class="item-first"> 11 <view class="item-first">
@@ -56,9 +56,9 @@ @@ -56,9 +56,9 @@
56 <view class="time">{{ item.createdTime }}</view> 56 <view class="time">{{ item.createdTime }}</view>
57 </view> 57 </view>
58 </view> 58 </view>
59 - </mescroll-body> 59 + </mescroll-uni>
60 <!-- 告警筛选 --> 60 <!-- 告警筛选 -->
61 - <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20" @touchmove.stop.prevent="disabledScroll"> 61 + <u-popup @close="close" closeable bgColor="#fff" :show="show" mode="bottom" :round="20" @touchmove.stop.prevent="disabledScroll">
62 <view class="filter" @touchmove.stop.prevent="disabledScroll"> 62 <view class="filter" @touchmove.stop.prevent="disabledScroll">
63 <view class="filter-title"><text>筛选条件</text></view> 63 <view class="filter-title"><text>筛选条件</text></view>
64 <FilterItem :filterList="alarmStatus" title="告警状态" @clickTag="currentIndex => handleClickTag(currentIndex, alarmStatus)"></FilterItem> 64 <FilterItem :filterList="alarmStatus" title="告警状态" @clickTag="currentIndex => handleClickTag(currentIndex, alarmStatus)"></FilterItem>
@@ -224,7 +224,7 @@ export default { @@ -224,7 +224,7 @@ export default {
224 }; 224 };
225 }, 225 },
226 methods: { 226 methods: {
227 - disabledScroll(){ 227 + disabledScroll() {
228 return; 228 return;
229 }, 229 },
230 /*下拉刷新的回调 */ 230 /*下拉刷新的回调 */
@@ -409,4 +409,4 @@ export default { @@ -409,4 +409,4 @@ export default {
409 } 409 }
410 } 410 }
411 } 411 }
412 -</style> 412 +</style>